pocketbase-react 0.1.13 → 0.1.15

package/es/store/store.js

@@ -9,10 +9,10 @@ const CustomStorage = {
     return await StorageService.get(key);
   },
   setItem: async (key, value, ..._args) => {
-    return StorageService.set(key, value);
+    return await StorageService.set(key, value);
   },
   removeItem: async (key, ..._args) => {
-    return StorageService.remove(key);
+    return await StorageService.remove(key);
   }
 };
 export const persistConfig = {

package/es/store/types/index.d.ts

@@ -4,4 +4,8 @@ export declare const ADD_RECORDS = "ADD_RECORDS";
 export declare const UPDATE_RECORD = "UPDATE_RECORD";
 export declare const DELETE_RECORD = "DELETE_RECORD";
 export declare const DELETE_RECORDS = "DELETE_RECORDS";
-export declare type Types = typeof SET_RECORDS | typeof ADD_RECORD | typeof ADD_RECORDS | typeof UPDATE_RECORD | typeof DELETE_RECORD | typeof DELETE_RECORDS;
+export declare type RecordTypes = typeof SET_RECORDS | typeof ADD_RECORD | typeof ADD_RECORDS | typeof UPDATE_RECORD | typeof DELETE_RECORD | typeof DELETE_RECORDS;
+export declare const SET_SUBSCRIPTIONS = "SET_SUBSCRIPTIONS";
+export declare const ADD_SUBSCRIPTION = "ADD_SUBSCRIPTION";
+export declare const DELETE_SUBSCRIPTION = "DELETE_SUBSCRIPTION";
+export declare type SubscriptionsTypes = typeof SET_SUBSCRIPTIONS | typeof ADD_SUBSCRIPTION | typeof DELETE_SUBSCRIPTION;

package/es/store/types/index.js

@@ -3,4 +3,7 @@ export const ADD_RECORD = 'ADD_RECORD';
 export const ADD_RECORDS = 'ADD_RECORDS';
 export const UPDATE_RECORD = 'UPDATE_RECORD';
 export const DELETE_RECORD = 'DELETE_RECORD';
-export const DELETE_RECORDS = 'DELETE_RECORDS';
+export const DELETE_RECORDS = 'DELETE_RECORDS';
+export const SET_SUBSCRIPTIONS = 'SET_SUBSCRIPTIONS';
+export const ADD_SUBSCRIPTION = 'ADD_SUBSCRIPTION';
+export const DELETE_SUBSCRIPTION = 'DELETE_SUBSCRIPTION';

package/lib/context/content.js

@@ -6,7 +6,6 @@ var store = _interopRequireWildcard(require("../store/store"));
 var React = _interopRequireWildcard(require("react"));
 var _useClientContext = require("../hooks/useClientContext");
 var _actions = require("../store/actions");
-var _Storage = require("../service/Storage");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const ContentContext = (0, React.createContext)({});
@@ -14,7 +13,6 @@ exports.ContentContext = ContentContext;
 const ContentProvider = props => {
   const client = (0, _useClientContext.useClientContext)();
   const dispatch = store.useAppDispatch;
-  const [collections, _] = React.useState(props.collections || []);
   const actions = {
     subscribe: async collectionName => {
       await (client == null ? void 0 : client.realtime.subscribe(collectionName, event => {
@@ -31,23 +29,21 @@ const ContentProvider = props => {
           default:
             break;
         }
-      }).then(async () => {
-        var _await$StorageService;
-        const subscribed = JSON.parse((_await$StorageService = await _Storage.StorageService.get("subscribed")) != null ? _await$StorageService : JSON.stringify([]));
-        await _Storage.StorageService.set("subscribed", JSON.stringify([...subscribed, collectionName]));
-      }).catch(_error => {}));
+      }).then(() => {
+        dispatch(_actions.subscriptionsAction.addSubscription(collectionName));
+      }).catch(_error => {
+        dispatch(_actions.subscriptionsAction.deleteSubscription(collectionName));
+      }));
     },
