feat: SDK update for version 0.29.0

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Change log
 
+## 0.29.0
+
+* Breaking: Added `subscribe` message flow for Realtime subscription updates.
+* Breaking: Added `close()` support for Realtime subscriptions.
+* Added: Added `subscriptions` metadata to Realtime events for targeted callbacks.
+* Updated: Updated `X-Appwrite-Response-Format` header to `1.9.2`.
+
 ## 0.28.0
 
 * Added `x` OAuth provider to `OAuthProvider` enum

README.md

@@ -1,7 +1,7 @@
 # Appwrite React Native SDK
 
 ![License](https://img.shields.io/github/license/appwrite/sdk-for-react-native.svg?style=flat-square)
-![Version](https://img.shields.io/badge/api%20version-1.9.1-blue.svg?style=flat-square)
+![Version](https://img.shields.io/badge/api%20version-1.9.2-blue.svg?style=flat-square)
 [![Build Status](https://img.shields.io/travis/com/appwrite/sdk-generator?style=flat-square)](https://travis-ci.com/appwrite/sdk-generator)
 [![Twitter Account](https://img.shields.io/twitter/follow/appwrite?color=00acee&label=twitter&style=flat-square)](https://twitter.com/appwrite)
 [![Discord](https://img.shields.io/discord/564160730845151244?label=discord&style=flat-square)](https://appwrite.io/discord)

package.json

@@ -2,7 +2,7 @@
   "name": "react-native-appwrite",
   "homepage": "https://appwrite.io/support",
   "description": "Appwrite is an open-source self-hosted backend server that abstracts and simplifies complex and repetitive development tasks behind a very simple REST API",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "license": "BSD-3-Clause",
   "main": "dist/cjs/sdk.js",
   "exports": {

src/client.ts

@@ -57,15 +57,32 @@ type RealtimeResponse = {
 }
 
 type RealtimeRequest = {
-    type: 'authentication';
-    data: RealtimeRequestAuthenticate;
+    type: 'authentication' | 'subscribe';
+    data: RealtimeRequestAuthenticate | RealtimeRequestSubscribe[];
+}
+
+type RealtimeRequestSubscribe = {
+    subscriptionId?: string;
+    channels: string[];
+    queries: string[];
+}
+
+type RealtimeResponseAction = {
+    to?: string;
+    success?: boolean;
+    subscriptions?: Array<{
+        subscriptionId?: string;
+        channels?: string[];
+        queries?: string[];
+    }>;
 }
 
 export type RealtimeResponseEvent<T extends unknown> = {
     events: string[];
     channels: string[];
     timestamp: number;
     payload: T;
+    subscriptions?: string[];
 }
 
 type RealtimeResponseError = {
@@ -103,21 +120,22 @@ type Realtime = {
 
     url?: string;
     lastMessage?: RealtimeResponse;
-    channels: Set<string>;
-    queries: Set<string>;
     subscriptions: Map<number, {
         channels: string[];
         queries: string[];
         callback: (payload: RealtimeResponseEvent<any>) => void
     }>;
+    slotToSubscriptionId: Map<number, string>;
+    subscriptionIdToSlot: Map<string, number>;
+    pendingSubscribeSlots: number[];
     subscriptionsCounter: number;
     reconnect: boolean;
     reconnectAttempts: number;
     getTimeout: () => number;
     connect: () => void;
     createSocket: () => void;
     createHeartbeat: () => void;
-    cleanUp: (channels: string[], queries: string[]) => void;
+    sendSubscribeMessage: () => void;
     onMessage: (event: MessageEvent) => void;
 }
 
@@ -161,8 +179,8 @@ class Client {
         'x-sdk-name': 'React Native',
         'x-sdk-platform': 'client',
         'x-sdk-language': 'reactnative',
-        'x-sdk-version': '0.28.0',
-        'X-Appwrite-Response-Format': '1.9.1',
+        'x-sdk-version': '0.29.0',
+        'X-Appwrite-Response-Format': '1.9.2',
     };
 
     /**
@@ -377,9 +395,10 @@ class Client {
         timeout: undefined,
         heartbeat: undefined,
         url: '',
-        channels: new Set(),
-        queries: new Set(),
         subscriptions: new Map(),
+        slotToSubscriptionId: new Map(),
+        subscriptionIdToSlot: new Map(),
+        pendingSubscribeSlots: [],
         subscriptionsCounter: 0,
         reconnect: true,
         reconnectAttempts: 0,
@@ -414,20 +433,14 @@ class Client {
             }, 20_000);
         },
         createSocket: () => {
-            if (this.realtime.channels.size < 1) {
+            if (this.realtime.subscriptions.size < 1) {
                 this.realtime.reconnect = false;
                 this.realtime.socket?.close();
                 return;
             }
 
             const channels = new URLSearchParams();
             channels.set('project', this.config.project);
-            this.realtime.channels.forEach(channel => {
-                channels.append('channels[]', channel);
-            });
-            this.realtime.queries.forEach(query => {
-                channels.append('queries[]', query);
-            });
 
             const url = this.config.endpointRealtime + '/realtime?' + channels.toString();
 
@@ -476,23 +489,107 @@ class Client {
                         this.realtime.createSocket();
                     }, timeout);
                 })
+            } else if (this.realtime.socket?.readyState === WebSocket.OPEN) {
+                // URL is unchanged; re-send subscribe message to apply updated queries.
+                this.realtime.sendSubscribeMessage();
+            }
+        },
+        sendSubscribeMessage: () => {
+            if (!this.realtime.socket || this.realtime.socket.readyState !== WebSocket.OPEN) {
+                return;
             }
+
+            const rows: RealtimeRequestSubscribe[] = [];
+            this.realtime.pendingSubscribeSlots = [];
+
+            this.realtime.subscriptions.forEach((sub, slot) => {
+                const queries = sub.queries ?? [];
+
+                const row: RealtimeRequestSubscribe = {
+                    channels: sub.channels,
+                    queries
+                };
+                const knownSubscriptionId = this.realtime.slotToSubscriptionId.get(slot);
+                if (knownSubscriptionId) {
+                    row.subscriptionId = knownSubscriptionId;
+                }
+
+                rows.push(row);
+                this.realtime.pendingSubscribeSlots.push(slot);
+            });
+
+            if (rows.length < 1) {
+                return;
+            }
+
+            this.realtime.socket.send(JSONbig.stringify(<RealtimeRequest>{
+                type: 'subscribe',
+                data: rows
+            }));
         },
         onMessage: (event) => {
             try {
                 const message: RealtimeResponse = JSONbig.parse(event.data);
                 this.realtime.lastMessage = message;
                 switch (message.type) {
+                    case 'connected': {
+                        const messageData = <RealtimeResponseConnected>message.data;
+
+                        let session = this.config.session;
+                        if (!session) {
+                            const cookie = JSONbig.parse(window.localStorage.getItem('cookieFallback') ?? '{}');
+                            session = cookie?.[`a_session_${this.config.project}`];
+                        }
+                        if (session && !messageData?.user) {
+                            this.realtime.socket?.send(JSONbig.stringify(<RealtimeRequest>{
+                                type: 'authentication',
+                                data: {
+                                    session
+                                }
+                            }));
+                        }
+
+                        this.realtime.sendSubscribeMessage();
+                        break;
+                    }
+                    case 'response': {
+                        const action = message.data as RealtimeResponseAction;
+                        if (action?.to !== 'subscribe' || !Array.isArray(action.subscriptions)) {
+                            break;
+                        }
+
+                        action.subscriptions.forEach((subscription, index) => {
+                            const subscriptionId = subscription?.subscriptionId;
+                            const slot = this.realtime.pendingSubscribeSlots[index];
+                            if (!subscriptionId || slot === undefined) {
+                                return;
+                            }
+
+                            this.realtime.slotToSubscriptionId.set(slot, subscriptionId);
+                            this.realtime.subscriptionIdToSlot.set(subscriptionId, slot);
+                        });
+                        break;
+                    }
                     case 'event':
-                        let data = <RealtimeResponseEvent<unknown>>message.data;
+                        const data = <RealtimeResponseEvent<unknown>>message.data;
                         if (data?.channels) {
-                            const isSubscribed = data.channels.some(channel => this.realtime.channels.has(channel));
-                            if (!isSubscribed) return;
-                            this.realtime.subscriptions.forEach(subscription => {
-                                if (data.channels.some(channel => subscription.channels.includes(channel))) {
-                                    setTimeout(() => subscription.callback(data));
-                                }
-                            })
+                            if (data.subscriptions && data.subscriptions.length > 0) {
+                                data.subscriptions.forEach((subscriptionId) => {
+                                    const slot = this.realtime.subscriptionIdToSlot.get(subscriptionId);
+                                    if (slot !== undefined) {
+                                        const subscription = this.realtime.subscriptions.get(slot);
+                                        if (subscription) {
+                                            setTimeout(() => subscription.callback(data));
+                                        }
+                                    }
+                                });
+                            } else {
+                                this.realtime.subscriptions.forEach(subscription => {
+                                    if (data.channels.some(channel => subscription.channels.includes(channel))) {
+                                        setTimeout(() => subscription.callback(data));
+                                    }
+                                });
+                            }
                         }
                         break;
                     case 'pong':
@@ -505,31 +602,6 @@ class Client {
             } catch (e) {
                 console.error(e);
             }
-        },
-        cleanUp: (channels, queries) => {
-            this.realtime.channels.forEach(channel => {
-                if (channels.includes(channel)) {
-                    let found = Array.from(this.realtime.subscriptions).some(([_key, subscription] )=> {
-                        return subscription.channels.includes(channel);
-                    })
-
-                    if (!found) {
-                        this.realtime.channels.delete(channel);
-                    }
-                }
-            })
-
-            this.realtime.queries.forEach(query => {
-                if (queries.includes(query)) {
-                    let found = Array.from(this.realtime.subscriptions).some(([_key, subscription]) => {
-                        return subscription.queries?.includes(query);
-                    })
-
-                    if (!found) {
-                        this.realtime.queries.delete(query);
-                    }
-                }
-            })
         }
     }
 
@@ -564,10 +636,8 @@ class Client {
         queries: (string | Query)[] = []
     ): () => void {
         let channelArray = typeof channels === 'string' ? [channels] : channels;
-        channelArray.forEach(channel => this.realtime.channels.add(channel));
 
         const queryStrings = (queries ?? []).map(q => typeof q === 'string' ? q : q.toString());
-        queryStrings.forEach(query => this.realtime.queries.add(query));
 
         const counter = this.realtime.subscriptionsCounter++;
         this.realtime.subscriptions.set(counter, {
@@ -579,8 +649,12 @@ class Client {
         this.realtime.connect();
 
         return () => {
+            const subscriptionId = this.realtime.slotToSubscriptionId.get(counter);
             this.realtime.subscriptions.delete(counter);
-            this.realtime.cleanUp(channelArray, queryStrings);
+            this.realtime.slotToSubscriptionId.delete(counter);
+            if (subscriptionId) {
+                this.realtime.subscriptionIdToSlot.delete(subscriptionId);
+            }
             this.realtime.connect();
         }
     }

src/models.ts

@@ -984,6 +984,10 @@ export namespace Models {
          * User email address. Hide this attribute by toggling membership privacy in the Console.
          */
         userEmail: string;
+        /**
+         * User phone number. Hide this attribute by toggling membership privacy in the Console.
+         */
+        userPhone: string;
         /**
          * Team ID.
          */