really rough try at full text options sync capability

website/src/App.tsx

@@ -35,6 +35,8 @@ import { dictionary, pageSize } from "./lib/dictionary";
 import {
     optionsReducer,
     textOptionsReducer,
+    resolveTextOptions,
+    removePTextSize,
 } from "./lib/options-reducer";
 import hitBottom from "./lib/hitBottom";
 import getWordId from "./lib/get-word-id";
@@ -69,6 +71,8 @@ import "./custom-bootstrap.scss";
 // tslint:disable-next-line: ordered-imports
 import "./App.css";
 import classNames from "classnames";
+import { Types as IT } from "@lingdocs/pashto-inflector";
+import { getTextOptions } from "./lib/get-text-options";
 
 // to allow Moustrap key combos even when input fields are in focus
 Mousetrap.prototype.stopCallback = function () {
@@ -260,12 +264,35 @@ class App extends Component<RouteComponentProps, State> {
 
     private async handleLoadUser(): Promise<void> {
         try {
-            const user = await getUser();
-            if (user === "offline") return;
-            if (user) sendSubmissions();
+            const prevUser = this.state.user;
+            const userOnServer = await getUser();
+            if (userOnServer === "offline") return;
+            if (userOnServer) sendSubmissions();
+            if (!userOnServer) {
+                this.setState({ user: undefined });
+                saveUser(undefined);
+                return;
+            }
+            const { userTextOptionsRecord, serverOptionsAreNewer } = resolveTextOptions(userOnServer, prevUser, this.state.options.textOptionsRecord); 
+            const user: AT.LingdocsUser | undefined = {
+                ...userOnServer,
+                userTextOptionsRecord,
+            };
             this.setState({ user });
-            // TODO: LOAD AND RESOLVE THE USER'S TEXT OPTIONS ETC.
             saveUser(user);
+            const textOptions: IT.TextOptions = {
+                ...userTextOptionsRecord.userTextOptions,
+                pTextSize: getTextOptions(this.state).pTextSize,
+            };
+            const textOptionsRecord: TextOptionsRecord = {
+                lastModified: userTextOptionsRecord.lastModified,
+                textOptions,
+            };
+            this.handleOptionsUpdate({ type: "updateTextOptionsRecord", payload: textOptionsRecord });
+            // TODO: LOAD AND RESOLVE THE USER'S TEXT OPTIONS ETC.
+            if (!serverOptionsAreNewer) {
+                updateUserTextOptionsRecord(userTextOptionsRecord);
+            }
             if (user) {
                 startLocalDbs(user, { wordlist: this.handleRefreshWordlist, reviewTasks: this.handleRefreshReviewTasks });
             } else {
@@ -322,12 +349,12 @@ class App extends Component<RouteComponentProps, State> {
         this.handleOptionsUpdate({ type: "updateTextOptionsRecord", payload: textOptionsRecord });
         // try to save the new text options to the user 
         if (this.state.user) {
-            const { pTextSize, ...userTextOptions } = textOptions;
+            const userTextOptions = removePTextSize(textOptions);
             const userTextOptionsRecord = {
                 userTextOptions,
                 lastModified,
             };
-            updateUserTextOptionsRecord(userTextOptionsRecord);
+            updateUserTextOptionsRecord(userTextOptionsRecord).catch(console.error);
         }
     }
 

website/src/lib/options-reducer.ts

@@ -1,4 +1,6 @@
 import { Types as IT } from "@lingdocs/pashto-inflector";
+import * as AT from "./account-types";
+import { updateUserTextOptionsRecord } from "./backend-calls";
 
 export function optionsReducer(options: Options, action: OptionsAction): Options {
     if (action.type === "toggleLanguage") {
@@ -85,3 +87,39 @@ export function textOptionsReducer(textOptions: IT.TextOptions, action: TextOpti
   }
   throw new Error("action type not recognized in text options reducer");
 }
+
+export function removePTextSize(textOptions: IT.TextOptions): AT.UserTextOptions {
+  const { pTextSize, ...userTextOptions } = textOptions;
+  return userTextOptions;
+}
+
+export function resolveTextOptions(userOnServer: AT.LingdocsUser, prevUser: AT.LingdocsUser | undefined, localTextOptionsRecord: TextOptionsRecord): { userTextOptionsRecord: AT.UserTextOptionsRecord, serverOptionsAreNewer: boolean } {
+  const isANewUser = !prevUser || (userOnServer.userId !== prevUser.userId);
+  if (isANewUser) {
+    // take the new user's text options, if the have any
+    // if not just take the equivalent of the user text options from the saved record 
+    return userOnServer.userTextOptionsRecord
+      ? {
+        serverOptionsAreNewer: true,
+        userTextOptionsRecord: userOnServer.userTextOptionsRecord,
+      }
+      : {
+          serverOptionsAreNewer: false,
+          userTextOptionsRecord: {
+            lastModified: localTextOptionsRecord.lastModified,
+            userTextOptions: removePTextSize(localTextOptionsRecord.textOptions),
+          }
+      };
+  }
+  // if the new user is the same as the existing user that we had
+  const serverOptionsAreNewer = !!(userOnServer.userTextOptionsRecord && (userOnServer.userTextOptionsRecord.lastModified > localTextOptionsRecord.lastModified));
+  return {
+    serverOptionsAreNewer,
+    userTextOptionsRecord: (serverOptionsAreNewer && userOnServer.userTextOptionsRecord)
+      ? userOnServer.userTextOptionsRecord
+      : {
+        lastModified: localTextOptionsRecord.lastModified,
+        userTextOptions: removePTextSize(localTextOptionsRecord.textOptions),
+      },
+  };
+}