-    unsubscribe: collectionName => {
+    unsubscribe: async collectionName => {
       if (collectionName) {
-        client == null ? void 0 : client.realtime.unsubscribe(collectionName).then(async () => {
-          var _await$StorageService2;
-          const subscribed = JSON.parse((_await$StorageService2 = await _Storage.StorageService.get("subscribed")) != null ? _await$StorageService2 : JSON.stringify([]));
-          await _Storage.StorageService.set("subscribed", JSON.stringify(subscribed.filter(name => name !== collectionName)));
-        }).catch(_error => {});
+        await (client == null ? void 0 : client.realtime.unsubscribe(collectionName).then(() => {
+          dispatch(_actions.subscriptionsAction.deleteSubscription(collectionName));
+        }).catch(_error => {}));
       } else {
-        client == null ? void 0 : client.realtime.unsubscribe().then(async () => {
-          await _Storage.StorageService.set("subscribed", JSON.stringify([]));
-        }).catch(_error => {});
+        await (client == null ? void 0 : client.realtime.unsubscribe().then(() => {
+          dispatch(_actions.subscriptionsAction.setSubscriptions([]));
+        }).catch(_error => {}));
       }
     },
     fetch: async collectionName => {
@@ -65,18 +61,20 @@ const ContentProvider = props => {
     }
   };
   (0, React.useEffect)(() => {
-    if (collections) {
-      collections.forEach(collectionName => {
-        actions.fetch(collectionName);
-        actions.subscribe(collectionName);
+    if (props.collections) {
+      props.collections.forEach(async collectionName => {
+        await actions.fetch(collectionName);
+        await actions.subscribe(collectionName);
       });
     }
-    return () => actions.unsubscribe();
-  }, [collections]);
+    return () => {
+      (async () => {
+        await actions.unsubscribe();
+      })();
+    };
+  }, [props.collections]);
   return /*#__PURE__*/React.createElement(ContentContext.Provider, {
-    value: {
-      actions
-    }
+    value: actions
   }, props.children);
 };
 exports.ContentProvider = ContentProvider;

package/lib/hooks/useAppContent.js

@@ -5,42 +5,29 @@ exports.useAppContent = useAppContent;
 var _react = require("react");
 var store = _interopRequireWildcard(require("../store"));
 var _context = require("../context");
-var _Storage = require("../service/Storage");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function useAppContent(collectionName, initialFetch = false) {
   var _store$useAppSelector;
   const records = (_store$useAppSelector = store.useAppSelector(state => state.reducer.records[collectionName])) != null ? _store$useAppSelector : [];
+  const subscriptions = store.useAppSelector(state => state.reducer.subscriptions).subscriptions;
   const context = (0, _react.useContext)(_context.ContentContext);
   (0, _react.useEffect)(() => {
     if (initialFetch) {
-      context.actions.fetch(collectionName);
+      context.fetch(collectionName);
     }
   }, [collectionName, initialFetch]);
   const [isSubscribed, setIsSubscribed] = (0, _react.useState)(false);
-  async function refetchSubscribeState() {
-    var _await$StorageService;
-    const isSubscribed = JSON.parse((_await$StorageService = await _Storage.StorageService.get("subscribed")) != null ? _await$StorageService : JSON.stringify([]));
-    setIsSubscribed(isSubscribed.includes(collectionName));
-  }
   (0, _react.useEffect)(() => {
-    (async () => {
-      await refetchSubscribeState();
-    })();
-  }, []);
+    setIsSubscribed(subscriptions.includes(collectionName));
+  }, [subscriptions]);
   const actions = {
-    subscribe: async () => {
-      await context.actions.subscribe(collectionName);
-      await refetchSubscribeState();
-    },
-    unsubscribe: () => {
-      context.actions.unsubscribe(collectionName);
-      refetchSubscribeState();
-    },
-    fetch: async () => await context.actions.fetch(collectionName),
-    create: async record => await context.actions.create(collectionName, record),
-    update: async (id, record) => await context.actions.update(collectionName, id, record),
-    delete: async id => await context.actions.delete(collectionName, id)
+    subscribe: async () => await context.subscribe(collectionName),
+    unsubscribe: async () => await context.unsubscribe(collectionName),
+    fetch: async () => await context.fetch(collectionName),
+    create: async record => await context.create(collectionName, record),
+    update: async (id, record) => await context.update(collectionName, id, record),
+    delete: async id => await context.delete(collectionName, id)
   };
   return {
     records,

package/lib/service/Authentication.js

@@ -30,7 +30,7 @@ class AuthenticationService {
   }
   async getUserData(id, token) {
     const headers = new Headers();
-    headers.append("Authorization", "user " + token);
+    headers.append('Authorization', 'user ' + token);
     return await this.client.users.getOne(id);
   }
 }

