pocketbase-react 0.1.0 → 0.1.2

package/es/context/index.js

@@ -0,0 +1,3 @@
+export * from './content';
+export * from './client';
+export * from './Pocketbase';

package/es/hooks/index.js

@@ -0,0 +1,2 @@
+export * from './useAppContent';
+export * from './useClientContext';

package/{dist/cjs → es}/hooks/useAppContent.d.ts

@@ -1,4 +1,4 @@
-import Record from '../interfaces/Record';
+import { Record } from '../interfaces/Record';
 export declare function useAppContent<T extends Record>(collectionName: string, initialFetch?: boolean): {
     records: T[];
     actions: {

package/es/hooks/useAppContent.js

@@ -0,0 +1,26 @@
+import { useContext, useEffect } from 'react';
+import * as store from '../store';
+import { ContentContext } from '../context';
+export function useAppContent(collectionName, initialFetch = false) {
+  var _store$useAppSelector;
+
+  const records = (_store$useAppSelector = store.useAppSelector(state => state.reducer.records[collectionName])) != null ? _store$useAppSelector : [];
+  const context = useContext(ContentContext);
+  useEffect(() => {
+    if (initialFetch) {
+      context == null ? void 0 : context.fetch(collectionName);
+    }
+  }, [collectionName, initialFetch]);
+  const actions = {
+    subscribe: async () => await (context == null ? void 0 : context.subscribe(collectionName)),
+    unsubscribe: () => context == null ? void 0 : context.unsubscribe(collectionName),
+    refetch: async () => await (context == null ? void 0 : context.fetch(collectionName)),
+    create: async record => await (context == null ? void 0 : context.create(collectionName, record)),
+    update: async (id, record) => await (context == null ? void 0 : context.update(collectionName, id, record)),
+    delete: async id => await (context == null ? void 0 : context.delete(collectionName, id))
+  };
+  return {
+    records,
+    actions
+  };
+}

package/es/hooks/useClientContext.d.ts

@@ -0,0 +1,2 @@
+declare const useClientContext: () => import("pocketbase").default | null;
+export { useClientContext };

package/es/hooks/useClientContext.js

@@ -0,0 +1,9 @@
+import { useContext } from 'react';
+import { ClientContext } from '../context';
+
+const useClientContext = () => {
+  const context = useContext(ClientContext);
+  return context;
+};
+
+export { useClientContext };

package/{dist/esm/index.d.ts → es/index.js}

@@ -1,4 +1,4 @@
 export * from './hooks';
 export * from './interfaces';
 export * from './context';
-export * from './store';
+export * from './store';

package/{dist/cjs → es}/interfaces/Record.d.ts

@@ -1,4 +1,4 @@
-export default interface Record {
+export interface Record {
     id?: string;
     created?: string;
     updated?: string;

package/es/interfaces/Record.js

@@ -0,0 +1 @@
+export {};

package/es/interfaces/index.js

@@ -0,0 +1 @@
+export * from './Record';

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

@@ -0,0 +1,2 @@
+import * as recordsAction from './records';
+export { recordsAction };

package/es/store/actions/index.js

@@ -0,0 +1,2 @@
+import * as recordsAction from './records';
+export { recordsAction };

package/es/store/actions/records.d.ts

@@ -0,0 +1,9 @@
+import { Record } from '../../interfaces/Record';
+import { RecordAction } from '../reducers/records';
+declare const setRecords: (key: string, payload: Record[]) => RecordAction;
+declare const addRecord: (key: string, payload: Record) => RecordAction;
+declare const addRecords: (key: string, payload: Record[]) => RecordAction;
+declare const deleteRecord: (key: string, payload: Record) => RecordAction;
+declare const deleteRecords: (key: string, payload: Record[]) => RecordAction;
+declare const updateRecord: (key: string, payload: Record) => RecordAction;
+export { setRecords, addRecord, addRecords, deleteRecord, deleteRecords, updateRecord, };

package/es/store/actions/records.js

@@ -0,0 +1,39 @@
+import * as ReduxType from '../types';
+
+const setRecords = (key, payload) => ({
+  type: ReduxType.SET_RECORDS,
+  key,
+  payload
+});
+
+const addRecord = (key, payload) => ({
+  type: ReduxType.ADD_RECORD,
+  key,
+  payload
+});
+
+const addRecords = (key, payload) => ({
+  type: ReduxType.ADD_RECORDS,
+  key,
+  payload
+});
+
+const deleteRecord = (key, payload) => ({
+  type: ReduxType.DELETE_RECORD,
+  key,
+  payload
+});
+
+const deleteRecords = (key, payload) => ({
+  type: ReduxType.DELETE_RECORDS,
+  key,
+  payload
+});
+
+const updateRecord = (key, payload) => ({
+  type: ReduxType.UPDATE_RECORD,
+  key,
+  payload
+});
+
+export { setRecords, addRecord, addRecords, deleteRecord, deleteRecords, updateRecord };

package/{dist/esm/store/index.d.ts → es/store/index.js}

@@ -1,4 +1,4 @@
 export * from './actions';
 export * from './reducers';
 export * from './types';
-export * from './store';
+export * from './store';

package/{dist/cjs → es}/store/reducers/index.d.ts

@@ -1,8 +1,8 @@
-declare const appReducer: import("redux").Reducer<import("redux").CombinedState<{
+export declare const appReducer: import("redux").Reducer<import("redux").CombinedState<{
     records: import("./records").ReduxRecord;
 }>, import("./records").RecordAction>;
 interface AppReducer {
     records: ReturnType<typeof appReducer>;
 }
 export declare type State = AppReducer;
-export default appReducer;
+export {};

package/es/store/reducers/index.js

@@ -0,0 +1,5 @@
+import { combineReducers } from 'redux';
+import { records } from './records';
+export const appReducer = combineReducers({
+  records: records
+});

package/{dist/cjs → es}/store/reducers/records.d.ts

@@ -1,4 +1,4 @@
-import Record from '../../interfaces/Record';
+import { Record } from '../../interfaces/Record';
 import * as ReduxType from '../types';
 export interface ReduxRecord {
     [key: string]: Record[];
@@ -8,5 +8,4 @@ export declare type RecordAction = {
     key: string;
     payload: null | Record | Record[];
 };
-declare const _default: (state: ReduxRecord | undefined, action: RecordAction) => ReduxRecord;
-export default _default;
+export declare const records: (state: ReduxRecord | undefined, action: RecordAction) => ReduxRecord;

package/es/store/reducers/records.js

@@ -0,0 +1,71 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as ReduxType from '../types';
+
+function appendRecord(record, records) {
+  return [...records, record];
+}
+
+function appendRecords(recordsToAppend, records) {
+  return [...records, ...recordsToAppend];
+}
+
+function updateRecord(record, records) {
+  return records.map(r => {
+    if (r.id === record.id) {
+      return record;
+    }
+
+    return r;
+  });
+}
+
+function deleteRecord(record, records) {
+  return records.filter(r => r.id !== record.id);
+}
+
+function deleteRecords(recordsToDelete, records) {
+  return records.filter(r => !recordsToDelete.includes(r));
+}
+
+export const records = (state = {}, action) => {
+  var _state$action$key;
+
+  const list = (_state$action$key = state[action.key]) != null ? _state$action$key : [];
+
+  switch (action.type) {
+    case ReduxType.SET_RECORDS:
+      if (Array.isArray(action.payload)) {
+        return _extends({}, state, {
+          [action.key]: action.payload
+        });
+      }
+
+    case ReduxType.ADD_RECORD:
+      return _extends({}, state, {
+        [action.key]: appendRecord(action.payload, list)
+      });
+
+    case ReduxType.ADD_RECORDS:
+      return _extends({}, state, {
+        [action.key]: appendRecords(action.payload, list)
+      });
+
+    case ReduxType.DELETE_RECORD:
+      return _extends({}, state, {
+        [action.key]: deleteRecord(action.payload, list)
+      });
+
+    case ReduxType.DELETE_RECORDS:
+      return _extends({}, state, {
+        [action.key]: deleteRecords(action.payload, list)
+      });
+
+    case ReduxType.UPDATE_RECORD:
+      return _extends({}, state, {
+        [action.key]: updateRecord(action.payload, list)
+      });
+
+    default:
+      return state;
+  }
+};

package/{dist/cjs → es}/store/store.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="redux-persist/types/persistReducer" />
+/// <reference types="redux-persist" />
 /// <reference types="redux-persist/types/types" />
 /// <reference types="redux-persist" />
 import { TypedUseSelectorHook } from 'react-redux';

package/es/store/store.js

@@ -0,0 +1,46 @@
+import { combineReducers, configureStore } from '@reduxjs/toolkit';
+import { persistStore, persistReducer } from 'redux-persist';
+import { useSelector } from 'react-redux';
+import { appReducer } from './reducers';
+import thunk from 'redux-thunk';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+const CustomStorage = {
+  getItem: async (_key, ..._args) => {
+    if (typeof document !== 'undefined') {
+      console.log("I'm on the web!");
+      return localStorage.getItem(_key);
+    } else if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
+      console.log("I'm in react-native");
+      return await AsyncStorage.getItem(_key);
+    }
+  },
+  setItem: async (_key, _value, ..._args) => {
+    if (typeof document !== 'undefined') {
+      return localStorage.setItem(_key, _value);
+    } else if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
+      return await AsyncStorage.setItem(_key, _value);
+    }
+  },
+  removeItem: async (_key, ..._args) => {
+    if (typeof document !== 'undefined') {
+      return localStorage.removeItem(_key);
+    } else if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
+      return await AsyncStorage.removeItem(_key);
+    }
+  }
+};
+export const persistConfig = {
+  key: 'root',
+  storage: CustomStorage
+};
+const reducer = combineReducers({
+  reducer: persistReducer(persistConfig, appReducer)
+});
+const store = configureStore({
+  reducer,
+  middleware: [thunk]
+});
+const useAppDispatch = store.dispatch;
+const useAppSelector = useSelector;
+const persistor = persistStore(store);
+export { useAppDispatch, useAppSelector, store, persistor };

package/es/store/types/index.js

@@ -0,0 +1,6 @@
+export const SET_RECORDS = 'SET_RECORDS';
+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';

package/lib/context/Pocketbase.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.PocketbaseContext = exports.Pocketbase = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _pocketbase = _interopRequireDefault(require("pocketbase"));
+
+var _reactRedux = require("react-redux");
+
+var _react2 = require("redux-persist/integration/react");
+
+var store = _interopRequireWildcard(require("../store/store"));
+
+var _client = require("./client");
+
+var _content = require("./content");
+
+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 PocketbaseContext = (0, React.createContext)(null);
+exports.PocketbaseContext = PocketbaseContext;
+
+const Pocketbase = props => {
+  const [client, setClient] = React.useState(null);
+  (0, React.useEffect)(() => {
+    const client = new _pocketbase.default(props.serverURL);
+    client.admins.authViaEmail(props.credentials.username, props.credentials.password).then(() => {
+      setClient(client);
+      console.log('Pocketbase client initialized');
+    });
+  }, [props.serverURL]);
+  return client ? /*#__PURE__*/React.createElement(_client.ClientProvider, {
+    client: client
+  }, /*#__PURE__*/React.createElement(_reactRedux.Provider, {
+    store: store.store
+  }, /*#__PURE__*/React.createElement(_react2.PersistGate, {
+    persistor: store.persistor
+  }, /*#__PURE__*/React.createElement(_content.ContentProvider, {
+    collections: props.initialCollections
+  }, props.children)))) : null;
+};
+
+exports.Pocketbase = Pocketbase;

package/lib/context/client.js

@@ -0,0 +1,21 @@
+"use strict";
+
+exports.__esModule = true;
+exports.ClientProvider = exports.ClientContext = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+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 ClientContext = (0, React.createContext)(null);
+exports.ClientContext = ClientContext;
+
+const ClientProvider = props => {
+  return /*#__PURE__*/React.createElement(ClientContext.Provider, {
+    value: props.client
+  }, props.children);
+};
+
+exports.ClientProvider = ClientProvider;

package/lib/context/content.js

@@ -0,0 +1,83 @@
+"use strict";
+
+exports.__esModule = true;
+exports.ContentProvider = exports.ContentContext = void 0;
+
+var store = _interopRequireWildcard(require("../store/store"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _useClientContext = require("../hooks/useClientContext");
+
+var _actions = require("../store/actions");
+
+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)(null);
+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 => {
+      // save local that collectionName should be subscribed
+      await (client == null ? void 0 : client.realtime.subscribe(collectionName, event => {
+        switch (event.action) {
+          case 'create':
+            dispatch(_actions.recordsAction.addRecord(collectionName, event.record));
+            break;
+
+          case 'update':
+            dispatch(_actions.recordsAction.updateRecord(collectionName, event.record));
+            break;
+
+          case 'delete':
+            dispatch(_actions.recordsAction.deleteRecord(collectionName, event.record));
+            break;
+
+          default:
+            break;
+        }
+      }));
+    },
+    unsubscribe: collectionName => {
+      if (collectionName) {
+        client == null ? void 0 : client.realtime.unsubscribe(collectionName);
+      } else {
+        client == null ? void 0 : client.realtime.unsubscribe();
+      }
+    },
+    fetch: async collectionName => {
+      const records = await (client == null ? void 0 : client.records.getFullList(collectionName, 200));
+      dispatch(_actions.recordsAction.setRecords(collectionName, records));
+    },
+    create: async (collectionName, record) => {
+      await (client == null ? void 0 : client.records.create(collectionName, record));
+    },
+    update: async (collectionName, recordId, record) => {
+      await (client == null ? void 0 : client.records.update(collectionName, recordId, record));
+    },
+    delete: async (collectionName, recordId) => {
+      await (client == null ? void 0 : client.records.delete(collectionName, recordId));
+    }
+  };
+  (0, React.useEffect)(() => {
+    if (collections) {
+      collections.forEach(collectionName => {
+        actions.fetch(collectionName);
+        actions.subscribe(collectionName);
+      });
+    }
+
+    return () => actions.unsubscribe();
+  }, [collections]);
+  return /*#__PURE__*/React.createElement(ContentContext.Provider, {
+    value: actions
+  }, props.children);
+};
+
+exports.ContentProvider = ContentProvider;

package/lib/context/index.js

@@ -0,0 +1,42 @@
+"use strict";
+
+exports.__esModule = true;
+
+var _content = require("./content");
+
+Object.keys(_content).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _content[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _content[key];
+    }
+  });
+});
+
+var _client = require("./client");
+
+Object.keys(_client).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _client[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _client[key];
+    }
+  });
+});
+
+var _Pocketbase = require("./Pocketbase");
+
+Object.keys(_Pocketbase).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Pocketbase[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Pocketbase[key];
+    }
+  });
+});

