@saltcorn/mobile-app 1.5.0-beta.17 → 1.5.0-beta.19

package/optional_sources/notifications.js

@@ -2,7 +2,7 @@
 
 import { Capacitor } from "@capacitor/core";
 import { apiCall } from "./api";
-import { showAlerts } from "./common";
+import { showToasts } from "./common";
 import { PushNotifications } from "@capacitor/push-notifications";
 import { Device } from "@capacitor/device";
 
@@ -151,7 +151,7 @@ export function addPusNotifyHandler() {
   const state = saltcorn.data.state.getState();
   state.mobile_push_handler["push_notification"] = (notification) => {
     console.log("Push notification received:", notification);
-    showAlerts([
+    showToasts([
       {
         type: "info",
         msg: notification.body,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@saltcorn/mobile-app",
   "displayName": "Saltcorn mobile app",
-  "version": "1.5.0-beta.17",
+  "version": "1.5.0-beta.19",
   "description": "Saltcorn mobile app for Android and iOS",
   "main": "index.js",
   "scripts": {

package/src/helpers/auth.js

@@ -7,7 +7,7 @@ import { router } from "../routing/index";
 import { getLastOfflineSession, deleteOfflineData, sync } from "./offline_mode";
 import { addRoute, replaceIframe, clearHistory } from "../helpers/navigation";
 import {
-  showAlerts,
+  showToasts,
   tryInitBackgroundSync,
   tryInitPush,
   tryStopBackgroundSync,
@@ -69,7 +69,7 @@ const initialSync = async (config) => {
   const alerts = [];
   const { offlineUser, hasOfflineData } = (await getLastOfflineSession()) || {};
   if (!offlineUser || offlineUser === config.user.email) {
-    await sync(false, alerts);
+    await sync(true, true, alerts);
   } else {
     if (hasOfflineData)
       alerts.push({
@@ -78,7 +78,7 @@ const initialSync = async (config) => {
       });
     else {
       await deleteOfflineData(true);
-      await sync(false, alerts);
+      await sync(true, true, alerts);
     }
   }
   return alerts;
@@ -138,7 +138,7 @@ export async function login({ email, password, isSignup, token }) {
     });
     if (page.content) await replaceIframe(page.content, page.isFile);
   } else if (loginResult?.alerts) {
-    showAlerts(loginResult?.alerts);
+    showToasts(loginResult?.alerts);
   } else {
     throw new Error("The login failed.");
   }
@@ -180,13 +180,13 @@ export async function publicLogin(entryPoint) {
       });
       if (page.content) await replaceIframe(page.content, page.isFile);
     } else if (loginResult?.alerts) {
-      showAlerts(loginResult?.alerts);
+      showToasts(loginResult?.alerts);
     } else {
       throw new Error("The login failed.");
     }
   } catch (error) {
     console.error(error);
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",
@@ -215,7 +215,7 @@ export async function logout() {
     } else throw new Error("Unable to logout.");
   } catch (error) {
     console.error("unable to logout:", error);
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",

package/src/helpers/common.js

@@ -8,22 +8,28 @@ import { addPushSyncHandler } from "./offline_mode";
 
 const orientationChangeListeners = new Set();
 
-export function clearAlerts() {
+/**
+ * Make the toast area shown at the bottom empty
+ */
+export function clearToasts() {
   const iframe = document.getElementById("content-iframe");
   const alertsArea =
     iframe.contentWindow.document.getElementById("toasts-area");
   alertsArea.innerHTML = "";
 }
 
-export function showAlerts(alerts, toast = true) {
+/**
+ * Show toasts in the toast area at the bottom
+ * @param toasts
+ * @returns
+ */
+export function showToasts(toasts) {
   if (typeof saltcorn === "undefined") {
     console.log("Not yet initalized.");
-    console.log(alerts);
+    console.log(toasts);
   } else {
     const iframe = document.getElementById("content-iframe");
-    let area = iframe.contentWindow.document.getElementById(
-      toast ? "toasts-area" : "top-alert"
-    );
+    let area = iframe.contentWindow.document.getElementById("toasts-area");
     if (!area) {
       const areaHtml = `<div class="container">
   <div 
@@ -37,18 +43,14 @@ export function showAlerts(alerts, toast = true) {
       iframe.contentWindow.document
         .getElementById("page-inner-content")
         .insertAdjacentHTML("beforeend", areaHtml);
-      area = iframe.contentWindow.document.getElementById(
-        toast ? "toasts-area" : "top-alert"
-      );
+      area = iframe.contentWindow.document.getElementById("toasts-area");
     }
     const successIds = [];
     area.innerHTML = "";
-    for (const { type, msg, title } of alerts) {
-      if (toast) {
-        const rndid = `tab${Math.floor(Math.random() * 16777215).toString(16)}`;
-        area.innerHTML += saltcorn.markup.toast(type, msg, rndid, title);
-        if (type === "success") successIds.push(rndid);
-      } else area.innerHTML += saltcorn.markup.alert(type, msg);
+    for (const { type, msg, title } of toasts) {
+      const rndid = `tab${Math.floor(Math.random() * 16777215).toString(16)}`;
+      area.innerHTML += saltcorn.markup.toast(type, msg, rndid, title);
+      if (type === "success") successIds.push(rndid);
     }
     if (successIds.length > 0) {
       setTimeout(() => {
@@ -62,6 +64,34 @@ export function showAlerts(alerts, toast = true) {
   return true;
 }
 
+/**
+ * Make the alert area at the top empty
+ */
+export function clearAlerts() {
+  const iframe = document.getElementById("content-iframe");
+  const area = iframe.contentWindow.document.getElementById("alerts-area");
+  if (area) area.innerHTML = "";
+  const topAlert = iframe.contentWindow.document.getElementById("top-alert");
+  if (topAlert) topAlert.innerHTML = "";
+}
+
+/**
+ * Show alerts in the alert area at the top
+ * @param alerts
+ */
+export function showAlerts(alerts) {
+  if (typeof saltcorn === "undefined") {
+    console.log("Not yet initalized.");
+    console.log(alerts);
+  } else {
+    for (const { type, msg, title } of alerts) {
+      const iframe = document.getElementById("content-iframe");
+      const area = iframe.contentWindow.document.getElementById("top-alert");
+      area.innerHTML += saltcorn.markup.alert(type, msg);
+    }
+  }
+}
+
 export function showLoadSpinner() {
   const iframe = document.getElementById("content-iframe");
   if (iframe) iframe.contentWindow.showLoadSpinner();
@@ -72,17 +102,9 @@ export function removeLoadSpinner() {
   if (iframe) iframe.contentWindow.removeLoadSpinner();
 }
 
-export function clearTopAlerts() {
-  const iframe = document.getElementById("content-iframe");
-  const area = iframe.contentWindow.document.getElementById("alerts-area");
-  if (area) area.innerHTML = "";
-  const topAlert = iframe.contentWindow.document.getElementById("top-alert");
-  if (topAlert) topAlert.innerHTML = "";
-}
-
 export function errorAlert(error) {
   console.error(error);
-  showAlerts([
+  showToasts([
     {
       type: "error",
       msg: error.message ? error.message : "An error occured.",
@@ -110,7 +132,7 @@ export async function loadFileAsText(fileId) {
     });
   } catch (error) {
     if (
-      !showAlerts([
+      !showToasts([
         {
           type: "error",
           msg: error.message ? error.message : "An error occured.",
@@ -139,7 +161,7 @@ export async function loadEncodedFile(fileId) {
       reader.readAsDataURL(response.data);
     });
   } catch (error) {
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",
@@ -157,7 +179,7 @@ export async function takePhoto() {
     });
     return image.path;
   } catch (error) {
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",

package/src/helpers/navigation.js

@@ -3,7 +3,7 @@ import i18next from "i18next";
 
 import { router } from "../routing/index";
 import { startOfflineMode } from "./offline_mode";
-import { showAlerts } from "./common";
+import { showToasts } from "./common";
 
 export let routingHistory = [];
 
@@ -186,7 +186,7 @@ export async function handleRoute(route, query, files, data) {
           await replaceIframeInnerContent(page.content);
         else await replaceIframe(page.content, page.isFile);
       } else {
-        showAlerts([
+        showToasts([
           {
             type: "warning",
             msg: i18next.t("%s finished without a result", {
@@ -199,7 +199,7 @@ export async function handleRoute(route, query, files, data) {
     }
   } catch (error) {
     if (routeAdded) popRoute();
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: `${i18next.t("In %s", {
@@ -253,7 +253,7 @@ export async function gotoEntryView() {
     addRoute({ route: mobileConfig.entry_point, query: undefined });
     await replaceIframeInnerContent(page.content);
   } catch (error) {
-    showAlerts([
+    showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",

package/src/helpers/offline_mode.js

@@ -2,8 +2,10 @@
 
 import { apiCall } from "./api";
 import {
-  showAlerts,
+  showToasts,
+  clearToasts,
   clearAlerts,
+  showAlerts,
   errorAlert,
   showLoadSpinner,
   removeLoadSpinner,
@@ -318,12 +320,28 @@ const handleUniqueConflicts = async (uniqueConflicts, translatedIds) => {
   }
 };
 
-const handleUpdateConflicts = async (dataConflicts, alerts) => {
+/**
+ * If there was a field level data conflict, the server version is applied
+ * When it also was translated, change the untranslated row and translate it later the normal way
+ * @param {*} dataConflicts
+ * @param {*} translatedIds
+ * @param {*} alerts
+ */
+const handleUpdateConflicts = async (dataConflicts, translatedIds, alerts) => {
   let hasConflicts = false;
   for (const [tblName, updates] of Object.entries(dataConflicts)) {
     const table = saltcorn.data.models.Table.findOne({ name: tblName });
     const pkName = table.pk_name || "id";
+    const translations = translatedIds[tblName] || {};
     for (const update of updates) {
+      // search a translation where the current row is the target
+      // and if found, make sure the untranslated row is updated
+      for (const [from, to] of Object.entries(translations)) {
+        if (to === update[pkName]) {
+          update[pkName] = from;
+        }
+      }
+
       const { [pkName]: _sc_pkValue, ...rest } = update;
       await table.updateRow(rest, _sc_pkValue);
       hasConflicts = true;
@@ -404,7 +422,7 @@ const syncOfflineData = async (synchedTables, syncTimestamp, alerts) => {
     if (finished) {
       if (error) throw new Error(error.message);
       else {
-        await handleUpdateConflicts(dataConflicts, alerts);
+        await handleUpdateConflicts(dataConflicts, translatedIds, alerts);
         await handleUniqueConflicts(uniqueConflicts, translatedIds);
         await handleTranslatedIds(uniqueConflicts, translatedIds);
         await updateSyncInfos(offlineChanges, translatedIds, syncTimestamp);
@@ -481,16 +499,26 @@ const setSpinnerText = () => {
 
 let syncInProgress = false;
 
-export async function isSyncInProgress() {
+export function isSyncInProgress() {
   return syncInProgress;
 }
 
-export async function sync(background = false, alerts = []) {
+/**
+ *
+ * @param {boolean} withWakelock try request a wakelock and show a spinner during sync (propably not in background mode)
+ * @param {boolean} switchOnline end the offline mode and go online again after sync
+ * @param {string[]} alerts output alerts collected during sync
+ */
+export async function sync(
+  withWakelock = true,
+  switchOnline = true,
+  alerts = []
+) {
   if (syncInProgress)
     throw new Error("A synchronization is already in progress.");
-
+  syncInProgress = true;
   try {
-    if (!background) setSpinnerText();
+    if (withWakelock) setSpinnerText();
     const state = saltcorn.data.state.getState();
     const { user } = state.mobileConfig;
     const { offlineUser, hasOfflineData, uploadStarted, uploadStartTime } =
@@ -509,7 +537,7 @@ export async function sync(background = false, alerts = []) {
       const syncTimestamp = await getServerTime();
       await setUploadStarted(true, syncTimestamp);
       let lock = null;
-      if (!background) {
+      if (withWakelock) {
         try {
           if (window.navigator?.wakeLock?.request)
             lock = await window.navigator.wakeLock.request();
@@ -529,7 +557,7 @@ export async function sync(background = false, alerts = []) {
         syncDir = await syncOfflineData(synchedTables, syncTimestamp, alerts);
         await syncRemoteData(syncInfos, syncTimestamp);
         await setLocalSyncTimestamp(syncTimestamp);
-        if (!background) await endOfflineMode(true);
+        if (switchOnline) await endOfflineMode(true);
         await setUploadStarted(false);
         await saltcorn.data.db.query("COMMIT");
         transactionOpen = false;
@@ -626,21 +654,50 @@ export async function clearLocalData(inTransaction) {
   }
 }
 
-export function networkChangeCallback(status) {
+export async function networkChangeCallback(status) {
   console.log("Network status changed", status);
   const mobileConfig = saltcorn.data.state.getState().mobileConfig;
   if (status.connectionType !== "none" && mobileConfig.isOfflineMode) {
     const iframeWindow = $("#content-iframe")[0].contentWindow;
-    if (iframeWindow) {
-      clearAlerts();
-      iframeWindow.notifyAlert(
-        `An internet connection is available, to end the offline mode click ${saltcorn.markup.a(
-          {
-            href: "javascript:execLink('/sync/sync_settings')",
-          },
-          "here"
-        )}`
-      );
+    if (mobileConfig.syncOnReconnect) {
+      if (isSyncInProgress()) {
+        console.log("Sync already in progress, skipping automatic sync");
+        return;
+      }
+      console.log("Network restored, starting automatic sync");
+      const toasts = [];
+      try {
+        await sync(false, true, toasts);
+        if (iframeWindow) {
+          clearAlerts();
+          showAlerts([
+            {
+              type: "info",
+              msg: "You are online again.",
+            },
+          ]);
+        }
+        toasts.push({
+          type: "info",
+          msg: "Synchronized your offline data.",
+        });
+      } catch (error) {
+        console.log("Error during push sync:", error);
+      }
+      if (toasts.length > 0) showToasts(toasts);
+    } else {
+      const iframeWindow = $("#content-iframe")[0].contentWindow;
+      if (iframeWindow) {
+        clearToasts();
+        iframeWindow.notifyAlert(
+          `An internet connection is available, to end the offline mode click ${saltcorn.markup.a(
+            {
+              href: "javascript:execLink('/sync/sync_settings')",
+            },
+            "here"
+          )}`
+        );
+      }
     }
   }
   mobileConfig.networkState = status.connectionType;
@@ -680,7 +737,7 @@ export async function deleteOfflineData(noFeedback) {
     await clearLocalData(false);
     await setHasOfflineData(false);
     if (!noFeedback)
-      showAlerts([
+      showToasts([
         {
           type: "info",
           msg: "Deleted your offline data.",
@@ -700,8 +757,8 @@ export function addPushSyncHandler() {
     console.log("Push sync received:", notification);
     const alerts = [];
     try {
-      await sync(true, alerts);
-      if (alerts.length > 0) showAlerts(alerts);
+      await sync(false, false, alerts);
+      if (alerts.length > 0) showToasts(alerts);
     } catch (error) {
       console.log("Error during push sync:", error);
     }

package/src/init.js

@@ -472,7 +472,7 @@ export async function init(mobileConfig) {
             }
         } else if (offlineUser) {
           if (offlineUser === mobileConfig.user.email) {
-            await sync(false, alerts);
+            await sync(true, true, alerts);
             alerts.push({
               type: "info",
               msg: "Synchronized your offline data.",
@@ -483,7 +483,7 @@ export async function init(mobileConfig) {
               msg: `'${offlineUser}' has not yet uploaded offline data.`,
             });
         } else {
-          await sync(false, alerts);
+          await sync(true, true, alerts);
           alerts.push({
             type: "info",
             msg: "Synchronized your offline data.",

package/www/js/iframe_view_utils.js

@@ -192,7 +192,7 @@ async function inline_local_submit(e, opts1) {
     });
     inline_submit_success(e, form, opts);
   } catch (error) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",
@@ -565,7 +565,7 @@ async function mobile_modal(url, opts = {}) {
       // onOpen onClose initialize_page?
     }
   } catch (error) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: error.message ? error.message : "An error occured.",
@@ -665,7 +665,7 @@ async function make_unique_field(
       );
     }
   } catch (error) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: "unable to 'make_unique_field'",
@@ -835,16 +835,13 @@ async function switchNetworkMode() {
       parent.saltcorn.mobileApp.navigation.addRoute({
         route: "get/sync/sync_settings",
       });
-      parent.saltcorn.mobileApp.common.showAlerts(
-        [
-          {
-            type: "info",
-            msg: parent.saltcorn.mobileApp.offlineMode.getOfflineMsg(),
-          },
-        ],
-        false
-      );
-      parent.saltcorn.mobileApp.common.clearAlerts();
+      parent.saltcorn.mobileApp.common.showAlerts([
+        {
+          type: "info",
+          msg: parent.saltcorn.mobileApp.offlineMode.getOfflineMsg(),
+        },
+      ]);
+      parent.saltcorn.mobileApp.common.clearToasts();
     } else {
       if (networkState === "none")
         throw new Error("No internet connection is available.");
@@ -854,16 +851,16 @@ async function switchNetworkMode() {
       parent.saltcorn.mobileApp.navigation.addRoute({
         route: "get/sync/sync_settings",
       });
-      parent.saltcorn.mobileApp.common.showAlerts([
+      parent.saltcorn.mobileApp.common.showToasts([
         {
           type: "info",
           msg: "You are online again.",
         },
       ]);
-      parent.saltcorn.mobileApp.common.clearTopAlerts();
+      parent.saltcorn.mobileApp.common.clearAlerts();
     }
   } catch (error) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: `Unable to change the network mode: ${
@@ -883,7 +880,7 @@ async function callSync() {
   try {
     const mobileConfig = parent.saltcorn.data.state.getState().mobileConfig;
     if (mobileConfig.networkState === "none") {
-      parent.saltcorn.mobileApp.common.showAlerts([
+      parent.saltcorn.mobileApp.common.showToasts([
         {
           type: "error",
           msg: "You don't have an internet connection.",
@@ -893,14 +890,14 @@ async function callSync() {
       const wasOffline = mobileConfig.isOfflineMode;
       showLoadSpinner();
       const alerts = [];
-      await parent.saltcorn.mobileApp.offlineMode.sync(false, alerts);
-      parent.saltcorn.mobileApp.common.clearAlerts();
+      await parent.saltcorn.mobileApp.offlineMode.sync(true, true, alerts);
+      parent.saltcorn.mobileApp.common.clearToasts();
       if (!wasOffline) {
         alerts.push({
           type: "info",
           msg: "Synchronized your offline data.",
         });
-        parent.saltcorn.mobileApp.common.showAlerts(alerts);
+        parent.saltcorn.mobileApp.common.showToasts(alerts);
       } else {
         setNetworSwitcherOn();
         parent.saltcorn.mobileApp.navigation.clearHistory();
@@ -912,8 +909,8 @@ async function callSync() {
           type: "info",
           msg: "Synchronized your offline data, you are online again.",
         });
-        parent.saltcorn.mobileApp.common.showAlerts(alerts);
-        parent.saltcorn.mobileApp.common.clearTopAlerts();
+        parent.saltcorn.mobileApp.common.showToasts(alerts);
+        parent.saltcorn.mobileApp.common.clearAlerts();
       }
     }
   } catch (error) {
@@ -929,14 +926,14 @@ async function deleteOfflineDataClicked() {
     await parent.saltcorn.mobileApp.offlineMode.getLastOfflineSession();
   const { user } = parent.saltcorn.data.state.getState().mobileConfig;
   if (!lastOfflineSession?.offlineUser) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: "You don't have any offline data.",
       },
     ]);
   } else if (lastOfflineSession.offlineUser !== user.email) {
-    parent.saltcorn.mobileApp.common.showAlerts([
+    parent.saltcorn.mobileApp.common.showToasts([
       {
         type: "error",
         msg: `The offline data is owned by '${lastOfflineSession.offlineUser}'.`,