Merge pull request #28 from social-native/feat/add-ability-to-trigger…

…-rehydrate-on-demand Chore: update readme
social-native · Mar 11, 2020 · e7c093b · e7c093b
2 parents 5eacd6f + ef45507
commit e7c093b
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 32 deletions.
diff --git a/README.md b/README.md
@@ -1021,6 +1021,7 @@ The `options` looks like:
     historySize?: number;
     currentLocationStore?: UrlStore<State>;
     historyPersister?: IHistoryPersister;
+    rehydrateOnStart?: boolean; // whether to run the `rehydrate` method in the constructor
 }
 ```
 
@@ -1041,7 +1042,7 @@ IHistoryPersister {
 | setCurrentState         | sets the current state of filters and suggestgions    | `(location: HistoryLocation): void`   |
 | back       | goes back in the history                              | `(): void`                       |
 | forward           | goes forward in the history                                | `(): void` |
-
+| rehydrate | rehydrates from URL or persistent storage | `(): void` |
 
 #### Attributes
 

diff --git a/dev/app/context.ts b/dev/app/context.ts
@@ -128,13 +128,14 @@ const creatorCRMHistory = new History(creatorCRM, 'influencer_crm', {
 
 (global as any).crmHistory = creatorCRMHistory;
 (global as any).crm = creatorCRM;
-// setTimeout(() => {
-//     creatorCRMHistory.setCurrentState(
-//         JSON.parse(
-//             '{"filters":{"multiselect":{"fieldKinds":{"tags":"should"},"fieldFilters":{"tags":{"carolsdaugther":{"inclusion":"include"}}}},"exists":{"fieldKinds":{"instagram.id":"must"},"fieldFilters":{"instagram.id":{"exists":true}}},"range":{"fieldKinds":{"user_profile.age":"must"},"fieldFilters":{"user_profile.age":{"lessThan":68,"greaterThan":35}}}},"suggestions":{"prefix":{"fieldKinds":{"tags":"should"},"fieldSearches":{"tags":"car"}}}}'
-//         )
-//     );
-// }, 5000);
+setTimeout(() => {
+    //     creatorCRMHistory.setCurrentState(
+    //         JSON.parse(
+    //             '{"filters":{"multiselect":{"fieldKinds":{"tags":"should"},"fieldFilters":{"tags":{"carolsdaugther":{"inclusion":"include"}}}},"exists":{"fieldKinds":{"instagram.id":"must"},"fieldFilters":{"instagram.id":{"exists":true}}},"range":{"fieldKinds":{"user_profile.age":"must"},"fieldFilters":{"user_profile.age":{"lessThan":68,"greaterThan":35}}}},"suggestions":{"prefix":{"fieldKinds":{"tags":"should"},"fieldSearches":{"tags":"car"}}}}'
+    //         )
+    //     );
+    creatorCRMHistory.rehydrate();
+}, 5000);
 // console.log(history);
 
 export default {

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@social-native/snpkg-client-elasticsearch",
-    "version": "3.4.0",
+    "version": "3.5.0",
     "description": "",
     "main": "dist/index.cjs.js",
     "module": "dist/index.es.js",
@@ -44,7 +44,7 @@
         "lodash.debounce": "^4.0.8",
         "mobx": "^5.14.2",
         "mobx-react": "^6.1.4",
-        "query-params-data": "^0.1.1",
+        "query-params-data": "^0.2.2",
         "query-string": "^6.11.1"
     },
     "peerDependencies": {
@@ -54,7 +54,7 @@
         "lodash.chunk": "^4.2.0",
         "lodash.debounce": "^4.0.8",
         "query-string": "^6.11.1",
-        "query-params-data": "^0.1.1"
+        "query-params-data": "^0.2.2"
     },
     "devDependencies": {
         "@rollup/plugin-json": "^4.0.2",

diff --git a/src/history.ts b/src/history.ts
@@ -24,6 +24,7 @@ export interface IHistoryOptions<State> {
     historySize?: number;
     currentLocationStore?: ICurrentLocationStore<State>;
     historyPersister?: IHistoryPersister;
+    rehydrateOnStart?: boolean;
 }
 
 export type CurrentLocationStateObserver<State> = (newState: State | undefined) => any;
@@ -36,7 +37,10 @@ export interface ICurrentLocationStore<State> {
         }
     ) => void;
     getState: () => State | undefined | void;
-    subscribeToStateChanges: (observer: CurrentLocationStateObserver<State>) => void;
+    subscribeToStateChanges: (
+        observer: CurrentLocationStateObserver<State>,
+        options?: {getCurrentState: boolean}
+    ) => void;
 }
 
 export interface IHistoryPersister {
@@ -90,25 +94,14 @@ class History {
             this.currentLocationInHistoryCursor = 0;
             this.history = [];
             this.historyPersister = options && options.historyPersister;
-            if (this.historyPersister) {
-                const persistedHistory = this.historyPersister.getHistory();
-                this.history = persistedHistory;
-                if (persistedHistory.length > 0) {
-                    const existingStateFromUrl = this.currentLocationStore.getState();
-                    if (!existingStateFromUrl) {
-                        const newHistoryLocation = this._deepCopy(
-                            persistedHistory[0] as HistoryLocation
-                        );
-                        this.currentLocationStore.setState(newHistoryLocation);
-                        this._rehydrateFromLocation(newHistoryLocation);
-                    } else {
-                        this._rehydrateFromLocation(existingStateFromUrl);
-                    }
-                }
+            if (options && options.rehydrateOnStart) {
+                this.rehydrate();
             }
         });
 
-        this.currentLocationStore.subscribeToStateChanges(this._currentStateSubscriber);
+        this.currentLocationStore.subscribeToStateChanges(this._currentStateSubscriber, {
+            getCurrentState: false
+        });
 
         const debounceHistoryChange = debounce(this._recordHistoryChange, 300);
 
@@ -144,6 +137,36 @@ class History {
         );
     }
 
+    /**
+     * Rehydrates state from current state store (URL) or persistent storage (localStorage)
+     */
+    public rehydrate = () => {
+        runInAction(() => {
+            if (this.historyPersister) {
+                const persistedHistory = this.historyPersister.getHistory();
+                this.history = persistedHistory;
+                if (persistedHistory.length > 0) {
+                    const existingStateFromUrl = this.currentLocationStore.getState();
+                    if (!existingStateFromUrl) {
+                        const newHistoryLocation = this._deepCopy(
+                            persistedHistory[0] as HistoryLocation
+                        );
+                        this.currentLocationStore.setState(newHistoryLocation);
+
+                        this._rehydrateFromLocation(newHistoryLocation);
+                    } else {
+                        this._rehydrateFromLocation(existingStateFromUrl);
+                    }
+                } else {
+                    const existingStateFromUrl = this.currentLocationStore.getState();
+                    if (existingStateFromUrl) {
+                        this._rehydrateFromLocation(existingStateFromUrl);
+                    }
+                }
+            }
+        });
+    };
+
     // tslint:disable-next-line
     public _recordHistoryChange = () => {
         const filters = Object.keys(this.manager.filters).reduce((acc, filterName) => {