package/lib/hooks/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+exports.__esModule = true;
+
+var _useAppContent = require("./useAppContent");
+
+Object.keys(_useAppContent).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useAppContent[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useAppContent[key];
+    }
+  });
+});
+
+var _useClientContext = require("./useClientContext");
+
+Object.keys(_useClientContext).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useClientContext[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useClientContext[key];
+    }
+  });
+});

package/lib/hooks/useAppContent.js

@@ -0,0 +1,38 @@
+"use strict";
+
+exports.__esModule = true;
+exports.useAppContent = useAppContent;
+
+var _react = require("react");
+
+var store = _interopRequireWildcard(require("../store"));
+
+var _context = require("../context");
+
+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 context = (0, _react.useContext)(_context.ContentContext);
+  (0, _react.useEffect)(() => {
+    if (initialFetch) {
+      context == null ? void 0 : context.fetch(collectionName);
+    }
+  }, [collectionName, initialFetch]);
+  const actions = {
+    subscribe: async () => await (context == null ? void 0 : context.subscribe(collectionName)),
+    unsubscribe: () => context == null ? void 0 : context.unsubscribe(collectionName),
+    refetch: async () => await (context == null ? void 0 : context.fetch(collectionName)),
+    create: async record => await (context == null ? void 0 : context.create(collectionName, record)),
+    update: async (id, record) => await (context == null ? void 0 : context.update(collectionName, id, record)),
+    delete: async id => await (context == null ? void 0 : context.delete(collectionName, id))
+  };
+  return {
+    records,
+    actions
+  };
+}

package/lib/hooks/useClientContext.js

@@ -0,0 +1,15 @@
+"use strict";
+
+exports.__esModule = true;
+exports.useClientContext = void 0;
+
+var _react = require("react");
+
+var _context = require("../context");
+
+const useClientContext = () => {
+  const context = (0, _react.useContext)(_context.ClientContext);
+  return context;
+};
+
+exports.useClientContext = useClientContext;