Store: move the base64 serialization to the persistor serializers.

We were doing it earlier (in the store), and it was less efficient and
unnecessary. The correct place for the serialization is when actually
needing it.

src/Debug.tsx

@@ -60,7 +60,7 @@ export default function Debug() {
           }
 
           const colMgr = getCollectionManager(etebase);
-          const col = await colMgr.cacheLoad(Etebase.fromBase64(cachedCollection));
+          const col = await colMgr.cacheLoad(cachedCollection);
           const itemMgr = colMgr.getItemManager(col);
 
           const wantedEntries = {};
@@ -70,7 +70,7 @@ export default function Debug() {
           const retEntries = [];
           console.log(wantAll, colItems.size);
           for (const cached of colItems.values()) {
-            const item = await itemMgr.cacheLoad(Etebase.fromBase64(cached));
+            const item = await itemMgr.cacheLoad(cached);
             const meta = await item.getMeta();
             const content = await item.getContent(Etebase.OutputFormat.String);
             if (wantAll || wantedEntries[item.uid]) {

src/etebase-helpers.ts

@@ -11,7 +11,7 @@ export const getCollections = memoize(async function (cachedCollections: CacheCo
   const colMgr = getCollectionManager(etebase);
   const ret: Etebase.Collection[] = [];
   for (const cached of cachedCollections.values()) {
-    ret.push(await colMgr.cacheLoad(Etebase.fromBase64(cached)));
+    ret.push(await colMgr.cacheLoad(cached));
   }
   return ret;
 }, { length: 1 });
@@ -31,7 +31,7 @@ export const getCollectionsByType = memoize(async function (cachedCollections: C
 export const getItems = memoize(async function (cachedItems: CacheItems, itemMgr: Etebase.CollectionItemManager) {
   const ret = new Map<string, Etebase.CollectionItem>();
   for (const cached of cachedItems.values()) {
-    const item = await itemMgr.cacheLoad(Etebase.fromBase64(cached));
+    const item = await itemMgr.cacheLoad(cached);
     ret.set(item.uid, item);
   }
   return ret;

src/index.tsx

@@ -9,13 +9,36 @@ import App from "./App";
 import registerServiceWorker from "./registerServiceWorker";
 import "./index.css";
 
+import * as Etebase from "etebase";
+
+function MyPersistGate(props: React.PropsWithChildren<{}>) {
+  const [loading, setLoading] = React.useState(true);
+
+  React.useEffect(() => {
+    Etebase.ready.then(() => {
+      setLoading(false);
+      persistor.persist();
+    });
+  }, []);
+
+  if (loading) {
+    return (<React.Fragment />);
+  }
+
+  return (
+    <PersistGate persistor={persistor}>
+      {props.children}
+    </PersistGate>
+  );
+}
+
 import { store, persistor } from "./store";
 
 ReactDOM.render(
   <Provider store={store}>
-    <PersistGate persistor={persistor}>
+    <MyPersistGate>
       <App />
-    </PersistGate>
+    </MyPersistGate>
   </Provider>,
   document.getElementById("root") as HTMLElement
 );

src/store/actions.ts

@@ -42,7 +42,7 @@ export const login = createAction(
 export const setCacheCollection = createAction(
   "SET_CACHE_COLLECTION",
   async (colMgr: Etebase.CollectionManager, col: Etebase.Collection) => {
-    return Etebase.toBase64(await colMgr.cacheSave(col));
+    return await colMgr.cacheSave(col);
   },
   (_colMgr: Etebase.CollectionManager, col: Etebase.Collection) => {
     return {
@@ -69,7 +69,7 @@ export const collectionUpload = createAction(
   "COLLECTION_UPLOAD",
   async (colMgr: Etebase.CollectionManager, col: Etebase.Collection) => {
     await colMgr.upload(col);
-    return Etebase.toBase64(await colMgr.cacheSave(col));
+    return await colMgr.cacheSave(col);
   },
   (_colMgr: Etebase.CollectionManager, col: Etebase.Collection) => {
     return {
@@ -82,7 +82,7 @@ export const collectionUpload = createAction(
 export const setCacheItem = createAction(
   "SET_CACHE_ITEM",
   async (_col: Etebase.Collection, itemMgr: Etebase.CollectionItemManager, item: Etebase.CollectionItem) => {
-    return Etebase.toBase64(await itemMgr.cacheSave(item));
+    return await itemMgr.cacheSave(item);
   },
   (col: Etebase.Collection, _itemMgr: Etebase.CollectionItemManager, item: Etebase.CollectionItem) => {
     return {
@@ -112,7 +112,7 @@ export const setCacheItemMulti = createAction(
   async (_colUid: string, itemMgr: Etebase.CollectionItemManager, items: Etebase.CollectionItem[]) => {
     const ret = [];
     for (const item of items) {
-      ret.push(Etebase.toBase64(await itemMgr.cacheSave(item)));
+      ret.push(await itemMgr.cacheSave(item));
     }
     return ret;
   },
@@ -130,7 +130,7 @@ export const itemBatch = createAction(
     await itemMgr.batch(items, deps);
     const ret = [];
     for (const item of items) {
-      ret.push(Etebase.toBase64(await itemMgr.cacheSave(item)));
+      ret.push(await itemMgr.cacheSave(item));
     }
     return ret;
   },

src/store/construct.ts

@@ -6,6 +6,8 @@ import { combineReducers } from "redux";
 import { createMigrate, persistReducer, createTransform } from "redux-persist";
 import session from "redux-persist/lib/storage/session";
 
+import * as Etebase from "etebase";
+
 import { List, Map as ImmutableMap } from "immutable";
 import {
   SettingsType,
@@ -84,9 +86,15 @@ const syncPersistConfig = {
 
 const cacheSerialize = (state: any, key: string | number) => {
   if (key === "collections") {
-    return state.toJS();
+    const typedState = state as CacheCollectionsData;
+    const ret = typedState.map((x) => Etebase.toBase64(x));
+    return ret.toJS();
   } else if (key === "items") {
-    return state.toJS();
+    const typedState = state as CacheItemsData;
+    const ret = typedState.map((items) => {
+      return items.map((x) => Etebase.toBase64(x));
+    });
+    return ret.toJS();
   }
 
   return state;
@@ -94,10 +102,12 @@ const cacheSerialize = (state: any, key: string | number) => {
 
 const cacheDeserialize = (state: any, key: string | number) => {
   if (key === "collections") {
-    return ImmutableMap(state);
+    return ImmutableMap(state).map((x: string) => {
+      return Etebase.fromBase64(x);
+    });
   } else if (key === "items") {
     return ImmutableMap(state).map((item: any) => {
-      return ImmutableMap(item);
+      return ImmutableMap(item).map((x: string) => Etebase.fromBase64(x));
     });
   }
 

src/store/index.ts

@@ -41,4 +41,4 @@ export const store = createStore(
   applyMiddleware(...middleware)
 );
 
-export const persistor = persistStore(store);
+export const persistor = persistStore(store, { manualPersist: true } as any);

src/store/reducers.ts

@@ -19,11 +19,11 @@ export interface SyncCollectionsEntryData extends BaseModel {
 
 export type SyncCollectionsData = ImmutableMap<string, SyncCollectionsEntryData>;
 
-export type CacheItem = string;
+export type CacheItem = Uint8Array;
 export type CacheItems = ImmutableMap<string, CacheItem>;
 export type CacheItemsData = ImmutableMap<string, CacheItems>;
-export type CacheCollection = CacheItem;
-export type CacheCollectionsData = ImmutableMap<string, CacheCollection>;
+export type CacheCollection = Uint8Array;
+export type CacheCollectionsData = ImmutableMap<string, Uint8Array>;
 
 export type SyncGeneralData = {
   stoken: string | null;