Skip to content
This repository was archived by the owner on Sep 29, 2023. It is now read-only.

Commit 81ba9b2

Browse files
TorstenDittmannTorstenDittmann
authored
Merge pull request #206 from appwrite/feat-upgrade-web-syntax
Feat: Migrate to new web syntax
2 parents b81ffd0 + 9834085 commit 81ba9b2

File tree

6 files changed

+99
-49
lines changed

6 files changed

+99
-49
lines changed

‎app/views/docs/databases.phtml‎

Lines changed: 20 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -116,10 +116,17 @@
116116
<li>
117117
<h3>Web</h3>
118118
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
119-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Appwrite } from "appwrite";
119+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client, Databases } from "appwrite";
120120

121-
const sdk = new Appwrite();
122-
const promise = sdk.databases.createDocument('[DATABASE_ID]', '[COLLECTION_ID]', 'unique()', {});
121+
const client = new Client();
122+
123+
client
124+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
125+
.setProject('[PROJECT_ID]');
126+
127+
const database = new Databases(client, '[DATABASE_ID]');
128+
129+
const promise = database.createDocument('[COLLECTION_ID]', 'unique()', {});
123130

124131
promise.then(function (response) {
125132
console.log(response); // Success
@@ -217,9 +224,10 @@ func main() async throws {
217224
<li>
218225
<h3>Web</h3>
219226
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
220-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Query } from "appwrite";
227+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Databases, Query } from "appwrite";
228+
const database = new Databases(client, "[DATABASE_ID]"); // 'client' comes from setup
221229

222-
sdk.databases.listDocuments('[DATABASE_ID]', 'movies', [
230+
database.listDocuments('movies', [
223231
Query.equal('title', 'Avatar')
224232
]);
225233
</code></pre>
@@ -347,10 +355,13 @@ func main() async throws{
347355
<li>
348356
<h3>Web</h3>
349357
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
350-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>sdk.databases.listDocuments('[DATABASE_ID]', 'movies', [
351-
Query.equal('title', ['Avatar', 'Lord of the Rings']),
352-
Query.greater('year', 1999)
353-
]);
358+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Databases, Query } from "appwrite";
359+
const database = new Databases(client, "[DATABASE_ID]"); // 'client' comes from setup
360+
361+
database.listDocuments('movies', [
362+
Query.equal('title', ['Avatar', 'Lord of the Rings']),
363+
Query.greater('year', 1999)
364+
]);
354365
</code></pre>
355366
</div>
356367
</li>

‎app/views/docs/functions.phtml‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -546,14 +546,17 @@ $image = new View(__DIR__.'/../general/image.phtml');
546546
<li>
547547
<h3>Web</h3>
548548
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
549-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
549+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client, Functions } from "appwrite";
550550

551-
sdk
552-
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
553-
.setProject('5df5acd0d48c2') // Your project ID
554-
;
551+
const client = new Client();
552+
553+
client
554+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
555+
.setProject('[PROJECT_ID]');
556+
557+
const database = new Databases(client, '[DATABASE_ID]');
555558

556-
let promise = sdk.functions.createExecution('[FUNCTION_ID]');
559+
let promise = functions.createExecution('[FUNCTION_ID]');
557560

558561
promise.then(function (response) {
559562
console.log(response); // Success

‎app/views/docs/pagination.phtml‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,14 @@
1313
<li>
1414
<h3>Web</h3>
1515
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
16-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>// Page 1
17-
const page1 = await sdk.database.listDocuments('movies', [], 25, 0);
16+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Databases } from "appwrite";
17+
const database = new Databases(client, "[DATABASE_ID]"); // 'client' comes from setup
18+
19+
// Page 1
20+
const page1 = await database.listDocuments('movies', [], 25, 0);
21+
1822
// Page 2
19-
const page2 = await sdk.database.listDocuments('movies', [], 25, 25);
23+
const page2 = await database.listDocuments('movies', [], 25, 25);
2024
</code></pre>
2125
</div>
2226
</li>
@@ -129,12 +133,15 @@ func main() async throws {
129133
<li>
130134
<h3>Web</h3>
131135
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
132-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>// Page 1
133-
const page1 = await sdk.database.listDocuments('movies', [], 25, 0);
136+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Databases } from "appwrite";
137+
const database = new Databases(client, "[DATABASE_ID]"); // 'client' comes from setup
138+
139+
// Page 1
140+
const page1 = await database.listDocuments('movies', [], 25, 0);
134141
const lastId = results.documents[results.documents.length - 1].$id;
135142

136143
// Page 2
137-
const page2 = await sdk.database.listDocuments('movies', [], 25, 0, lastId);
144+
const page2 = await database.listDocuments('movies', [], 25, 0, lastId);
138145
</code></pre>
139146
</div>
140147
</li>

‎app/views/docs/permissions.phtml‎

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -112,13 +112,17 @@
112112
<p>In the following example, we are creating a document that can be read by everyone and only be edited, or deleted by a user with a UID <span class="tag">user:5c1f88b42259e</span>.</p>
113113

114114
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
115-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
115+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client, Databases } from "appwrite";
116+
117+
const client = new Client();
116118

117-
sdk
118-
.setProject('')
119-
;
119+
client
120+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
121+
.setProject('[PROJECT_ID]');
120122

121-
let promise = sdk.database.createDocument(
123+
const database = new Databases(client, '[DATABASE_ID]');
124+
125+
let promise = database.createDocument(
122126
'[COLLECTION_ID]',
123127
{'actorName': 'Chris Evans', 'height': 183},
124128
['role:all'], // Anyone can view this document
@@ -139,13 +143,17 @@ promise.then(function (response) {
139143
<p>In the following example, we are creating a document that can be read-only by members of <span class="tag">team:5c1f88b87435e</span> and can only be edited, or deleted by members of the same team that possesses the role <span class="tag">owner</span>.</p>
140144

141145
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
142-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
146+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client, Databases } from "appwrite";
147+
148+
const client = new Client();
149+
150+
client
151+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
152+
.setProject('[PROJECT_ID]');
143153

144-
sdk
145-
.setProject('')
146-
;
154+
const database = new Databases(client, '[DATABASE_ID]');
147155

148-
let promise = sdk.database.createDocument(
156+
let promise = database.createDocument(
149157
'[COLLECTION_ID]',
150158
{'actorName': 'Chris Evans', 'height': 183},
151159
['team:5c1f88b87435e'], // The user must be a team member to grant this permission

‎app/views/docs/realtime.phtml‎

Lines changed: 33 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -27,15 +27,16 @@ $channels = [
2727
<li>
2828
<h3>Web</h3>
2929
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
30-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
30+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client } from "appwrite";
3131

32-
sdk
33-
.setEndpoint('https://[HOSTNAME_OR_IP]/v1') // Your API Endpoint
34-
.setProject('5df5acd0d48c2') // Your project ID
35-
;
32+
const client = new Client();
33+
34+
client
35+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
36+
.setProject('[PROJECT_ID]');
3637

3738
// Subscribe to files channel
38-
sdk.subscribe('files', response => {
39+
client.subscribe('files', response => {
3940
if(response.events.includes('buckets.*.files.*.create')) {
4041
// Log when a new file is uploaded
4142
console.log(response.payload);
@@ -132,9 +133,15 @@ let subscription = realtime.subscribe(channels: ["files"]) { message in
132133
<li>
133134
<h3>Web</h3>
134135
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
135-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
136+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client } from "appwrite";
137+
138+
const client = new Client();
139+
140+
client
141+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
142+
.setProject('[PROJECT_ID]');
136143

137-
sdk.subscribe('account', response => {
144+
client.subscribe('account', response => {
138145
// Callback will be executed on all account events.
139146
console.log(response);
140147
});</code></pre>
@@ -189,9 +196,14 @@ realtime.subscribe(channel: "account", callback: { param in
189196
<li>
190197
<h3>Web</h3>
191198
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
192-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
199+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client } from "appwrite";
200+
const client = new Client();
193201

194-
sdk.subscribe(['databases.A.collections.A.documents.A', 'files'], response => {
202+
client
203+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
204+
.setProject('[PROJECT_ID]');
205+
206+
client.subscribe(['collections.A.documents.A', 'files'], response => {
195207
// Callback will be executed on changes for documents A and all files.
196208
console.log(response);
197209
});</code></pre>
@@ -245,9 +257,15 @@ realtime.subscribe(channels: ["databases.A.collections.A.documents.A", "files"],
245257
<li>
246258
<h3>Web</h3>
247259
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
248-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
260+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client } from "appwrite";
261+
262+
const client = new Client();
249263

250-
const unsubscribe = sdk.subscribe('files', response => {
264+
client
265+
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
266+
.setProject('[PROJECT_ID]');
267+
268+
const unsubscribe = client.subscribe('files', response => {
251269
// Callback will be executed on changes for all files.
252270
console.log(response);
253271
});
@@ -435,9 +453,10 @@ subscription.close()</code></pre>
435453
<li>
436454
<h3>Web</h3>
437455
<div class="ide margin-bottom" data-lang="javascript" data-lang-label="Web SDK">
438-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>const sdk = new Appwrite();
456+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client } from "appwrite";
457+
const client = new Client();
439458

440-
sdk.setEndpointRealtime('[HOSTNAME_OR_IP]');</code></pre>
459+
client.setEndpointRealtime('[HOSTNAME_OR_IP]');</code></pre>
441460
</div>
442461
</li>
443462
<li>

‎app/views/docs/storage.phtml‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -74,15 +74,17 @@
7474
<li>
7575
<h3>Web</h3>
7676
<div class="ide" data-lang="javascript" data-lang-label="Web SDK">
77-
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Appwrite } from "appwrite";
77+
<pre class="line-numbers"><code class="prism language-javascript" data-prism>import { Client, Storge } from "appwrite";
7878

79-
const sdk = new Appwrite();
79+
const client = new Client();
8080

81-
sdk
81+
client
8282
.setEndpoint('https://[HOSTNAME_OR_IP]/v1')
8383
.setProject('[PROJECT_ID]');
8484

85-
const promise = sdk.storage.createFile('[BUCKET_ID]', 'unique()', document.getElementById('uploader').files[0]);
85+
const storage = new Storage(client);
86+
87+
const promise = storage.createFile('[BUCKET_ID]', 'unique()', document.getElementById('uploader').files[0]);
8688

8789
promise.then(function (response) {
8890
console.log(response); // Success

0 commit comments

Comments
 (0)