package/lib/service/Storage.js

@@ -23,4 +23,7 @@ class StorageService {
     }
   }
 }
-exports.StorageService = StorageService;
+exports.StorageService = StorageService;
+StorageService.Constants = {
+  SUBSCRIBED: 'subscribed'
+};

package/lib/store/actions/index.js

@@ -1,8 +1,10 @@
 "use strict";
 
 exports.__esModule = true;
-exports.recordsAction = void 0;
+exports.subscriptionsAction = exports.recordsAction = void 0;
 var recordsAction = _interopRequireWildcard(require("./records"));
 exports.recordsAction = recordsAction;
+var subscriptionsAction = _interopRequireWildcard(require("./subscriptions"));
+exports.subscriptionsAction = subscriptionsAction;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/store/actions/subscriptions.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports.setSubscriptions = exports.deleteSubscription = exports.addSubscription = void 0;
+var ReduxType = _interopRequireWildcard(require("../types"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const setSubscriptions = payload => ({
+  type: ReduxType.SET_SUBSCRIPTIONS,
+  payload
+});
+exports.setSubscriptions = setSubscriptions;
+const addSubscription = payload => ({
+  type: ReduxType.ADD_SUBSCRIPTION,
+  payload
+});
+exports.addSubscription = addSubscription;
+const deleteSubscription = payload => ({
+  type: ReduxType.DELETE_SUBSCRIPTION,
+  payload
+});
+exports.deleteSubscription = deleteSubscription;

package/lib/store/reducers/index.js

@@ -4,7 +4,9 @@ exports.__esModule = true;
 exports.appReducer = void 0;
 var _redux = require("redux");
 var _records = require("./records");
+var _subscriptions = require("./subscriptions");
 const appReducer = (0, _redux.combineReducers)({
-  records: _records.records
+  records: _records.records,
+  subscriptions: _subscriptions.subscriptions
 });
 exports.appReducer = appReducer;

package/lib/store/reducers/subscriptions.js

@@ -0,0 +1,37 @@
+"use strict";
+
+exports.__esModule = true;
+exports.subscriptions = void 0;
+var ReduxType = _interopRequireWildcard(require("../types"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function appendSubscription(subscription, subscriptions) {
+  return [...subscriptions, subscription];
+}
+function deleteSubscription(subscription, subscriptions) {
+  return subscriptions.filter(sub => sub !== subscription);
+}
+const subscriptions = (state = {
+  subscriptions: []
+}, action) => {
+  const list = state.subscriptions;
+  switch (action.type) {
+    case ReduxType.SET_SUBSCRIPTIONS:
+      if (Array.isArray(action.payload)) {
+        return {
+          subscriptions: action.payload
+        };
+      }
+    case ReduxType.ADD_SUBSCRIPTION:
+      return {
+        subscriptions: appendSubscription(action.payload, list)
+      };
+    case ReduxType.DELETE_SUBSCRIPTION:
+      return {
+        subscriptions: deleteSubscription(action.payload, list)
+      };
+    default:
+      return state;
+  }
+};
+exports.subscriptions = subscriptions;

package/lib/store/store.js

@@ -14,10 +14,10 @@ const CustomStorage = {
     return await _Storage.StorageService.get(key);
   },
   setItem: async (key, value, ..._args) => {
-    return _Storage.StorageService.set(key, value);
+    return await _Storage.StorageService.set(key, value);
   },
   removeItem: async (key, ..._args) => {
-    return _Storage.StorageService.remove(key);
+    return await _Storage.StorageService.remove(key);
   }
 };
 const persistConfig = {

package/lib/store/types/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.UPDATE_RECORD = exports.SET_RECORDS = exports.DELETE_RECORDS = exports.DELETE_RECORD = exports.ADD_RECORDS = exports.ADD_RECORD = void 0;
+exports.UPDATE_RECORD = exports.SET_SUBSCRIPTIONS = exports.SET_RECORDS = exports.DELETE_SUBSCRIPTION = exports.DELETE_RECORDS = exports.DELETE_RECORD = exports.ADD_SUBSCRIPTION = exports.ADD_RECORDS = exports.ADD_RECORD = void 0;
 const SET_RECORDS = 'SET_RECORDS';
 exports.SET_RECORDS = SET_RECORDS;
 const ADD_RECORD = 'ADD_RECORD';
@@ -13,4 +13,10 @@ exports.UPDATE_RECORD = UPDATE_RECORD;
 const DELETE_RECORD = 'DELETE_RECORD';
 exports.DELETE_RECORD = DELETE_RECORD;
 const DELETE_RECORDS = 'DELETE_RECORDS';
-exports.DELETE_RECORDS = DELETE_RECORDS;
+exports.DELETE_RECORDS = DELETE_RECORDS;
+const SET_SUBSCRIPTIONS = 'SET_SUBSCRIPTIONS';
+exports.SET_SUBSCRIPTIONS = SET_SUBSCRIPTIONS;
+const ADD_SUBSCRIPTION = 'ADD_SUBSCRIPTION';
+exports.ADD_SUBSCRIPTION = ADD_SUBSCRIPTION;
+const DELETE_SUBSCRIPTION = 'DELETE_SUBSCRIPTION';
+exports.DELETE_SUBSCRIPTION = DELETE_SUBSCRIPTION;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pocketbase-react",
-  "version": "0.1.13",
+  "version": "0.1.15",
   "description": "Unofficial React SDK (React, React Native, Expo) for interacting with the PocketBase JS SDK",
   "keywords": [
     "pocketbase",

package/src/context/Pocketbase.tsx

@@ -26,7 +26,10 @@ export const Pocketbase = (props: PocketbaseProviderProps) => {
     <ClientProvider client={client}>
       <Provider store={store.store}>
         <PersistGate persistor={store.persistor}>
-          <AuthProvider webRedirectUrl={props.webRedirectUrl}  mobileRedirectUrl={props.mobileRedirectUrl} openURL={props.openURL} >
+          <AuthProvider
+            webRedirectUrl={props.webRedirectUrl}
+            mobileRedirectUrl={props.mobileRedirectUrl}
+            openURL={props.openURL}>
             <ContentProvider collections={props.initialCollections}>
               {props.children}
             </ContentProvider>
@@ -34,5 +37,5 @@ export const Pocketbase = (props: PocketbaseProviderProps) => {
         </PersistGate>
       </Provider>
     </ClientProvider>
-  ): null;  
+  ) : null;
 };

package/src/context/auth.tsx

@@ -25,7 +25,7 @@ export type UpdateEmailType = (email: string) => Promise<void>;
 export type DeleteUserType = (id: string) => Promise<void>;
 
 export interface AuthActions {
-  registerWithEmail: RegisterWithEmailType
+  registerWithEmail: RegisterWithEmailType;
   signInWithEmail: SignInWithEmailType;
   signInWithProvider: SignInWithProviderType;
   submitProviderResult: SubmitProviderResultType;
@@ -46,11 +46,10 @@ export type AuthProviderProps = {
   openURL: (url: string) => Promise<void>;
 };
 
-
 export const AuthProvider = (props: AuthProviderProps) => {
   const client = useClientContext();
   const [authProviders, setAuthProviders] = React.useState<AuthProviderInfo[]>();
-  
+
   const actions: AuthActions = {
     registerWithEmail: async (email, password) => {
       await client?.users.create({
@@ -64,7 +63,10 @@ export const AuthProvider = (props: AuthProviderProps) => {
     },
     signInWithProvider: async (provider: string) => {
       const authProvider = authProviders?.find((p) => p.name === provider);
-      const url = authProvider?.authUrl + typeof document !== 'undefined' ? props.webRedirectUrl: props.mobileRedirectUrl;
+      const url =
+        authProvider?.authUrl + typeof document !== 'undefined'
+          ? props.webRedirectUrl
+          : props.mobileRedirectUrl;
       await props.openURL(url);
       await StorageService.set('provider', JSON.stringify(authProviders));
     },
@@ -77,7 +79,12 @@ export const AuthProvider = (props: AuthProviderProps) => {
         const providers = JSON.parse(providersString) as AuthProviderInfo[];
         const authProvider = providers?.find((p) => p.state === state);
         if (authProvider && code) {
-          await client?.users.authViaOAuth2(authProvider.name, code, authProvider.codeVerifier, typeof document !== 'undefined' ? props.webRedirectUrl: props.mobileRedirectUrl);
+          await client?.users.authViaOAuth2(
+            authProvider.name,
+            code,
+            authProvider.codeVerifier,
+            typeof document !== 'undefined' ? props.webRedirectUrl : props.mobileRedirectUrl
+          );
         }
       }
     },
@@ -97,8 +104,8 @@ export const AuthProvider = (props: AuthProviderProps) => {
       await client?.users.requestEmailChange(email);
     },
     deleteUser: async (id: string) => {
-      await client?.users.delete(id)
-    }
+      await client?.users.delete(id);
+    },
   };
 
   React.useEffect(() => {
@@ -108,7 +115,5 @@ export const AuthProvider = (props: AuthProviderProps) => {
     })();
   }, [props.webRedirectUrl, props.mobileRedirectUrl]);
 
-  return (
-    <AuthContext.Provider value={actions}>{props.children}</AuthContext.Provider>
-  );
+  return <AuthContext.Provider value={actions}>{props.children}</AuthContext.Provider>;
 };

package/src/context/content.tsx

@@ -4,10 +4,10 @@ import { createContext, useEffect } from 'react';
 import { useClientContext } from '../hooks/useClientContext';
 import { Record } from '../interfaces/Record';
 import { recordsAction } from '../store/actions';
-import { StorageService } from '../service/Storage';
+import { subscriptionsAction } from '../store/actions';
 
 type SubscribeType = (collectionName: string) => Promise<void>;
-type UnsubscribeType = (collectionName?: string) => void;
+type UnsubscribeType = (collectionName?: string) => Promise<void>;
 type FetchType = (collectionName: string) => Promise<void>;
 type CreateType = (collectionName: string, record: {}) => Promise<void>;
 type UpdateType = (collectionName: string, recordId: string, record: {}) => Promise<void>;
@@ -22,11 +22,7 @@ interface ContentActions {
   delete: DeleteType;
 }
 
-interface ContentContext {
-  actions: ContentActions;
-}
-
-export const ContentContext = createContext<ContentContext>({} as ContentContext);
+export const ContentContext = createContext<ContentActions>({} as ContentActions);
 
 export type ContentProviderProps = {
   children: React.ReactNode;
@@ -34,53 +30,54 @@ export type ContentProviderProps = {
 };
 
 interface MessageData {
-    action: string;
-    record: Record;
+  action: string;
+  record: Record;
 }
 
 export const ContentProvider = (props: ContentProviderProps) => {
   const client = useClientContext();
   const dispatch = store.useAppDispatch;
-  const [collections, _] = React.useState<string[]>(props.collections || []);
-
 
   const actions: ContentActions = {
     subscribe: async (collectionName: string) => {
-      await client?.realtime.subscribe(collectionName, (event: MessageData) => {
-        switch (event.action) {
-          case 'create':
-            dispatch(recordsAction.addRecord(collectionName, event.record));
-            break;
-          case 'update':
-            dispatch(recordsAction.updateRecord(collectionName, event.record));
-            break;
-          case 'delete':
-            dispatch(recordsAction.deleteRecord(collectionName, event.record));
-            break;
-          default:
-            break;
-        }
-      })
-      .then(async () => {
-          const subscribed = JSON.parse(await StorageService.get("subscribed") ?? JSON.stringify([])) as string[];
-        await StorageService.set("subscribed", JSON.stringify([...subscribed, collectionName]));
-      })
-      .catch((_error) => {});
+      await client?.realtime
+        .subscribe(collectionName, (event: MessageData) => {
+          switch (event.action) {
+            case 'create':
+              dispatch(recordsAction.addRecord(collectionName, event.record));
+              break;
+            case 'update':
+              dispatch(recordsAction.updateRecord(collectionName, event.record));
+              break;
+            case 'delete':
+              dispatch(recordsAction.deleteRecord(collectionName, event.record));
+              break;
+            default:
+              break;
+          }
+        })
+        .then(() => {
+          dispatch(subscriptionsAction.addSubscription(collectionName));
+        })
+        .catch((_error) => {
+          dispatch(subscriptionsAction.deleteSubscription(collectionName));
+        });
     },
-    unsubscribe: (collectionName?: string) => {
+    unsubscribe: async (collectionName?: string) => {
       if (collectionName) {
-        client?.realtime.unsubscribe(collectionName)
-        .then(async () => {
-          const subscribed = JSON.parse(await StorageService.get("subscribed") ?? JSON.stringify([])) as string[];
-          await StorageService.set("subscribed", JSON.stringify(subscribed.filter((name) => name !== collectionName)));
-        })
-        .catch((_error) => {});
+        await client?.realtime
+          .unsubscribe(collectionName)
+          .then(() => {
+            dispatch(subscriptionsAction.deleteSubscription(collectionName));
+          })
+          .catch((_error) => {});
       } else {
-        client?.realtime.unsubscribe()
-        .then(async () => {
-          await StorageService.set("subscribed", JSON.stringify([]));
-        })
-        .catch((_error) => {});
+        await client?.realtime
+          .unsubscribe()
+          .then(() => {
+            dispatch(subscriptionsAction.setSubscriptions([]));
+          })
+          .catch((_error) => {});
       }
     },
     fetch: async (collectionName: string) => {
@@ -99,18 +96,18 @@ export const ContentProvider = (props: ContentProviderProps) => {
   };
 
   useEffect(() => {
-    if (collections) {
-      collections.forEach((collectionName) => {
-        actions.fetch(collectionName);
-        actions.subscribe(collectionName);
+    if (props.collections) {
+      props.collections.forEach(async (collectionName) => {
+        await actions.fetch(collectionName);
+        await actions.subscribe(collectionName);
       });
     }
-    return () => actions.unsubscribe();
-  }, [collections]);
+    return () => {
+      (async () => {
+        await actions.unsubscribe();
+      })();
+    };
+  }, [props.collections]);
 
-  return (
-    <ContentContext.Provider value={{
-      actions,
-    }}>{props.children}</ContentContext.Provider>
-  );
+  return <ContentContext.Provider value={actions}>{props.children}</ContentContext.Provider>;
 };

package/src/context/index.ts

@@ -1,4 +1,4 @@
 export * from './content';
 export * from './client';
 export * from './auth';
-export * from './Pocketbase';
+export * from './Pocketbase';

package/src/hooks/index.ts

@@ -1,3 +1,3 @@
 export * from './useAppContent';
 export * from './useClientContext';
-export * from './useAuth';
+export * from './useAuth';