mobile: fix moving notebook on ios

Signed-off-by: Ammar Ahmed <40239442+ammarahm-ed@users.noreply.github.com>

.github/workflows/desktop.publish.yml

@@ -97,6 +97,9 @@ jobs:
       - name: Setup Node
         uses: ./.github/actions/setup-node-with-cache
 
+      - name: Install setuptools
+        run: brew install python-setuptools
+
       - name: Setup notarization
         run: |
           mkdir -p ~/private_keys/
@@ -144,7 +147,7 @@ jobs:
           CSC_KEY_PASSWORD: ${{ secrets.mac_certs_password }}
         run: |
           npx nx run release --project @notesnook/desktop -- --variant=mas
-          npx electron-builder --mac mas --universal -p never
+          yarn electron-builder --mac mas --universal -p never
         working-directory: ./apps/desktop
 
       - name: Build zip and dmg
@@ -158,9 +161,9 @@ jobs:
         run: |
           npx nx run release --project @notesnook/desktop
           if [ ${{ inputs.publish-github }} == true ]; then
-            npx electron-builder --mac zip dmg --arm64 --x64 -p always
+            yarn electron-builder --mac zip dmg --arm64 --x64 -p always
           else
-            npx electron-builder --mac zip dmg --arm64 --x64 -p never
+            yarn electron-builder --mac zip dmg --arm64 --x64 -p never
           fi
         working-directory: ./apps/desktop
 
@@ -216,7 +219,7 @@ jobs:
       - name: Build snap
         if: inputs.publish-snap
         run: |
-          npx electron-builder --linux snap:x64 -p never
+          yarn electron-builder --linux snap:x64 -p never
         working-directory: ./apps/desktop
 
       - name: Build AppImage
@@ -224,9 +227,9 @@ jobs:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
           if [ ${{ inputs.publish-github }} == true ]; then
-            npx electron-builder --linux AppImage:x64 AppImage:arm64 -p always
+            yarn electron-builder --linux AppImage:x64 AppImage:arm64 -p always
           else
-            npx electron-builder --linux AppImage:x64 AppImage:arm64 -p never
+            yarn electron-builder --linux AppImage:x64 AppImage:arm64 -p never
           fi
         working-directory: ./apps/desktop
 
@@ -251,8 +254,8 @@ jobs:
         with:
           dotnet-version: 6.0.x
 
-      - name: Install AzureCodeSigning
-        run: Install-Module -Name AzureCodeSigning -RequiredVersion 0.3.0 -Force -Repository PSGallery
+      - name: Install TrustedSigning
+        run: Install-Module -Name TrustedSigning -RequiredVersion 0.3.15 -Force -Repository PSGallery
         shell: pwsh
 
       - name: Setup Node

.github/workflows/web.tests.yml

@@ -67,7 +67,7 @@ jobs:
       - name: Install packages
         run: |
           npm ci --ignore-scripts --prefer-offline --no-audit
-          npm install -D @playwright/test otplib
+          npm install -D @playwright/test otplib dayjs @zip.js/zip.js
 
       - name: Validate build extraction
         run: ls -ld ./apps/web/build/index.html

apps/desktop/package-lock.json

@@ -1,23 +1,23 @@
 {
   "name": "@notesnook/desktop",
-  "version": "3.0.7-beta",
+  "version": "3.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@notesnook/desktop",
-      "version": "3.0.7-beta",
+      "version": "3.0.0",
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "dependencies": {
         "@notesnook/crypto": "file:../../packages/crypto",
         "@trpc/client": "10.38.3",
         "@trpc/server": "10.38.3",
-        "better-sqlite3-multiple-ciphers": "^9.4.0",
+        "better-sqlite3-multiple-ciphers": "^9.5.0",
         "electron-trpc": "0.5.2",
         "electron-updater": "6.1.4",
         "icojs": "^0.17.1",
-        "sodium-native": "^4.0.6",
+        "sodium-native": "^4.1.1",
         "typed-emitter": "^2.1.0",
         "yargs": "^17.6.2",
         "zod": "^3.21.4"
@@ -26,11 +26,13 @@
         "@types/node": "18.16.1",
         "@types/yargs": "^17.0.24",
         "chokidar": "^3.5.3",
-        "electron": "^28.2.1",
-        "electron-builder": "^24.9.1",
+        "electron": "^29.3.1",
+        "electron-builder": "^24.13.3",
         "esbuild": "^0.20.0",
+        "node-gyp-build": "^4.8.0",
+        "prebuildify": "^6.0.1",
         "tree-kill": "^1.2.2",
-        "undici": "^6.6.1"
+        "undici": "^6.14.1"
       },
       "optionalDependencies": {
         "dmg-license": "^1.0.11"
@@ -68,9 +70,9 @@
       }
     },
     "node_modules/@electron/asar": {
-      "version": "3.2.8",
-      "resolved": "https://registry.npmjs.org/@electron/asar/-/asar-3.2.8.tgz",
-      "integrity": "sha512-cmskk5M06ewHMZAplSiF4AlME3IrnnZhKnWbtwKVLRkdJkKyUVjMLhDIiPIx/+6zQWVlKX/LtmK9xDme7540Sg==",
+      "version": "3.2.9",
+      "resolved": "https://registry.npmjs.org/@electron/asar/-/asar-3.2.9.tgz",
+      "integrity": "sha512-Vu2P3X2gcZ3MY9W7yH72X9+AMXwUQZEJBrsPIbX0JsdllLtoh62/Q8Wg370/DawIEVKOyfD6KtTLo645ezqxUA==",
       "dev": true,
       "dependencies": {
         "commander": "^5.0.0",
@@ -169,9 +171,9 @@
       }
     },
     "node_modules/@electron/notarize": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@electron/notarize/-/notarize-2.1.0.tgz",
-      "integrity": "sha512-Q02xem1D0sg4v437xHgmBLxI2iz/fc0D4K7fiVWHa/AnW8o7D751xyKNXgziA6HrTOme9ul1JfWN5ark8WH1xA==",
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/@electron/notarize/-/notarize-2.2.1.tgz",
+      "integrity": "sha512-aL+bFMIkpR0cmmj5Zgy0LMKEpgy43/hw5zadEArgmAMWWlKc5buwFvFT9G/o/YJkvXAJm5q3iuTuLaiaXW39sg==",
       "dev": true,
       "dependencies": {
         "debug": "^4.1.1",
@@ -231,9 +233,9 @@
       }
     },
     "node_modules/@electron/universal": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/@electron/universal/-/universal-1.4.1.tgz",
-      "integrity": "sha512-lE/U3UNw1YHuowNbTmKNs9UlS3En3cPgwM5MI+agIgr/B1hSze9NdOP0qn7boZaI9Lph8IDv3/24g9IxnJP7aQ==",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@electron/universal/-/universal-1.5.1.tgz",
+      "integrity": "sha512-kbgXxyEauPJiQQUNG2VgUeyfQNFk6hBF11ISN2PNI6agUgPl55pv4eQmaqHzTAzchBvqZ2tQuRVaPStGf0mxGw==",
       "dev": true,
       "dependencies": {
         "@electron/asar": "^3.2.1",
@@ -653,13 +655,100 @@
         "node": ">=12"
       }
     },
-    "node_modules/@fastify/busboy": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.0.tgz",
-      "integrity": "sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==",
+    "node_modules/@isaacs/cliui": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "dev": true,
+      "dependencies": {
+        "string-width": "^5.1.2",
+        "string-width-cjs": "npm:string-width@^4.2.0",
+        "strip-ansi": "^7.0.1",
+        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+        "wrap-ansi": "^8.1.0",
+        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
+      "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
       "dev": true,
       "engines": {
-        "node": ">=14"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "dev": true,
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true
+    },
+    "node_modules/@isaacs/cliui/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "dev": true,
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "dev": true,
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
     "node_modules/@malept/cross-spawn-promise": {
@@ -718,6 +807,16 @@
       "resolved": "../../packages/crypto",
       "link": true
     },
+    "node_modules/@pkgjs/parseargs": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "dev": true,
+      "optional": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/@sindresorhus/is": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-4.6.0.tgz",
@@ -967,26 +1066,25 @@
       "dev": true
     },
     "node_modules/app-builder-lib": {
-      "version": "24.9.1",
-      "resolved": "https://registry.npmjs.org/app-builder-lib/-/app-builder-lib-24.9.1.tgz",
-      "integrity": "sha512-Q1nYxZcio4r+W72cnIRVYofEAyjBd3mG47o+zms8HlD51zWtA/YxJb01Jei5F+jkWhge/PTQK+uldsPh6d0/4g==",
+      "version": "24.13.3",
+      "resolved": "https://registry.npmjs.org/app-builder-lib/-/app-builder-lib-24.13.3.tgz",
+      "integrity": "sha512-FAzX6IBit2POXYGnTCT8YHFO/lr5AapAII6zzhQO3Rw4cEDOgK+t1xhLc5tNcKlicTHlo9zxIwnYCX9X2DLkig==",
       "dev": true,
       "dependencies": {
         "@develar/schema-utils": "~2.6.5",
-        "@electron/notarize": "2.1.0",
+        "@electron/notarize": "2.2.1",
         "@electron/osx-sign": "1.0.5",
-        "@electron/universal": "1.4.1",
+        "@electron/universal": "1.5.1",
         "@malept/flatpak-bundler": "^0.4.0",
         "@types/fs-extra": "9.0.13",
-        "7zip-bin": "~5.2.0",
         "async-exit-hook": "^2.0.1",
         "bluebird-lst": "^1.0.9",
-        "builder-util": "24.8.1",
-        "builder-util-runtime": "9.2.3",
+        "builder-util": "24.13.1",
+        "builder-util-runtime": "9.2.4",
         "chromium-pickle-js": "^0.2.0",
         "debug": "^4.3.4",
         "ejs": "^3.1.8",
-        "electron-publish": "24.8.1",
+        "electron-publish": "24.13.1",
         "form-data": "^4.0.0",
         "fs-extra": "^10.1.0",
         "hosted-git-info": "^4.1.0",
@@ -1003,12 +1101,16 @@
       },
       "engines": {
         "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "dmg-builder": "24.13.3",
+        "electron-builder-squirrel-windows": "24.13.3"
       }
     },
     "node_modules/app-builder-lib/node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -1097,9 +1199,9 @@
       ]
     },
     "node_modules/better-sqlite3-multiple-ciphers": {
-      "version": "9.4.0",
-      "resolved": "https://registry.npmjs.org/better-sqlite3-multiple-ciphers/-/better-sqlite3-multiple-ciphers-9.4.0.tgz",
-      "integrity": "sha512-uQoBdShnpCdAPUmCPuLSrHtfSHAxjIFQvLnMbXHsvbWkfBP3sPfnnIaUTz7KHYRqgWNLlcQfs+9F9uqvMqau6Q==",
+      "version": "9.5.0",
+      "resolved": "https://registry.npmjs.org/better-sqlite3-multiple-ciphers/-/better-sqlite3-multiple-ciphers-9.5.0.tgz",
+      "integrity": "sha512-6A9xBRvssONJW07Lur6pmkaUwlCGz1bnjFmXrrAR3qXETUBk92OI4C/+LhMOatn5wQ8AQzLScFZC/CKUpxkTaw==",
       "hasInstallScript": true,
       "dependencies": {
         "bindings": "^1.5.0",
@@ -1232,16 +1334,16 @@
       "dev": true
     },
     "node_modules/builder-util": {
-      "version": "24.8.1",
-      "resolved": "https://registry.npmjs.org/builder-util/-/builder-util-24.8.1.tgz",
-      "integrity": "sha512-ibmQ4BnnqCnJTNrdmdNlnhF48kfqhNzSeqFMXHLIl+o9/yhn6QfOaVrloZ9YUu3m0k3rexvlT5wcki6LWpjTZw==",
+      "version": "24.13.1",
+      "resolved": "https://registry.npmjs.org/builder-util/-/builder-util-24.13.1.tgz",
+      "integrity": "sha512-NhbCSIntruNDTOVI9fdXz0dihaqX2YuE1D6zZMrwiErzH4ELZHE6mdiB40wEgZNprDia+FghRFgKoAqMZRRjSA==",
       "dev": true,
       "dependencies": {
         "@types/debug": "^4.1.6",
         "7zip-bin": "~5.2.0",
         "app-builder-bin": "4.0.0",
         "bluebird-lst": "^1.0.9",
-        "builder-util-runtime": "9.2.3",
+        "builder-util-runtime": "9.2.4",
         "chalk": "^4.1.2",
         "cross-spawn": "^7.0.3",
         "debug": "^4.3.4",
@@ -1268,9 +1370,9 @@
       }
     },
     "node_modules/builder-util/node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -1474,13 +1576,59 @@
       "dev": true
     },
     "node_modules/config-file-ts": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/config-file-ts/-/config-file-ts-0.2.4.tgz",
-      "integrity": "sha512-cKSW0BfrSaAUnxpgvpXPLaaW/umg4bqg4k3GO1JqlRfpx+d5W0GDXznCMkWotJQek5Mmz1MJVChQnz3IVaeMZQ==",
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/config-file-ts/-/config-file-ts-0.2.6.tgz",
+      "integrity": "sha512-6boGVaglwblBgJqGyxm4+xCmEGcWgnWHSWHY5jad58awQhB6gftq0G8HbzU39YqCIYHMLAiL1yjwiZ36m/CL8w==",
       "dev": true,
       "dependencies": {
-        "glob": "^7.1.6",
-        "typescript": "^4.0.2"
+        "glob": "^10.3.10",
+        "typescript": "^5.3.3"
+      }
+    },
+    "node_modules/config-file-ts/node_modules/glob": {
+      "version": "10.3.12",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.12.tgz",
+      "integrity": "sha512-TCNv8vJ+xz4QiqTpfOJA7HvYv+tNIRHKfUWw/q+v2jdgN4ebz+KY9tGx5J4rHP0o84mNP+ApH66HRX8us3Khqg==",
+      "dev": true,
+      "dependencies": {
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^2.3.6",
+        "minimatch": "^9.0.1",
+        "minipass": "^7.0.4",
+        "path-scurry": "^1.10.2"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/config-file-ts/node_modules/minimatch": {
+      "version": "9.0.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
+      "integrity": "sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==",
+      "dev": true,
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/config-file-ts/node_modules/minipass": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz",
+      "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
       }
     },
     "node_modules/core-util-is": {
@@ -1669,14 +1817,14 @@
       }
     },
     "node_modules/dmg-builder": {
-      "version": "24.9.1",
-      "resolved": "https://registry.npmjs.org/dmg-builder/-/dmg-builder-24.9.1.tgz",
-      "integrity": "sha512-huC+O6hvHd24Ubj3cy2GMiGLe2xGFKN3klqVMLAdcbB6SWMd1yPSdZvV8W1O01ICzCCRlZDHiv4VrNUgnPUfbQ==",
+      "version": "24.13.3",
+      "resolved": "https://registry.npmjs.org/dmg-builder/-/dmg-builder-24.13.3.tgz",
+      "integrity": "sha512-rcJUkMfnJpfCboZoOOPf4L29TRtEieHNOeAbYPWPxlaBw/Z1RKrRA86dOI9rwaI4tQSc/RD82zTNHprfUHXsoQ==",
       "dev": true,
       "dependencies": {
-        "app-builder-lib": "24.9.1",
-        "builder-util": "24.8.1",
-        "builder-util-runtime": "9.2.3",
+        "app-builder-lib": "24.13.3",
+        "builder-util": "24.13.1",
+        "builder-util-runtime": "9.2.4",
         "fs-extra": "^10.1.0",
         "iconv-lite": "^0.6.2",
         "js-yaml": "^4.1.0"
@@ -1686,9 +1834,9 @@
       }
     },
     "node_modules/dmg-builder/node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -1723,16 +1871,31 @@
         "node": ">=8"
       }
     },
+    "node_modules/dotenv": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-9.0.2.tgz",
+      "integrity": "sha512-I9OvvrHp4pIARv4+x9iuewrWycX6CcZtoAu1XrzPxc5UygMJXJZYmBsynku8IkrJwgypE5DGNjDPmPRhDCptUg==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/dotenv-expand": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-5.1.0.tgz",
       "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==",
       "dev": true
     },
+    "node_modules/eastasianwidth": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "dev": true
+    },
     "node_modules/ejs": {
-      "version": "3.1.9",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.9.tgz",
-      "integrity": "sha512-rC+QVNMJWv+MtPgkt0y+0rVEIdbtxVADApW9JXrUVlzHetgcyczP/E7DJmWJ4fJCZF2cPcBk0laWO9ZHMG3DmQ==",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
+      "integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
       "dev": true,
       "dependencies": {
         "jake": "^10.8.5"
@@ -1745,14 +1908,14 @@
       }
     },
     "node_modules/electron": {
-      "version": "28.2.1",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-28.2.1.tgz",
-      "integrity": "sha512-wlzXf+OvOiVlBf9dcSeMMf7Q+N6DG+wtgFbMK0sA/JpIJcdosRbLMQwLg/LTwNVKIbmayqFLDp4FmmFkEMhbYA==",
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-29.3.1.tgz",
+      "integrity": "sha512-auge1/6RVqgUd6TgIq88wKdUCJi2cjESi3jy7d+6X4JzvBGprKBqMJ8JSSFpu/Px1YJrFUKAxfy6SC+TQf1uLw==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
         "@electron/get": "^2.0.0",
-        "@types/node": "^18.11.18",
+        "@types/node": "^20.9.0",
         "extract-zip": "^2.0.1"
       },
       "bin": {
@@ -1763,16 +1926,16 @@
       }
     },
     "node_modules/electron-builder": {
-      "version": "24.9.1",
-      "resolved": "https://registry.npmjs.org/electron-builder/-/electron-builder-24.9.1.tgz",
-      "integrity": "sha512-v7BuakDuY6sKMUYM8mfQGrwyjBpZ/ObaqnenU0H+igEL10nc6ht049rsCw2HghRBdEwJxGIBuzs3jbEhNaMDmg==",
+      "version": "24.13.3",
+      "resolved": "https://registry.npmjs.org/electron-builder/-/electron-builder-24.13.3.tgz",
+      "integrity": "sha512-yZSgVHft5dNVlo31qmJAe4BVKQfFdwpRw7sFp1iQglDRCDD6r22zfRJuZlhtB5gp9FHUxCMEoWGq10SkCnMAIg==",
       "dev": true,
       "dependencies": {
-        "app-builder-lib": "24.9.1",
-        "builder-util": "24.8.1",
-        "builder-util-runtime": "9.2.3",
+        "app-builder-lib": "24.13.3",
+        "builder-util": "24.13.1",
+        "builder-util-runtime": "9.2.4",
         "chalk": "^4.1.2",
-        "dmg-builder": "24.9.1",
+        "dmg-builder": "24.13.3",
         "fs-extra": "^10.1.0",
         "is-ci": "^3.0.0",
         "lazy-val": "^1.0.5",
@@ -1789,9 +1952,9 @@
       }
     },
     "node_modules/electron-builder/node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -1802,14 +1965,14 @@
       }
     },
     "node_modules/electron-publish": {
-      "version": "24.8.1",
-      "resolved": "https://registry.npmjs.org/electron-publish/-/electron-publish-24.8.1.tgz",
-      "integrity": "sha512-IFNXkdxMVzUdweoLJNXSupXkqnvgbrn3J4vognuOY06LaS/m0xvfFYIf+o1CM8if6DuWYWoQFKPcWZt/FUjZPw==",
+      "version": "24.13.1",
+      "resolved": "https://registry.npmjs.org/electron-publish/-/electron-publish-24.13.1.tgz",
+      "integrity": "sha512-2ZgdEqJ8e9D17Hwp5LEq5mLQPjqU3lv/IALvgp+4W8VeNhryfGhYEQC/PgDPMrnWUp+l60Ou5SJLsu+k4mhQ8A==",
       "dev": true,
       "dependencies": {
         "@types/fs-extra": "^9.0.11",
-        "builder-util": "24.8.1",
-        "builder-util-runtime": "9.2.3",
+        "builder-util": "24.13.1",
+        "builder-util-runtime": "9.2.4",
         "chalk": "^4.1.2",
         "fs-extra": "^10.1.0",
         "lazy-val": "^1.0.5",
@@ -1817,9 +1980,9 @@
       }
     },
     "node_modules/electron-publish/node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -1857,6 +2020,15 @@
         "tiny-typed-emitter": "^2.1.0"
       }
     },
+    "node_modules/electron/node_modules/@types/node": {
+      "version": "20.12.7",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.7.tgz",
+      "integrity": "sha512-wq0cICSkRLVaf3UGLMGItu/PtdY7oaXaI/RVU+xliKVOtRna3PRY57ZDfztpDL0n11vfymMUnXv8QwYCO7L1wg==",
+      "dev": true,
+      "dependencies": {
+        "undici-types": "~5.26.4"
+      }
+    },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
@@ -2051,6 +2223,22 @@
         "node": ">=8"
       }
     },
+    "node_modules/foreground-child": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
+      "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
+      "dev": true,
+      "dependencies": {
+        "cross-spawn": "^7.0.0",
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/form-data": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
@@ -2561,12 +2749,12 @@
       }
     },
     "node_modules/isbinaryfile": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-5.0.0.tgz",
-      "integrity": "sha512-UDdnyGvMajJUWCkib7Cei/dvyJrrvo4FIrsvSFWdPpXSUorzXrDJ0S+X5Q4ZlasfPjca4yqCNNsjbCeiy8FFeg==",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-5.0.2.tgz",
+      "integrity": "sha512-GvcjojwonMjWbTkfMpnVHVqXW/wKMYDfEpY94/8zy8HFMOqb/VL6oeONq9v87q4ttVlaTLnGXnJD4B5B1OTGIg==",
       "dev": true,
       "engines": {
-        "node": ">= 14.0.0"
+        "node": ">= 18.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/gjtorikian/"
@@ -2578,6 +2766,24 @@
       "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
       "dev": true
     },
+    "node_modules/jackspeak": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz",
+      "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==",
+      "dev": true,
+      "dependencies": {
+        "@isaacs/cliui": "^8.0.2"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      },
+      "optionalDependencies": {
+        "@pkgjs/parseargs": "^0.11.0"
+      }
+    },
     "node_modules/jake": {
       "version": "10.8.7",
       "resolved": "https://registry.npmjs.org/jake/-/jake-10.8.7.tgz",
@@ -2910,6 +3116,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/npm-run-path": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-3.1.0.tgz",
+      "integrity": "sha512-Dbl4A/VfiVGLgQv29URL9xshU8XDY1GeLy+fsaZ1AA8JDSfjvr5P5+pzRbWqRSBxk6/DW7MIh8lTM/PaGnP2kg==",
+      "dev": true,
+      "dependencies": {
+        "path-key": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/object-keys": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
@@ -2955,6 +3173,31 @@
         "node": ">=8"
       }
     },
+    "node_modules/path-scurry": {
+      "version": "1.10.2",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.2.tgz",
+      "integrity": "sha512-7xTavNy5RQXnsjANvVvMkEjvloOinkAjv/Z6Ildz9v2RinZ4SBKTWFOVRbaF8p0vpHnyjV/UwNDdKuUv6M5qcA==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^10.2.0",
+        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "10.2.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.2.1.tgz",
+      "integrity": "sha512-tS24spDe/zXhWbNPErCHs/AGOzbKGHT+ybSBqmdLm8WZ1xXLWvH8Qn71QPAlqVhd0qUTWjy+Kl9JmISgDdEjsA==",
+      "dev": true,
+      "engines": {
+        "node": "14 || >=16.14"
+      }
+    },
     "node_modules/peek-readable": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/peek-readable/-/peek-readable-4.1.0.tgz",
@@ -3031,6 +3274,23 @@
         "node": ">=10"
       }
     },
+    "node_modules/prebuildify": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/prebuildify/-/prebuildify-6.0.1.tgz",
+      "integrity": "sha512-8Y2oOOateom/s8dNBsGIcnm6AxPmLH4/nanQzL5lQMU+sC0CMhzARZHizwr36pUPLdvBnOkCNQzxg4djuFSgIw==",
+      "dev": true,
+      "dependencies": {
+        "minimist": "^1.2.5",
+        "mkdirp-classic": "^0.5.3",
+        "node-abi": "^3.3.0",
+        "npm-run-path": "^3.1.0",
+        "pump": "^3.0.0",
+        "tar-fs": "^2.1.0"
+      },
+      "bin": {
+        "prebuildify": "bin.js"
+      }
+    },
     "node_modules/progress": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
@@ -3114,15 +3374,6 @@
         "node": ">=12.0.0"
       }
     },
-    "node_modules/read-config-file/node_modules/dotenv": {
-      "version": "9.0.2",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-9.0.2.tgz",
-      "integrity": "sha512-I9OvvrHp4pIARv4+x9iuewrWycX6CcZtoAu1XrzPxc5UygMJXJZYmBsynku8IkrJwgypE5DGNjDPmPRhDCptUg==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/readable-stream": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
@@ -3198,21 +3449,6 @@
         "node": ">= 4"
       }
     },
-    "node_modules/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "dev": true,
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/roarr": {
       "version": "2.15.4",
       "resolved": "https://registry.npmjs.org/roarr/-/roarr-2.15.4.tgz",
@@ -3350,6 +3586,18 @@
         "node": ">=8"
       }
     },
+    "node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "dev": true,
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/simple-concat": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",
@@ -3430,12 +3678,12 @@
       }
     },
     "node_modules/sodium-native": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/sodium-native/-/sodium-native-4.0.6.tgz",
-      "integrity": "sha512-uYsyycwcz9kYDwpXxJmL2YZosynsxcP6RPySbARVJdC9uNDa2CMjzJ7/WsMMvThKgvAYsBWdZc7L/WSVj9lTcA==",
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/sodium-native/-/sodium-native-4.1.1.tgz",
+      "integrity": "sha512-LXkAfRd4FHtkQS4X6g+nRcVaN7mWVNepV06phIsC6+IZFvGh1voW5TNQiQp2twVaMf05gZqQjuS+uWLM6gHhNQ==",
       "hasInstallScript": true,
       "dependencies": {
-        "node-gyp-build": "^4.6.0"
+        "node-gyp-build": "^4.8.0"
       }
     },
     "node_modules/source-map": {
@@ -3458,9 +3706,9 @@
       }
     },
     "node_modules/sprintf-js": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.2.tgz",
-      "integrity": "sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
+      "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
       "dev": true,
       "optional": true
     },
@@ -3494,6 +3742,21 @@
         "node": ">=8"
       }
     },
+    "node_modules/string-width-cjs": {
+      "name": "string-width",
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/strip-ansi": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
@@ -3505,6 +3768,19 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-ansi-cjs": {
+      "name": "strip-ansi",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/strip-json-comments": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
@@ -3554,9 +3830,9 @@
       }
     },
     "node_modules/tar": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.0.tgz",
-      "integrity": "sha512-/Wo7DcT0u5HUV486xg675HtjNd3BXZ6xDbzsCUZPt5iw8bTQ63bP0Raut3mvro9u+CUyq7YQd8Cx55fsZXxqLQ==",
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.1.tgz",
+      "integrity": "sha512-DZ4yORTwrbTj/7MZYq2w+/ZFdI6OZ/f9SFHR+71gIVUZhOQPHzVCLpvRnPgyaMpfWxxk/4ONva3GQSyNIKRv6A==",
       "dev": true,
       "dependencies": {
         "chownr": "^2.0.0",
@@ -3617,15 +3893,12 @@
       "integrity": "sha512-qVtvMxeXbVej0cQWKqVSSAHmKZEHAvxdF8HEUBFWts8h+xEo5m/lEiPakuyZ3BnCBjOD8i24kzNOiOLLgsSxhA=="
     },
     "node_modules/tmp": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
-      "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.3.tgz",
+      "integrity": "sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==",
       "dev": true,
-      "dependencies": {
-        "rimraf": "^3.0.0"
-      },
       "engines": {
-        "node": ">=8.17.0"
+        "node": ">=14.14"
       }
     },
     "node_modules/tmp-promise": {
@@ -3714,30 +3987,33 @@
       }
     },
     "node_modules/typescript": {
-      "version": "4.9.5",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
-      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
+      "version": "5.4.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
+      "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=4.2.0"
+        "node": ">=14.17"
       }
     },
     "node_modules/undici": {
-      "version": "6.6.1",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-6.6.1.tgz",
-      "integrity": "sha512-J0GaEp0ztu/grIE2Uq57AbK6TRb+bWbOlxu0POCzhFKA6LKbwSAev+hDQaQcgUUA9CPs8Ky+cauzTHnQrtAQEA==",
+      "version": "6.14.1",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-6.14.1.tgz",
+      "integrity": "sha512-mAel3i4BsYhkeVPXeIPXVGPJKeBzqCieZYoFsbWfUzd68JmHByhc1Plit5WlylxXFaGpgkZB8mExlxnt+Q1p7A==",
       "dev": true,
-      "dependencies": {
-        "@fastify/busboy": "^2.0.0"
-      },
       "engines": {
-        "node": ">=18.0"
+        "node": ">=18.17"
       }
     },
+    "node_modules/undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "dev": true
+    },
     "node_modules/universalify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
@@ -3811,6 +4087,24 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
+    "node_modules/wrap-ansi-cjs": {
+      "name": "wrap-ansi",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

apps/desktop/package.json

@@ -2,7 +2,7 @@
   "name": "@notesnook/desktop",
   "productName": "Notesnook",
   "description": "Your private note taking space",
-  "version": "3.0.7-beta",
+  "version": "3.0.0",
   "appAppleId": "1544027013",
   "private": true,
   "main": "./dist/index.js",
@@ -14,11 +14,11 @@
     "@notesnook/crypto": "file:../../packages/crypto",
     "@trpc/client": "10.38.3",
     "@trpc/server": "10.38.3",
-    "better-sqlite3-multiple-ciphers": "^9.4.0",
+    "better-sqlite3-multiple-ciphers": "^9.5.0",
     "electron-trpc": "0.5.2",
     "electron-updater": "6.1.4",
     "icojs": "^0.17.1",
-    "sodium-native": "^4.0.6",
+    "sodium-native": "^4.1.1",
     "typed-emitter": "^2.1.0",
     "yargs": "^17.6.2",
     "zod": "^3.21.4"
@@ -27,11 +27,13 @@
     "@types/node": "18.16.1",
     "@types/yargs": "^17.0.24",
     "chokidar": "^3.5.3",
-    "electron": "^28.2.1",
-    "electron-builder": "^24.9.1",
+    "electron": "^29.3.1",
+    "electron-builder": "^24.13.3",
     "esbuild": "^0.20.0",
+    "node-gyp-build": "^4.8.0",
+    "prebuildify": "^6.0.1",
     "tree-kill": "^1.2.2",
-    "undici": "^6.6.1"
+    "undici": "^6.14.1"
   },
   "optionalDependencies": {
     "dmg-license": "^1.0.11"
@@ -55,8 +57,8 @@
     "productName": "Notesnook",
     "copyright": "Copyright © 2023 Streetwriters (Private) Limited",
     "artifactName": "notesnook_${os}_${arch}.${ext}",
-    "asar": false,
     "generateUpdatesFilesForAllChannels": true,
+    "asar": false,
     "files": [
       "!*.chunk.js.map",
       "!*.chunk.js.LICENSE.txt",
@@ -219,8 +221,7 @@
       {
         "provider": "github",
         "repo": "notesnook",
-        "owner": "streetwriters",
-        "channel": "beta"
+        "owner": "streetwriters"
       }
     ]
   }

apps/desktop/patches/node-gyp-build+4.8.0.patch

@@ -0,0 +1,46 @@
+diff --git a/node_modules/node-gyp-build/bin.js b/node_modules/node-gyp-build/bin.js
+index 3fbcdf0..7ca3ab5 100644
+--- a/node_modules/node-gyp-build/bin.js
++++ b/node_modules/node-gyp-build/bin.js
+@@ -16,7 +16,8 @@ if (!buildFromSource()) {
+ }
+ 
+ function build () {
+-  var args = [os.platform() === 'win32' ? 'node-gyp.cmd' : 'node-gyp', 'rebuild']
++  var win32 = os.platform() === 'win32'
++  var args = [win32 ? 'node-gyp.cmd' : 'node-gyp', 'rebuild']
+ 
+   try {
+     var pkg = require('node-gyp/package.json')
+@@ -27,7 +28,7 @@ function build () {
+     ]
+   } catch (_) {}
+ 
+-  proc.spawn(args[0], args.slice(1), { stdio: 'inherit' }).on('exit', function (code) {
++  proc.spawn(args[0], args.slice(1), { stdio: 'inherit', shell: win32, windowsHide: true }).on('exit', function (code) {
+     if (code || !process.argv[3]) process.exit(code)
+     exec(process.argv[3]).on('exit', function (code) {
+       process.exit(code)
+@@ -45,15 +46,18 @@ function preinstall () {
+ 
+ function exec (cmd) {
+   if (process.platform !== 'win32') {
+-    var shell = os.platform() === 'android' ? 'sh' : '/bin/sh'
+-    return proc.spawn(shell, ['-c', '--', cmd], {
++    var shell = os.platform() === 'android' ? 'sh' : true
++    return proc.spawn(cmd, [], {
++      shell,
+       stdio: 'inherit'
+     })
+   }
+ 
+-  return proc.spawn(process.env.comspec || 'cmd.exe', ['/s', '/c', '"' + cmd + '"'], {
++  return proc.spawn(cmd, [], {
+     windowsVerbatimArguments: true,
+-    stdio: 'inherit'
++    stdio: 'inherit',
++    shell: true,
++    windowsHide: true
+   })
+ }
+ 

apps/desktop/scripts/build.mjs

@@ -19,7 +19,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import path from "path";
 import fs, { readFile, writeFile } from "fs/promises";
-import { existsSync } from "fs";
+import { existsSync, readFileSync } from "fs";
 import yargs from "yargs-parser";
 import os from "os";
 import * as childProcess from "child_process";
@@ -28,21 +28,27 @@ import { fileURLToPath } from "url";
 const args = yargs(process.argv);
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
+const packageJson = JSON.parse(
+  readFileSync(path.join(__dirname, "..", "package.json"), "utf-8")
+);
 
 const webAppPath = path.resolve(path.join(__dirname, "..", "..", "web"));
 
 await fs.rm("./build/", { force: true, recursive: true });
 
 if (args.rebuild || !existsSync(path.join(webAppPath, "build"))) {
-  await exec(`cd ${webAppPath} && npm run build:desktop`);
+  await exec(
+    "npx nx build:desktop @notesnook/web",
+    path.join(__dirname, "..", "..", "..")
+  );
 }
 
-// temporary until there's support for prebuilt binaries for windows ARM & linux ARM
-await patchBetterSQLite3();
+// temporary until there's support for prebuilt binaries for linux ARM
+if (os.platform() === "linux") await patchBetterSQLite3();
 
 if (os.platform() === "win32")
   await exec(
-    "npx prebuildify --arch=arm64 --strip",
+    `npx prebuildify --arch=arm64 --strip -t electron@${packageJson.devDependencies.electron}`,
     path.join(__dirname, "..", "node_modules", "sodium-native")
   );
 
@@ -64,7 +70,7 @@ if (args.run) {
   if (process.platform === "win32") {
     await exec(`.\\output\\win-unpacked\\Notesnook.exe`);
   } else if (process.platform === "darwin") {
-    await exec(`./output/darwin-unpacked/Notesnook`);
+    await exec(`./output/mac/Notesnook.app/Contents/MacOS/Notesnook`);
   } else {
     await exec(`./output/linux-unpacked/Notesnook`);
   }
@@ -88,7 +94,7 @@ async function patchBetterSQLite3() {
   );
   const json = JSON.parse(await readFile(jsonPath, "utf-8"));
 
-  json.version = "9.4.1";
+  json.version = "9.5.1";
   json.homepage = "https://github.com/thecodrr/better-sqlite3-multiple-ciphers";
   json.repository.url =
     "git://github.com/thecodrr/better-sqlite3-multiple-ciphers.git";

apps/desktop/scripts/dev.mjs

@@ -53,7 +53,7 @@ async function onChange(first) {
   if (first) {
     await fs.rm("./build/", { force: true, recursive: true });
 
-    await exec("npx electron-rebuild");
+    await exec("npx electron-builder install-app-deps");
   }
 
   await exec(`npm run bundle`);

apps/desktop/scripts/sign.js

@@ -33,7 +33,7 @@ module.exports = async function (configuration) {
   const DescriptionUrl = "https://notesnook.com/";
   const FilesCatalog = createCatalog(configuration.path);
 
-  const command = `Invoke-AzureCodeSigning -Endpoint "${Endpoint}" -CodeSigningAccountName "${CodeSigningAccountName}" -CertificateProfileName "${CertificateProfileName}" -FileDigest "${FileDigest}" -TimestampRfc3161 "${TimestampRfc3161}" -TimestampDigest "${TimestampDigest}" -Description "${Description}" -DescriptionUrl "${DescriptionUrl}" -FilesCatalog "${FilesCatalog}"`;
+  const command = `Invoke-TrustedSigning -Endpoint "${Endpoint}" -CodeSigningAccountName "${CodeSigningAccountName}" -CertificateProfileName "${CertificateProfileName}" -FileDigest "${FileDigest}" -TimestampRfc3161 "${TimestampRfc3161}" -TimestampDigest "${TimestampDigest}" -Description "${Description}" -DescriptionUrl "${DescriptionUrl}" -FilesCatalog "${FilesCatalog}"`;
 
   console.debug("Signing", configuration.path, "using command", command);
 

apps/desktop/src/api/index.ts

@@ -24,6 +24,7 @@ import { spellCheckerRouter } from "./spell-checker";
 import { updaterRouter } from "./updater";
 import { bridgeRouter } from "./bridge";
 import { safeStorageRouter } from "./safe-storage";
+import { windowRouter } from "./window";
 
 const t = initTRPC.create();
 
@@ -33,7 +34,8 @@ export const router = t.router({
   spellChecker: spellCheckerRouter,
   updater: updaterRouter,
   bridge: bridgeRouter,
-  safeStorage: safeStorageRouter
+  safeStorage: safeStorageRouter,
+  window: windowRouter
 });
 
 export const api = router.createCaller({});

apps/desktop/src/api/os-integration.ts

@@ -32,6 +32,7 @@ import { AssetManager } from "../utils/asset-manager";
 import { isFlatpak } from "../utils";
 import { setupDesktopIntegration } from "../utils/desktop-integration";
 import { rm } from "fs/promises";
+import { disableCustomDns, enableCustomDns } from "../utils/custom-dns";
 
 const t = initTRPC.create();
 
@@ -55,6 +56,15 @@ export const osIntegrationRouter = t.router({
     config.zoomFactor = factor;
   }),
 
+  customDns: t.procedure.query(() => config.customDns),
+  setCustomDns: t.procedure
+    .input(z.boolean())
+    .mutation(({ input: customDns }) => {
+      if (customDns) enableCustomDns();
+      else disableCustomDns();
+      config.customDns = customDns;
+    }),
+
   proxyRules: t.procedure.query(() => config.proxyRules),
   setProxyRules: t.procedure
     .input(z.string().optional())
@@ -170,16 +180,42 @@ export const osIntegrationRouter = t.router({
     }),
   bringToFront: t.procedure.query(() => bringToFront()),
   changeTheme: t.procedure
-    .input(Theme)
-    .mutation(({ input }) => setTheme(input)),
+    .input(
+      z.object({
+        theme: Theme,
+        windowControlsIconColor: z.string().optional(),
+        backgroundColor: z.string().optional()
+      })
+    )
+    .mutation(
+      ({ input: { theme, windowControlsIconColor, backgroundColor } }) => {
+        if (windowControlsIconColor) {
+          config.windowControlsIconColor = windowControlsIconColor;
+          if (process.platform === "win32")
+            globalThis.window?.setTitleBarOverlay({
+              symbolColor: windowControlsIconColor
+            });
+        }
+
+        if (backgroundColor) {
+          config.backgroundColor = backgroundColor;
+        }
+
+        setTheme(theme);
+      }
+    ),
 
   onThemeChanged: t.procedure.subscription(() =>
     observable<"dark" | "light">((emit) => {
-      nativeTheme.on("updated", () => {
+      const updated = () => {
         if (getTheme() === "system") {
           emit.next(nativeTheme.shouldUseDarkColors ? "dark" : "light");
         }
-      });
+      };
+      nativeTheme.on("updated", updated);
+      return () => {
+        nativeTheme.off("updated", updated);
+      };
     })
   )
 });

apps/desktop/src/api/updater.ts

@@ -28,16 +28,20 @@ type UpdateInfo = { version: string };
 type Progress = { percent: number };
 
 const t = initTRPC.create();
+let cancellationToken: CancellationToken | undefined = undefined;
 
 export const updaterRouter = t.router({
   autoUpdates: t.procedure.query(() => config.automaticUpdates),
   install: t.procedure.query(() => autoUpdater.quitAndInstall()),
   download: t.procedure.query(async () => {
-    const cancellationToken = new CancellationToken();
-    await autoUpdater.downloadUpdate(cancellationToken);
+    if (cancellationToken) return;
+    cancellationToken = new CancellationToken();
+    await autoUpdater
+      .downloadUpdate(cancellationToken)
+      .finally(() => (cancellationToken = undefined));
   }),
   check: t.procedure.query(async () => {
-    await autoUpdater.checkForUpdates();
+    await autoUpdater.checkForUpdates().catch(console.error);
   }),
 
   toggleAutoUpdates: t.procedure
@@ -71,6 +75,7 @@ function createSubscription<
       const listener: AppUpdaterEvents[TName] = (...args: any[]) => {
         emit.next(args[0]);
       };
+      autoUpdater.removeAllListeners(eventName);
       autoUpdater.addListener(eventName, listener);
       return () => {
         autoUpdater.removeListener(eventName, listener);

apps/desktop/src/api/window.ts

@@ -0,0 +1,83 @@
+/*
+This file is part of the Notesnook project (https://notesnook.com/)
+
+Copyright (C) 2023 Streetwriters (Private) Limited
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+import { initTRPC } from "@trpc/server";
+import { observable } from "@trpc/server/observable";
+
+const t = initTRPC.create();
+
+export const windowRouter = t.router({
+  maximize: t.procedure.mutation(() => {
+    globalThis.window?.maximize();
+  }),
+  restore: t.procedure.mutation(() => {
+    globalThis.window?.restore();
+  }),
+  minimze: t.procedure.mutation(() => {
+    globalThis.window?.minimize();
+  }),
+  maximized: t.procedure.query(() => globalThis.window?.isMaximized()),
+  fullscreen: t.procedure.query(() => globalThis.window?.isFullScreen()),
+  onWindowStateChanged: t.procedure.subscription(() => {
+    return observable<{ maximized: boolean; fullscreen: boolean }>((emit) => {
+      function listener() {
+        emit.next({
+          maximized: !!globalThis.window?.isMaximized(),
+          fullscreen: !!globalThis.window?.isFullScreen()
+        });
+      }
+      function enterFullscreen() {
+        emit.next({
+          maximized: !!globalThis.window?.isMaximized(),
+          fullscreen: true
+        });
+      }
+      function leaveFullscreen() {
+        emit.next({
+          maximized: !!globalThis.window?.isMaximized(),
+          fullscreen: false
+        });
+      }
+      globalThis.window?.addListener("maximize", listener);
+      globalThis.window?.addListener("minimize", listener);
+      globalThis.window?.addListener("unmaximize", listener);
+      globalThis.window?.addListener("restore", listener);
+      globalThis.window?.addListener("enter-full-screen", enterFullscreen);
+      globalThis.window?.addListener("leave-full-screen", leaveFullscreen);
+      globalThis.window?.addListener("leave-html-full-screen", leaveFullscreen);
+      globalThis.window?.addListener("enter-html-full-screen", enterFullscreen);
+      return () => {
+        globalThis.window?.removeListener("maximize", listener);
+        globalThis.window?.removeListener("minimize", listener);
+        globalThis.window?.removeListener("unmaximize", listener);
+        globalThis.window?.removeListener("restore", listener);
+        globalThis.window?.removeListener("enter-full-screen", enterFullscreen);
+        globalThis.window?.removeListener("leave-full-screen", leaveFullscreen);
+        globalThis.window?.removeListener(
+          "leave-html-full-screen",
+          leaveFullscreen
+        );
+        globalThis.window?.removeListener(
+          "enter-html-full-screen",
+          enterFullscreen
+        );
+      };
+    });
+  })
+});

apps/desktop/src/main.ts

@@ -35,6 +35,7 @@ import path from "path";
 import { bringToFront } from "./utils/bring-to-front";
 import { bridge } from "./api/bridge";
 import { setupDesktopIntegration } from "./utils/desktop-integration";
+import { disableCustomDns, enableCustomDns } from "./utils/custom-dns";
 
 // only run a single instance
 if (!MAC_APP_STORE && !app.requestSingleInstanceLock()) {
@@ -82,6 +83,19 @@ async function createWindow() {
       size: 512,
       format: process.platform === "win32" ? "ico" : "png"
     }),
+
+    titleBarStyle: "hidden",
+    frame: process.platform === "win32" || process.platform === "darwin",
+    titleBarOverlay: {
+      height: 37,
+      color: "#00000000",
+      symbolColor: config.windowControlsIconColor
+    },
+    trafficLightPosition: {
+      x: 16,
+      y: 12
+    },
+
     webPreferences: {
       zoomFactor: config.zoomFactor,
       nodeIntegration: true,
@@ -122,7 +136,7 @@ async function createWindow() {
   setupJumplist();
 
   if (isDevelopment())
-    mainWindow.webContents.openDevTools({ mode: "right", activate: true });
+    mainWindow.webContents.openDevTools({ mode: "bottom", activate: true });
 
   mainWindow.webContents.setWindowOpenHandler((details) => {
     shell.openExternal(details.url);
@@ -138,6 +152,9 @@ async function createWindow() {
 app.once("ready", async () => {
   console.info("App ready. Opening window.");
 
+  if (config.customDns) enableCustomDns();
+  else disableCustomDns();
+
   if (!isDevelopment()) registerProtocol();
   await createWindow();
   configureAutoUpdater();

apps/desktop/src/utils/config.ts

@@ -42,7 +42,12 @@ export const config = {
   zoomFactor: 1,
   theme: nativeTheme.themeSource,
   automaticUpdates: true,
-  proxyRules: ""
+  proxyRules: "",
+  customDns: true,
+
+  backgroundColor: nativeTheme.themeSource === "dark" ? "#0f0f0f" : "#ffffff",
+  windowControlsIconColor:
+    nativeTheme.themeSource === "dark" ? "#ffffff" : "#000000"
 };
 
 type ConfigKey = keyof typeof config;

apps/desktop/src/utils/custom-dns.ts

@@ -0,0 +1,37 @@
+/*
+This file is part of the Notesnook project (https://notesnook.com/)
+
+Copyright (C) 2023 Streetwriters (Private) Limited
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+import { app } from "electron";
+
+export function enableCustomDns() {
+  app.configureHostResolver({
+    secureDnsServers: [
+      "https://mozilla.cloudflare-dns.com/dns-query",
+      "https://dns.quad9.net/dns-query"
+    ],
+    enableBuiltInResolver: true
+  });
+}
+
+export function disableCustomDns() {
+  app.configureHostResolver({
+    secureDnsServers: [],
+    enableBuiltInResolver: true
+  });
+}

apps/desktop/src/utils/protocol.ts

@@ -17,7 +17,7 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import { protocol } from "electron";
+import { net, protocol } from "electron";
 import { isDevelopment } from "./index";
 import { createReadStream } from "fs";
 import { extname, normalize } from "path";
@@ -62,26 +62,7 @@ function registerProtocol() {
         headers: { "Content-Type": extensionToMimeType[fileExtension] }
       });
     } else {
-      if (request.headers.has("X-Content-Length")) {
-        request.headers.set(
-          "Content-Length",
-          request.headers.get("X-Content-Length") || "0"
-        );
-        request.headers.delete("X-Content-Length");
-      }
-      const headers = Object.fromEntries(request.headers.entries());
-
-      return await fetch(request.url, {
-        signal: request.signal,
-        mode: request.mode,
-        headers,
-        method: request.method,
-        body: request.body,
-        credentials: request.credentials,
-        referrer: (request as any).referrer,
-        duplex: "half",
-        redirect: "manual"
-      });
+      return net.fetch(request, { bypassCustomProtocolHandlers: true });
     }
   });
   console.info(`${SCHEME} protocol inteception "successful"`);

apps/desktop/src/utils/theme.ts

@@ -41,7 +41,10 @@ function setTheme(theme: Theme) {
 }
 
 function getBackgroundColor() {
-  return nativeTheme.shouldUseDarkColors ? "#0f0f0f" : "#ffffff";
+  return (
+    config.backgroundColor ||
+    (nativeTheme.shouldUseDarkColors ? "#0f0f0f" : "#ffffff")
+  );
 }
 
 function getSystemTheme() {

apps/mobile/app/common/database/encryption.js

@@ -136,11 +136,10 @@ export async function validateAppLockPassword(appLockPassword) {
     const appLockCipher = CipherStorage.getMap(APPLOCK_CIPHER);
     if (!appLockCipher) return true;
     const decrypted = await decrypt(
-      {
-        password: appLockPassword
-      },
+      await Sodium.deriveKey(appLockPassword, NOTESNOOK_APPLOCK_KEY_SALT),
       appLockCipher
     );
+
     DatabaseLogger.info(
       `validateAppLockPassword: ${typeof decrypted === "string"}`
     );
@@ -319,7 +318,6 @@ export async function decrypt(password, data) {
   _data.output = "plain";
 
   if (!password.salt) password.salt = data.salt;
-
   return await Sodium.decrypt(password, _data);
 }
 

apps/mobile/app/common/filesystem/io.js

@@ -67,7 +67,7 @@ export async function hashBase64(data) {
   };
 }
 
-export async function writeEncryptedBase64({ data, key }) {
+export async function writeEncryptedBase64(data, key) {
   await createCacheDir();
   let filepath = cacheDir + `/${getRandomId("imagecache_")}`;
   await RNFetchBlob.fs.writeFile(filepath, data, "base64");
@@ -77,6 +77,8 @@ export async function writeEncryptedBase64({ data, key }) {
   });
   RNFetchBlob.fs.unlink(filepath).catch(console.log);
   console.log("encrypted file output: ", output);
+  output.size = output.length;
+  delete output.length;
   return {
     ...output,
     alg: "xcha-stream"

apps/mobile/app/components/app-lock-overlay/index.tsx

@@ -18,7 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import React, { useCallback, useEffect, useRef } from "react";
-import { Platform, TextInput, View } from "react-native";
+import { AppStateStatus, Platform, TextInput, View } from "react-native";
 //@ts-ignore
 import { useThemeColors } from "@notesnook/theme";
 import { enabled } from "react-native-privacy-snapshot";
@@ -74,6 +74,7 @@ const verifyUserPassword = async (password: string) => {
 };
 
 const AppLockedOverlay = () => {
+  const initialLaunchBiometricRequest = useRef(true);
   const { colors } = useThemeColors();
   const user = getUser();
   const appLocked = useUserStore((state) => state.appLocked);
@@ -82,6 +83,7 @@ const AppLockedOverlay = () => {
   const passwordInputRef = useRef<TextInput>(null);
   const password = useRef<string>();
   const appState = useAppState();
+  const lastAppState = useRef<AppStateStatus>(appState);
   const biometricUnlockAwaitingUserInput = useRef(false);
   const keyboardType = useSettingStore(
     (state) => state.settings.applockKeyboardType
@@ -131,9 +133,8 @@ const AppLockedOverlay = () => {
     if (!password.current) return;
     try {
       const unlocked = appLockHasPasswordSecurity
-        ? validateAppLockPassword(password.current)
+        ? await validateAppLockPassword(password.current)
         : await verifyUserPassword(password.current);
-
       if (unlocked) {
         if (!appLockHasPasswordSecurity) {
           await setAppLockVerificationCipher(password.current);
@@ -154,18 +155,46 @@ const AppLockedOverlay = () => {
   };
 
   useEffect(() => {
+    if (appState === "active") {
+      enabled(false);
+    }
+
+    const prevState = lastAppState.current;
+    lastAppState.current = appState;
+
     if (
-      biometricUnlockAwaitingUserInput.current ||
-      useUserStore.getState().disableAppLockRequests
-    )
-      return;
-    if (
-      appLocked &&
       appState === "active" &&
-      !useSettingStore.getState().requestBiometrics
+      (prevState === "background" || initialLaunchBiometricRequest.current)
     ) {
-      biometricUnlockAwaitingUserInput.current = true;
-      onUnlockAppRequested();
+      if (SettingsService.shouldLockAppOnEnterForeground()) {
+        DatabaseLogger.info("Locking app on entering foreground");
+        useUserStore.getState().lockApp(true);
+      }
+
+      if (
+        !(
+          biometricUnlockAwaitingUserInput.current ||
+          useUserStore.getState().disableAppLockRequests ||
+          !appLocked ||
+          useSettingStore.getState().requestBiometrics ||
+          useSettingStore.getState().appDidEnterBackgroundForAction
+        )
+      ) {
+        initialLaunchBiometricRequest.current = false;
+        DatabaseLogger.info("Biometric unlock request");
+        onUnlockAppRequested();
+      }
+
+      enabled(false);
+    } else {
+      SettingsService.appEnteredBackground();
+
+      if (
+        SettingsService.get().privacyScreen ||
+        SettingsService.getProperty("appLockEnabled")
+      ) {
+        enabled(true);
+      }
     }
   }, [appState, onUnlockAppRequested, appLocked]);
 

apps/mobile/app/components/attachments/actions.tsx

@@ -221,7 +221,7 @@ const Actions = ({
       <View
         style={{
           borderBottomWidth: 1,
-          borderBottomColor: colors.secondary.background,
+          borderBottomColor: colors.primary.border,
           marginBottom: notes && notes.length > 0 ? 0 : 12
         }}
       >
@@ -295,7 +295,7 @@ const Actions = ({
         <View
           style={{
             borderBottomWidth: 1,
-            borderBottomColor: colors.secondary.background,
+            borderBottomColor: colors.primary.border,
             marginBottom: 12,
             paddingVertical: 12
           }}

apps/mobile/app/components/auth/login.js

@@ -38,6 +38,7 @@ import { useSettingStore } from "../../stores/use-setting-store";
 import { eUserLoggedIn } from "../../utils/events";
 import { useUserStore } from "../../stores/use-user-store";
 import Sync from "../../services/sync";
+import { Notice } from "../ui/notice";
 
 const LoginSteps = {
   emailAuth: 1,

apps/mobile/app/components/auth/session-expired.js

@@ -87,6 +87,9 @@ export const SessionExpired = () => {
       MMKV.clearStore();
       clearAllStores();
       setVisible(false);
+      useUserStore.setState({
+        disableAppLockRequests: false
+      });
     } catch (e) {
       ToastManager.show({
         heading: e.message,
@@ -151,6 +154,9 @@ export const SessionExpired = () => {
           await sleep(300);
           passwordInputRef.current?.focus();
           setFocused(true);
+          useUserStore.setState({
+            disableAppLockRequests: true
+          });
         }}
         enableSheetKeyboardHandler={true}
         visible={true}

apps/mobile/app/components/container/floating-button.tsx

@@ -18,6 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import { useThemeColors } from "@notesnook/theme";
+import { useRoute } from "@react-navigation/native";
 import React, { useCallback, useEffect } from "react";
 import { Keyboard, View } from "react-native";
 import Animated, {
@@ -54,6 +55,7 @@ const FloatingButton = ({
   const deviceMode = useSettingStore((state) => state.deviceMode);
   const selectionMode = useSelectionStore((state) => state.selectionMode);
   const translate = useSharedValue(0);
+  const route = useRoute();
 
   const animatedStyle = useAnimatedStyle(() => {
     return {
@@ -140,7 +142,13 @@ const FloatingButton = ({
           }}
         >
           <Icon
-            name={title === "Clear all trash" ? "delete" : "plus"}
+            name={
+              route.name === "Notebooks"
+                ? "notebook-plus"
+                : route.name === "Trash"
+                ? "delete"
+                : "plus"
+            }
             color={colors.primary.accentForeground}
             size={SIZE.xxl}
           />

apps/mobile/app/components/container/index.tsx

@@ -21,14 +21,16 @@ import React, { PropsWithChildren, useEffect, useRef, useState } from "react";
 import { Dimensions, Platform, View, useWindowDimensions } from "react-native";
 import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
 import useKeyboard from "../../hooks/use-keyboard";
+import { useThemeColors } from "@notesnook/theme";
 
 export const Container = ({ children }: PropsWithChildren) => {
+  const { colors } = useThemeColors();
   const insets = useGlobalSafeAreaInsets();
   const keyboard = useKeyboard();
   const [height, setHeight] = useState(0);
   const windowHeightRef = useRef(Dimensions.get("window").height);
   const { height: windowHeight } = useWindowDimensions();
-
+  const timerRef = useRef<NodeJS.Timeout>();
   useEffect(() => {
     if (windowHeight !== windowHeightRef.current) {
       setHeight(0);
@@ -43,12 +45,17 @@ export const Container = ({ children }: PropsWithChildren) => {
         paddingTop: Platform.OS === "android" ? 0 : insets.top,
         paddingBottom: Platform.OS === "android" ? 0 : insets.bottom,
         height: height || "100%",
-        width: "100%"
+        width: "100%",
+        backgroundColor: colors.primary.background
       }}
       onLayout={(event) => {
-        if (!keyboard.keyboardShown) {
-          setHeight(event.nativeEvent.layout.height);
-        }
+        const height = event.nativeEvent.layout.height;
+        clearTimeout(timerRef.current);
+        timerRef.current = setTimeout(() => {
+          if (!keyboard.keyboardShown) {
+            setHeight(height);
+          }
+        }, 500);
       }}
     >
       {children}

apps/mobile/app/components/dialog/dialog-buttons.js

@@ -45,8 +45,8 @@ const DialogButtons = ({
         {
           backgroundColor: colors.secondary.background,
           height: 60,
-          borderBottomRightRadius: 10,
-          borderBottomLeftRadius: 10,
+          borderBottomRightRadius: 5,
+          borderBottomLeftRadius: 5,
           paddingHorizontal: 12,
           borderTopWidth: 0.7,
           borderTopColor: getColorLinearShade(

apps/mobile/app/components/dialog/index.js

@@ -36,6 +36,7 @@ import DialogButtons from "./dialog-buttons";
 import DialogHeader from "./dialog-header";
 import { useCallback } from "react";
 import { Button } from "../ui/button";
+import { getContainerBorder } from "../../utils/colors";
 
 export const Dialog = ({ context = "global" }) => {
   const { colors } = useThemeColors();
@@ -121,7 +122,8 @@ export const Dialog = ({ context = "global" }) => {
     maxHeight: 450,
     borderRadius: 5,
     backgroundColor: colors.primary.background,
-    paddingTop: 12
+    paddingTop: 12,
+    ...getContainerBorder(colors.primary.border, 0.5)
   };
 
   return visible ? (

apps/mobile/app/components/dialogs/applock-password/index.tsx

@@ -24,7 +24,7 @@ import {
   setAppLockVerificationCipher,
   validateAppLockPassword
 } from "../../../common/database/encryption";
-import BiometicService from "../../../services/biometrics";
+import BiometricService from "../../../services/biometrics";
 import { DDS } from "../../../services/device-detection";
 import {
   ToastManager,
@@ -314,6 +314,7 @@ export const AppLockPassword = () => {
                   new Error(
                     `${keyboardType === "pin" ? "Pin" : "Password"} incorrect`
                   ),
+                  undefined,
                   "local"
                 );
                 return;
@@ -322,10 +323,11 @@ export const AppLockPassword = () => {
               SettingsService.setProperty("appLockHasPasswordSecurity", false);
 
               if (
-                !(await BiometicService.isBiometryAvailable()) ||
+                !(await BiometricService.isBiometryAvailable()) ||
                 SettingsService.getProperty("biometricsAuthEnabled") === false
               ) {
                 SettingsService.setProperty("appLockEnabled", false);
+                SettingsService.setPrivacyScreen(SettingsService.get());
                 ToastManager.show({
                   message: "App lock disabled",
                   type: "success"

apps/mobile/app/components/dialogs/color-picker/index.tsx

@@ -75,7 +75,7 @@ const ColorPicker = ({
             style={{
               width: "100%",
               height: 250,
-              backgroundColor: selectedColor,
+              backgroundColor: colors.primary.background,
               borderRadius: 10
             }}
           >
@@ -146,12 +146,16 @@ const ColorPicker = ({
               onChangeText={(value) => {
                 title.current = value;
               }}
+              testID="color-title-input"
               defaultValue={title.current}
               placeholder={title.current || "Color title"}
             />
 
             <Button
               title="Add color"
+              style={{
+                marginBottom: 10
+              }}
               onPress={async () => {
                 if (!selectedColor)
                   return ToastManager.error(
@@ -170,7 +174,6 @@ const ColorPicker = ({
                   return ToastManager.error(
                     new Error(`Color #${selectedColor} already exists`)
                   );
-
                 const id = await db.colors.add({
                   title: title.current,
                   colorCode: selectedColor

apps/mobile/app/components/dialogs/vault/index.js

@@ -128,7 +128,7 @@ export class VaultDialog extends Component {
           : this.state.copyNote
           ? "Unlock note to copy it. If biometrics are not working, you can enter device pin to unlock vault."
           : this.state.goToEditor
-          ? "Unlock note to open it in editor. If biometrics are not working, you can enter device pin to unlock vault."
+          ? "Unlock note to open it in editor."
           : "Enter vault password to unlock note. If biometrics are not working, you can enter device pin to unlock vault."
         : "Enter vault password to lock note. If biometrics are not working, you can enter device pin to lock note.");
   }

apps/mobile/app/components/header/index.tsx

@@ -33,6 +33,7 @@ import { eScrollEvent } from "../../utils/events";
 import { LeftMenus } from "./left-menus";
 import { RightMenus } from "./right-menus";
 import { Title } from "./title";
+import { useNavigation } from "@react-navigation/native";
 
 type HeaderRightButton = {
   title: string;
@@ -66,6 +67,8 @@ export const Header = ({
   hasSearch?: boolean;
   onSearch?: () => void;
 }) => {
+  const navigation = useNavigation();
+
   const { colors } = useThemeColors();
   const insets = useGlobalSafeAreaInsets();
   const [borderHidden, setBorderHidden] = useState(true);

apps/mobile/app/components/header/right-menus.tsx

@@ -71,7 +71,7 @@ export const RightMenus = ({
           testID={notesnook.ids.default.addBtn}
           icon={renderedInRoute === "Trash" ? "delete" : "plus"}
           iconSize={SIZE.xl}
-          type="shade"
+          type="accent"
           hitSlop={{
             top: 10,
             right: 10,
@@ -82,7 +82,7 @@ export const RightMenus = ({
             marginLeft: 10,
             width: 32,
             height: 32,
-            borderRadius: 5,
+            borderRadius: 100,
             paddingHorizontal: 0,
             borderWidth: 1,
             borderColor: colors.primary.accent

apps/mobile/app/components/list-items/footer/index.js

@@ -19,6 +19,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import { View } from "react-native";
 import React from "react";
-export const Footer = () => {
-  return <View style={{ height: 150 }} />;
+export const Footer = ({ height = 150 }) => {
+  return <View style={{ height: height }} />;
 };

apps/mobile/app/components/list-items/headers/notebook-header.tsx

@@ -95,7 +95,7 @@ export const NotebookHeader = ({
           style={{
             flexShrink: 1
           }}
-          size={SIZE.xxl}
+          size={SIZE.lg}
         >
           {notebook.title}
         </Heading>
@@ -114,7 +114,7 @@ export const NotebookHeader = ({
               width: 40,
               height: 40
             }}
-            type={isPinnedToMenu ? "secondary" : "secondary"}
+            type="transparent"
             color={isPinnedToMenu ? colors.primary.accent : colors.primary.icon}
             size={SIZE.lg}
           />
@@ -123,7 +123,7 @@ export const NotebookHeader = ({
             onPress={onEditNotebook}
             tooltipText="Edit this notebook"
             name="pencil"
-            type="secondary"
+            type="transparent"
             color={colors.primary.icon}
             style={{
               width: 40,
@@ -134,7 +134,7 @@ export const NotebookHeader = ({
       </View>
 
       {notebook.description ? (
-        <Paragraph size={SIZE.md} color={colors.primary.paragraph}>
+        <Paragraph size={SIZE.sm} color={colors.primary.paragraph}>
           {notebook.description}
         </Paragraph>
       ) : null}
@@ -148,10 +148,6 @@ export const NotebookHeader = ({
         size={SIZE.xs}
         color={colors.secondary.paragraph}
       >
-        {/* {notebook.topics.length === 1
-          ? "1 topic"
-          : `${notebook.topics.length} topics`}
-        ,{" "} */}
         {notebook && totalNotes > 1
           ? totalNotes + " notes"
           : totalNotes === 1

apps/mobile/app/components/list-items/headers/section-header.tsx

@@ -25,7 +25,7 @@ import { useIsCompactModeEnabled } from "../../../hooks/use-is-compact-mode-enab
 import { presentSheet } from "../../../services/event-manager";
 import SettingsService from "../../../services/settings";
 import { RouteName } from "../../../stores/use-navigation-store";
-import { ColorValues, getContainerBorder } from "../../../utils/colors";
+import { getContainerBorder } from "../../../utils/colors";
 import { GROUP } from "../../../utils/constants";
 import { SIZE } from "../../../utils/size";
 import Sort from "../../sheets/sort";
@@ -96,13 +96,9 @@ export const SectionHeader = React.memo<
           }}
         >
           <Heading
-            color={
-              ColorValues[color?.toLowerCase() as keyof typeof ColorValues] ||
-              colors.primary.accent
-            }
+            color={color || colors.primary.accent}
             size={SIZE.sm}
             style={{
-              minWidth: 60,
               alignSelf: "center",
               textAlignVertical: "center"
             }}

apps/mobile/app/components/list-items/note/index.tsx

@@ -211,6 +211,31 @@ const NoteItem = ({
                     color={colors.error.accent}
                   />
                 ) : null}
+
+                {item.localOnly ? (
+                  <Icon
+                    testID="sync-off"
+                    name="sync-off"
+                    size={SIZE.sm}
+                    style={{
+                      marginRight: 6
+                    }}
+                    color={primaryColors.icon}
+                  />
+                ) : null}
+
+                {item.readonly ? (
+                  <Icon
+                    testID="pencil-lock"
+                    name="pencil-lock"
+                    size={SIZE.sm}
+                    style={{
+                      marginRight: 6
+                    }}
+                    color={primaryColors.icon}
+                  />
+                ) : null}
+
                 <TimeSince
                   style={{
                     fontSize: SIZE.xs,
@@ -226,12 +251,13 @@ const NoteItem = ({
                     style={{
                       flexDirection: "row",
                       alignItems: "center",
-                      marginRight: 6
+                      marginRight: 6,
+                      gap: 2
                     }}
                   >
                     <Icon
                       name="attachment"
-                      size={SIZE.md}
+                      size={SIZE.sm}
                       color={primaryColors.icon}
                     />
                     <Paragraph
@@ -271,7 +297,7 @@ const NoteItem = ({
                   <Icon
                     testID="icon-star"
                     name="star-outline"
-                    size={SIZE.md}
+                    size={SIZE.sm}
                     style={{
                       marginRight: 6
                     }}
@@ -288,7 +314,8 @@ const NoteItem = ({
                           height={23}
                           type="plain"
                           textStyle={{
-                            textDecorationLine: "underline"
+                            textDecorationLine: "underline",
+                            color: colors.secondary.paragraph
                           }}
                           hitSlop={{ top: 8, bottom: 12, left: 0, right: 0 }}
                           fontSize={SIZE.xs}
@@ -370,7 +397,7 @@ const NoteItem = ({
               <Icon
                 testID="icon-star"
                 name="star-outline"
-                size={SIZE.md}
+                size={SIZE.sm}
                 style={{
                   marginRight: 6
                 }}

apps/mobile/app/components/list-items/note/wrapper.tsx

@@ -28,13 +28,12 @@ import {
   hideSheet,
   presentSheet
 } from "../../../services/event-manager";
-import { useSelectionStore } from "../../../stores/use-selection-store";
 import { eOnLoadNote, eShowMergeDialog } from "../../../utils/events";
 import { tabBarRef } from "../../../utils/global-refs";
 
 import { NotebooksWithDateEdited, TagsWithDateEdited } from "@notesnook/common";
 import NotePreview from "../../note-history/preview";
-import SelectionWrapper from "../selection-wrapper";
+import SelectionWrapper, { selectItem } from "../selection-wrapper";
 
 export const openNote = async (
   item: Note,
@@ -47,21 +46,8 @@ export const openNote = async (
   if (!isTrash) {
     note = (await db.notes.note(item.id)) as Note;
   }
-  if (useSelectionStore.getState().selectionMode === item.type) {
-    const {
-      selectedItemsList,
-      selectionMode,
-      clearSelection,
-      setSelectedItem
-    } = useSelectionStore.getState();
 
-    if (selectedItemsList.length > 0 && selectionMode === item.type) {
-      setSelectedItem(note.id);
-    } else {
-      clearSelection();
-    }
-    return;
-  }
+  if (selectItem(item)) return;
 
   if (note.conflicted) {
     eSendEvent(eShowMergeDialog, note);

apps/mobile/app/components/list-items/notebook/wrapper.tsx

@@ -27,18 +27,12 @@ import Navigation from "../../../services/navigation";
 import { useSelectionStore } from "../../../stores/use-selection-store";
 import { useTrashStore } from "../../../stores/use-trash-store";
 import { presentDialog } from "../../dialog/functions";
-import SelectionWrapper from "../selection-wrapper";
+import SelectionWrapper, { selectItem } from "../selection-wrapper";
 
 export const openNotebook = (item: Notebook | BaseTrashItem<Notebook>) => {
   const isTrash = item.type === "trash";
-  const { selectedItemsList, setSelectedItem, selectionMode, clearSelection } =
-    useSelectionStore.getState();
-  if (selectedItemsList.length > 0 && selectionMode === item.type) {
-    setSelectedItem(item.id);
-    return;
-  } else {
-    clearSelection();
-  }
+
+  if (selectItem(item)) return;
 
   if (isTrash) {
     presentDialog({

apps/mobile/app/components/list-items/reminder/index.tsx

@@ -22,7 +22,6 @@ import React from "react";
 import { View } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import { notesnook } from "../../../../e2e/test.ids";
-import { useSelectionStore } from "../../../stores/use-selection-store";
 import { SIZE } from "../../../utils/size";
 import { Properties } from "../../properties";
 import ReminderSheet from "../../sheets/reminder";
@@ -30,7 +29,7 @@ import { IconButton } from "../../ui/icon-button";
 import { ReminderTime } from "../../ui/reminder-time";
 import Heading from "../../ui/typography/heading";
 import Paragraph from "../../ui/typography/paragraph";
-import SelectionWrapper from "../selection-wrapper";
+import SelectionWrapper, { selectItem } from "../selection-wrapper";
 
 const ReminderItem = React.memo(
   ({
@@ -44,18 +43,7 @@ const ReminderItem = React.memo(
   }) => {
     const { colors } = useThemeColors();
     const openReminder = () => {
-      const {
-        selectedItemsList,
-        setSelectedItem,
-        selectionMode,
-        clearSelection
-      } = useSelectionStore.getState();
-      if (selectedItemsList.length > 0 && selectionMode === item.type) {
-        setSelectedItem(item.id);
-        return;
-      } else {
-        clearSelection();
-      }
+      if (selectItem(item)) return;
 
       ReminderSheet.present(item, undefined, isSheet);
     };

apps/mobile/app/components/list-items/selection-wrapper/index.tsx

@@ -26,6 +26,23 @@ import { Filler } from "./back-fill";
 import { SelectionIcon } from "./selection";
 import { Item, TrashItem } from "@notesnook/core";
 
+export function selectItem(item: Item) {
+  if (useSelectionStore.getState().selectionMode === item.type) {
+    const { selectionMode, clearSelection, setSelectedItem } =
+      useSelectionStore.getState();
+
+    if (selectionMode === item.type) {
+      setSelectedItem(item.id);
+    }
+
+    if (useSelectionStore.getState().selectedItemsList.length === 0) {
+      clearSelection();
+    }
+    return true;
+  }
+  return false;
+}
+
 type SelectionWrapperProps = PropsWithChildren<{
   item: Item;
   onPress: () => void;

apps/mobile/app/components/list-items/tag/index.tsx

@@ -23,13 +23,12 @@ import React from "react";
 import { View } from "react-native";
 import { notesnook } from "../../../../e2e/test.ids";
 import { TaggedNotes } from "../../../screens/notes/tagged";
-import { useSelectionStore } from "../../../stores/use-selection-store";
 import { SIZE } from "../../../utils/size";
 import { Properties } from "../../properties";
 import { IconButton } from "../../ui/icon-button";
 import Heading from "../../ui/typography/heading";
 import Paragraph from "../../ui/typography/paragraph";
-import SelectionWrapper from "../selection-wrapper";
+import SelectionWrapper, { selectItem } from "../selection-wrapper";
 
 const TagItem = React.memo(
   ({
@@ -43,18 +42,7 @@ const TagItem = React.memo(
   }) => {
     const { colors } = useThemeColors();
     const onPress = () => {
-      const {
-        selectedItemsList,
-        setSelectedItem,
-        selectionMode,
-        clearSelection
-      } = useSelectionStore.getState();
-      if (selectedItemsList.length > 0 && selectionMode === item.type) {
-        setSelectedItem(item.id);
-        return;
-      } else {
-        clearSelection();
-      }
+      if (selectItem(item)) return;
 
       TaggedNotes.navigate(item, true);
     };

apps/mobile/app/components/list/index.tsx

@@ -192,7 +192,9 @@ export default function List(props: ListProps) {
               />
             ) : null
           }
-          ListFooterComponent={<Footer />}
+          ListFooterComponent={
+            <Footer height={props.renderedInRoute === "Notebook" ? 300 : 150} />
+          }
           ListHeaderComponent={
             <>
               {props.CustomLisHeader ? (

apps/mobile/app/components/list/list-item.wrapper.tsx

@@ -48,6 +48,7 @@ import { NoteWrapper } from "../list-items/note/wrapper";
 import { NotebookWrapper } from "../list-items/notebook/wrapper";
 import ReminderItem from "../list-items/reminder";
 import TagItem from "../list-items/tag";
+import { useIsCompactModeEnabled } from "../../hooks/use-is-compact-mode-enabled";
 
 type ListItemWrapperProps<TItem = Item> = {
   group?: GroupingKey;
@@ -75,6 +76,7 @@ export function ListItemWrapper(props: ListItemWrapperProps) {
   const refreshTimeout = useRef<NodeJS.Timeout>();
   const currentItemId = useRef<string>();
   const locked = useRef(false);
+  const compactMode = useIsCompactModeEnabled(props.dataType as ItemType);
 
   const refreshItem = useCallback((resolvedItem: any) => {
     if (!resolvedItem || !resolvedItem.data) {
@@ -117,14 +119,24 @@ export function ListItemWrapper(props: ListItemWrapperProps) {
       }
       currentItemId.current = resolvedItem.item.id;
       setItem(resolvedItem.item);
+    }
+
+    if (resolvedItem?.group) {
       setGroupHeader(resolvedItem.group);
+    } else {
+      setGroupHeader(undefined);
     }
   }, []);
 
   if (previousIndex.current !== index) {
     previousIndex.current = index;
     const resolvedItem = items?.cacheItem(index);
-    refreshItem(resolvedItem);
+    if (resolvedItem) {
+      refreshItem(resolvedItem);
+    } else {
+      setItem(undefined);
+      setGroupHeader(undefined);
+    }
   }
 
   useEffect(() => {
@@ -132,12 +144,15 @@ export function ListItemWrapper(props: ListItemWrapperProps) {
       try {
         clearTimeout(refreshTimeout.current);
         const idx = index;
-        refreshTimeout.current = setTimeout(async () => {
-          if (idx !== previousIndex.current) return;
-          const resolvedItem = await items?.item(idx, resolveItems);
-          if (idx !== previousIndex.current) return;
-          refreshItem(resolvedItem);
-        }, 100);
+        refreshTimeout.current = setTimeout(
+          async () => {
+            if (idx !== previousIndex.current) return;
+            const resolvedItem = await items?.item(idx, resolveItems);
+            if (idx !== previousIndex.current) return;
+            refreshItem(resolvedItem);
+          },
+          items?.cacheItem(index) ? 100 : 0
+        );
       } catch (e) {
         console.log("Error", e);
       }
@@ -148,7 +163,7 @@ export function ListItemWrapper(props: ListItemWrapperProps) {
     return (
       <View
         style={{
-          height: 120,
+          height: compactMode ? 50 : 120,
           width: "100%"
         }}
       />

apps/mobile/app/components/list/reorderable-list.tsx

@@ -23,9 +23,9 @@ import { FlatList, StyleSheet, View } from "react-native";
 import {
   DraxList,
   DraxListProps,
-  DraxListRenderItemContent,
-  DraxProvider
+  DraxListRenderItemContent
 } from "react-native-drax";
+
 import { tabBarRef } from "../../utils/global-refs";
 import { SIZE } from "../../utils/size";
 import { useSideBarDraggingStore } from "../side-menu/dragging-store";
@@ -74,6 +74,7 @@ function ReorderableList<T extends { id: string }>({
   const renderItemContent: DraxListRenderItemContent<T> = React.useCallback(
     (info, props) => {
       const isHidden = hiddenItemsState.indexOf(info?.item?.id) > -1;
+
       return isHidden && !dragging ? null : (
         <View
           style={{
@@ -136,53 +137,49 @@ function ReorderableList<T extends { id: string }>({
   }
 
   return (
-    <DraxProvider>
-      <View style={styles.container}>
-        <DraxList
-          {...restProps}
-          ref={listRef}
-          data={getOrderedItems()}
-          renderItemContent={renderItemContent}
-          itemStyles={{
-            hoverDragReleasedStyle: {
-              display: "none"
-            },
-            hoverDraggingWithoutReceiverStyle: {
-              opacity: 0.5
-            },
-            dragReleasedStyle: {
-              opacity: 1
-            },
-            hoverDraggingStyle: {
-              backgroundColor: colors.secondary.background
-            }
-          }}
-          longPressDelay={500}
-          onItemDragStart={() =>
-            useSideBarDraggingStore.setState({
-              dragging: true
-            })
+    <View style={styles.container}>
+      <DraxList
+        {...restProps}
+        ref={listRef}
+        data={getOrderedItems()}
+        renderItemContent={renderItemContent}
+        itemStyles={{
+          hoverDragReleasedStyle: {
+            display: "none"
+          },
+          hoverDraggingWithoutReceiverStyle: {
+            opacity: 0.5
+          },
+          dragReleasedStyle: {
+            opacity: 1
+          },
+          hoverDraggingStyle: {
+            backgroundColor: colors.secondary.background
           }
-          itemsDraggable={disableDefaultDrag ? dragging : true}
-          lockItemDragsToMainAxis
-          onItemReorder={({ fromIndex, fromItem, toIndex, toItem }) => {
-            const newOrder = getOrderedItems().map((item) => item.id);
-            const element = newOrder.splice(fromIndex, 1)[0];
-            if (toIndex === 0) {
-              newOrder.unshift(element);
-            } else {
-              newOrder.splice(toIndex, 0, element);
-            }
-            setItemsOrder(newOrder);
-            onListOrderChanged?.(newOrder);
-          }}
-          onItemDragEnd={(e) => {
-            console.log(e.receiver?.receiveOffset);
-          }}
-          keyExtractor={(item) => (item as any).id}
-        />
-      </View>
-    </DraxProvider>
+        }}
+        longPressDelay={500}
+        onItemDragStart={() =>
+          useSideBarDraggingStore.setState({
+            dragging: true
+          })
+        }
+        disableVirtualization
+        itemsDraggable={disableDefaultDrag ? dragging : true}
+        lockItemDragsToMainAxis
+        onItemReorder={({ fromIndex, fromItem, toIndex, toItem }) => {
+          const newOrder = getOrderedItems().map((item) => item.id);
+          const element = newOrder.splice(fromIndex, 1)[0];
+          if (toIndex === 0) {
+            newOrder.unshift(element);
+          } else {
+            newOrder.splice(toIndex, 0, element);
+          }
+          setItemsOrder(newOrder);
+          onListOrderChanged?.(newOrder);
+        }}
+        keyExtractor={(item) => (item as any).id}
+      />
+    </View>
   );
 }
 

apps/mobile/app/components/merge-conflicts/index.js

@@ -313,7 +313,7 @@ const MergeConflicts = () => {
               height: height / 2 - (50 + insets.top / 2),
               backgroundColor: colors.primary.background,
               borderBottomWidth: 1,
-              borderBottomColor: colors.secondary.background
+              borderBottomColor: colors.primary.border
             }}
           >
             <ReadonlyEditor

apps/mobile/app/components/note-history/index.tsx

@@ -199,7 +199,9 @@ export default function NoteHistory({
         Note version history is local only.{" "}
         <Text
           onPress={() => {
-            openLinkInBrowser("https://docs.notesnook.com/versionhistory");
+            openLinkInBrowser(
+              "https://help.notesnook.com/note-version-history"
+            );
           }}
           style={{
             color: colors.primary.accent,

apps/mobile/app/components/premium/features.js

@@ -162,7 +162,7 @@ export const features = [
         platform: "android"
       }
     ],
-    info: "* Free users are limited to keeping 3 notebooks (no limit on topics) and 5 tags."
+    info: "* Free users are limited to keeping 3 notebooks and 5 tags."
   },
 
   {

apps/mobile/app/components/properties/color-tags.tsx

@@ -111,6 +111,7 @@ export const ColorTags = ({ item }: { item: Note }) => {
         visible={visible}
         setVisible={setVisible}
         onColorAdded={async (color) => {
+          await db.relations.to(note, "color").unlink();
           await db.relations.add(color, note);
           useRelationStore.getState().update();
           useMenuStore.getState().setColorNotes();

apps/mobile/app/components/properties/index.js

@@ -242,7 +242,6 @@ Properties.present = async (item, buttons = [], isSheet) => {
         "attachments",
         "lock-unlock",
         "trash",
-        "remove-from-topic",
         "remove-from-notebook",
         "history",
         "read-only",
@@ -264,7 +263,8 @@ Properties.present = async (item, buttons = [], isSheet) => {
         "trash",
         "default-notebook",
         "add-notebook",
-        "move-notes"
+        "move-notes",
+        "move-notebook"
       ]);
       break;
     case "tag":

apps/mobile/app/components/properties/items.js

@@ -73,7 +73,7 @@ export const Items = ({ item, buttons, close }) => {
         <Icon
           allowFontScaling
           name={item.icon}
-          size={DDS.isTab ? SIZE.xxl : SIZE.lg}
+          size={DDS.isTab ? SIZE.xxl : shouldShrink ? SIZE.xxl : SIZE.lg}
           color={
             item.on
               ? colors.primary.accent
@@ -241,8 +241,8 @@ export const Items = ({ item, buttons, close }) => {
         }}
         showsHorizontalScrollIndicator={false}
         contentContainerStyle={{
-          gap: 10,
-          paddingRight: 25
+          paddingRight: 25,
+          gap: 5
         }}
       >
         {topBarItems.map(renderTopBarItem)}

apps/mobile/app/components/properties/synced.js

@@ -48,7 +48,7 @@ export const Synced = ({ item, close }) => {
         paddingTop: 10,
         marginTop: 10,
         borderTopWidth: 1,
-        borderTopColor: colors.secondary.background
+        borderTopColor: colors.primary.border
       }}
     >
       <Icon
@@ -92,7 +92,7 @@ export const Synced = ({ item, close }) => {
             close();
             await sleep(300);
             await openLinkInBrowser(
-              "https://docs.notesnook.com/how-is-my-data-encrypted/",
+              "https://help.notesnook.com/how-is-my-data-encrypted",
               colors
             );
           } catch (e) {

apps/mobile/app/components/properties/tags.js

@@ -17,7 +17,7 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { View } from "react-native";
 import { db } from "../../common/database";
 import { TaggedNotes } from "../../screens/notes/tagged";
@@ -68,26 +68,38 @@ export const Tags = ({ item, close }) => {
 };
 
 export const TagStrip = ({ item, close }) => {
-  return item.tags?.length > 0 ? (
+  const [tags, setTags] = useState([]);
+
+  useEffect(() => {
+    db.relations
+      .to(item, "tag")
+      .resolve()
+      .then((tags) => {
+        setTags(tags);
+      });
+  });
+
+  return tags?.length > 0 ? (
     <View
       style={{
         flexDirection: "row",
         flexWrap: "wrap",
-        alignItems: "center"
+        alignItems: "center",
+        marginTop: 10,
+        gap: 5
       }}
     >
-      {item.tags.map((tag) =>
-        tag ? <TagItem key={tag} tag={tag} close={close} /> : null
+      {tags?.map((tag) =>
+        tag ? <TagItem key={tag.id} tag={tag} close={close} /> : null
       )}
     </View>
   ) : null;
 };
 
 const TagItem = ({ tag, close }) => {
+  const { colors } = useThemeColors();
   const onPress = async () => {
-    let tags = db.tags.all;
-    let _tag = tags.find((t) => t.title === tag);
-    TaggedNotes.navigate(_tag, true);
+    TaggedNotes.navigate(tag, true);
     await sleep(300);
     close();
   };
@@ -95,20 +107,19 @@ const TagItem = ({ tag, close }) => {
   const style = {
     paddingHorizontal: 0,
     borderRadius: 100,
-    marginRight: 10,
     marginTop: 0,
     backgroundColor: "transparent"
   };
   return (
     <Button
       onPress={onPress}
-      title={"#" + tag}
-      type="secondary"
+      title={"#" + tag.title}
+      type="plain"
       height={20}
       fontSize={SIZE.xs}
       style={style}
       textStyle={{
-        textDecorationLine: "underline"
+        color: colors.secondary.paragraph
       }}
     />
   );

apps/mobile/app/components/selection-header/index.tsx

@@ -19,14 +19,14 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import { Item, ItemType, VirtualizedGrouping } from "@notesnook/core";
 import { useThemeColors } from "@notesnook/theme";
-import React, { useEffect } from "react";
+import React, { useEffect, useRef } from "react";
 import {
   BackHandler,
   NativeEventSubscription,
   Platform,
   View
 } from "react-native";
-import Animated, { FadeInUp } from "react-native-reanimated";
+import Menu from "react-native-reanimated-material-menu/src/Menu";
 import { db } from "../../common/database";
 import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
 import { ToastManager } from "../../services/event-manager";
@@ -42,6 +42,8 @@ import { presentDialog } from "../dialog/functions";
 import MoveNoteSheet from "../sheets/add-to";
 import ExportNotesSheet from "../sheets/export-notes";
 import ManageTagsSheet from "../sheets/manage-tags";
+import { MoveNotebookSheet } from "../sheets/move-notebook";
+import { Button } from "../ui/button";
 import { IconButton } from "../ui/icon-button";
 import Heading from "../ui/typography/heading";
 
@@ -57,6 +59,8 @@ export const SelectionHeader = React.memo(
     type?: ItemType;
     renderedInRoute?: string;
   }) => {
+    const menuRef = useRef<Menu>(null);
+    const { colors: contextMenuColors } = useThemeColors("contextMenu");
     const { colors } = useThemeColors();
     const selectionMode = useSelectionStore((state) => state.selectionMode);
     const selectedItemsList = useSelectionStore(
@@ -131,8 +135,7 @@ export const SelectionHeader = React.memo(
     }, [clearSelection, selectionMode]);
 
     return selectionMode !== type || focusedRouteId !== id ? null : (
-      <Animated.View
-        entering={FadeInUp}
+      <View
         style={{
           width: "100%",
           height: Platform.OS === "android" ? 50 + insets.top : 50,
@@ -142,8 +145,7 @@ export const SelectionHeader = React.memo(
           alignItems: "center",
           flexDirection: "row",
           zIndex: 999,
-          paddingHorizontal: 12,
-          marginVertical: 10
+          paddingHorizontal: 12
         }}
       >
         <View
@@ -163,18 +165,15 @@ export const SelectionHeader = React.memo(
               borderRadius: 100,
               marginRight: 10
             }}
-            type="secondary"
             onPress={() => {
               clearSelection();
             }}
-            size={SIZE.xl}
             color={colors.primary.icon}
             name="close"
           />
 
           <View
             style={{
-              backgroundColor: colors.secondary.background,
               height: 40,
               borderRadius: 100,
               paddingHorizontal: 16,
@@ -183,11 +182,12 @@ export const SelectionHeader = React.memo(
               alignItems: "center"
             }}
           >
-            <Heading size={SIZE.md} color={colors.primary.accent}>
+            <Heading size={SIZE.lg} color={colors.primary.paragraph}>
               {selectedItemsList.length}
             </Heading>
           </View>
         </View>
+
         <View
           style={{
             flexDirection: "row",
@@ -210,144 +210,142 @@ export const SelectionHeader = React.memo(
               allSelected ? colors.primary.accent : colors.primary.paragraph
             }
             name="select-all"
-            size={SIZE.xl}
           />
 
-          {type !== "note" ? null : (
-            <>
-              <IconButton
-                onPress={async () => {
-                  await sleep(100);
-                  ManageTagsSheet.present(selectedItemsList);
-                }}
-                style={{
-                  marginLeft: 10
-                }}
-                color={colors.primary.icon}
-                tooltipText="Manage tags"
-                tooltipPosition={4}
-                name="pound"
-                size={SIZE.xl}
-              />
-
-              <IconButton
-                onPress={async () => {
-                  ExportNotesSheet.present(selectedItemsList);
-                }}
-                tooltipText="Export"
-                tooltipPosition={4}
-                style={{
-                  marginLeft: 10
-                }}
-                color={colors.primary.paragraph}
-                name="export"
-                size={SIZE.xl}
-              />
-
-              <IconButton
-                onPress={async () => {
-                  MoveNoteSheet.present();
-                }}
-                style={{
-                  marginLeft: 10
-                }}
-                tooltipText="Add to notebooks"
-                tooltipPosition={4}
-                color={colors.primary.paragraph}
-                name="plus"
-                size={SIZE.xl}
-              />
-            </>
-          )}
-
-          {renderedInRoute === "Notebook" ? (
-            <IconButton
-              onPress={async () => {
-                if (selectedItemsList.length > 0) {
-                  if (!id) return;
-                  await db.notes.removeFromNotebook(id, ...selectedItemsList);
-                  updateNotebook(id);
-                  Navigation.queueRoutesForUpdate();
-                  clearSelection();
+          {selectedItemsList.length ? (
+            <Menu
+              ref={menuRef}
+              animationDuration={200}
+              style={{
+                borderRadius: 5,
+                backgroundColor: contextMenuColors.primary.background,
+                marginTop: -20
+              }}
+              onRequestClose={() => {
+                menuRef.current?.hide();
+              }}
+              anchor={
+                <IconButton
+                  onPress={() => {
+                    menuRef.current?.show();
+                  }}
+                  name="dots-vertical"
+                  color={colors.primary.paragraph}
+                />
+              }
+            >
+              {[
+                {
+                  title:
+                    selectedItemsList.length > 1
+                      ? "Move notebooks"
+                      : "Move notebook",
+                  onPress: async () => {
+                    const ids = selectedItemsList;
+                    const notebooks = await db.notebooks.all.items(ids);
+                    MoveNotebookSheet.present(notebooks);
+                  },
+                  visible: renderedInRoute === "Notebooks",
+                  icon: "arrow-right-bold-box-outline"
+                },
+                {
+                  title: "Manage tags",
+                  onPress: async () => {
+                    await sleep(100);
+                    ManageTagsSheet.present(selectedItemsList);
+                  },
+                  visible: type === "note",
+                  icon: "pound"
+                },
+                {
+                  title: "Export",
+                  onPress: async () => {
+                    await sleep(100);
+                    ExportNotesSheet.present(selectedItemsList);
+                  },
+                  visible: type === "note",
+                  icon: "export"
+                },
+                {
+                  title: "Link notebook",
+                  onPress: async () => {
+                    await sleep(100);
+                    MoveNoteSheet.present();
+                  },
+                  visible: type === "note",
+                  icon: "plus"
+                },
+                {
+                  title: "Unlink notebook",
+                  onPress: async () => {
+                    if (!id) return;
+                    await db.notes.removeFromNotebook(id, ...selectedItemsList);
+                    updateNotebook(id);
+                    Navigation.queueRoutesForUpdate();
+                    clearSelection();
+                  },
+                  visible: renderedInRoute === "Notebook",
+                  icon: "minus"
+                },
+                {
+                  title: "Unfavorite",
+                  onPress: addToFavorite,
+                  visible: focusedRouteId === "Favorites",
+                  icon: "star-off"
+                },
+                {
+                  title: `Move to trash`,
+                  onPress: async () => {
+                    deleteItems(
+                      undefined,
+                      useSelectionStore.getState().selectionMode
+                    ).then(() => {
+                      useSelectionStore.getState().clearSelection();
+                      useSelectionStore.getState().setSelectionMode(undefined);
+                    });
+                  },
+                  visible: type !== "trash",
+                  icon: "delete"
+                },
+                {
+                  title: `Restore`,
+                  onPress: restoreItem,
+                  visible: type === "trash",
+                  icon: "delete-restore"
+                },
+                {
+                  title: `Delete`,
+                  onPress: deleteItem,
+                  visible: type === "trash",
+                  icon: "delete"
                 }
-              }}
-              style={{
-                marginLeft: 10
-              }}
-              tooltipText={`Remove from Notebook`}
-              tooltipPosition={4}
-              testID="select-minus"
-              color={colors.primary.paragraph}
-              name="minus"
-              size={SIZE.xl}
-            />
-          ) : null}
-
-          {focusedRouteId === "Favorites" ? (
-            <IconButton
-              onPress={addToFavorite}
-              style={{
-                marginLeft: 10
-              }}
-              tooltipText="Remove from favorites"
-              tooltipPosition={4}
-              color={colors.primary.paragraph}
-              name="star-off"
-              size={SIZE.xl}
-            />
-          ) : null}
-
-          {type === "trash" ? null : (
-            <IconButton
-              style={{
-                marginLeft: 10
-              }}
-              onPress={() => {
-                deleteItems(
-                  undefined,
-                  useSelectionStore.getState().selectionMode
-                ).then(() => {
-                  useSelectionStore.getState().clearSelection();
-                  useSelectionStore.getState().setSelectionMode(undefined);
-                });
-              }}
-              tooltipText="Move to trash"
-              tooltipPosition={1}
-              color={colors.primary.paragraph}
-              name="delete"
-              size={SIZE.xl}
-            />
-          )}
-
-          {type === "trash" ? (
-            <>
-              <IconButton
-                style={{
-                  marginLeft: 10
-                }}
-                color={colors.primary.paragraph}
-                onPress={restoreItem}
-                name="delete-restore"
-                tooltipText="Restore"
-                tooltipPosition={4}
-                size={SIZE.xl - 3}
-              />
-
-              <IconButton
-                style={{
-                  marginLeft: 10
-                }}
-                color={colors.primary.paragraph}
-                onPress={deleteItem}
-                tooltipText="Delete"
-                tooltipPosition={4}
-                name="delete"
-                size={SIZE.xl - 3}
-              />
-            </>
+              ].map((item) =>
+                !item.visible ? null : (
+                  <Button
+                    style={{
+                      width: 150,
+                      justifyContent: "flex-start",
+                      borderRadius: 0
+                    }}
+                    type="plain"
+                    buttonType={{
+                      text: contextMenuColors.primary.paragraph
+                    }}
+                    icon={item.icon}
+                    key={item.title}
+                    title={item.title}
+                    onPress={async () => {
+                      menuRef.current?.hide();
+                      if (Platform.OS === "ios") await sleep(300);
+                      item.onPress();
+                    }}
+                  />
+                )
+              )}
+            </Menu>
           ) : null}
         </View>
-      </Animated.View>
+      </View>
     );
   }
 );

apps/mobile/app/components/sheets/add-notebook/index.tsx

@@ -39,15 +39,18 @@ import Heading from "../../ui/typography/heading";
 import { MoveNotes } from "../move-notes/movenote";
 import { eOnNotebookUpdated } from "../../../utils/events";
 import { getParentNotebookId } from "../../../utils/notebooks";
+import { useNotebookStore } from "../../../stores/use-notebook-store";
 
 export const AddNotebookSheet = ({
   notebook,
   parentNotebook,
-  close
+  close,
+  showMoveNotesOnComplete
 }: {
   notebook?: Notebook;
   parentNotebook?: Notebook;
-  close: ((context?: string | undefined) => void) | undefined;
+  close?: (didAddNotebook: boolean) => void;
+  showMoveNotesOnComplete: boolean;
 }) => {
   const title = useRef(notebook?.title);
   const description = useRef(notebook?.description);
@@ -85,6 +88,7 @@ export const AddNotebookSheet = ({
     useMenuStore.getState().setMenuPins();
     Navigation.queueRoutesForUpdate();
     useRelationStore.getState().update();
+    useNotebookStore.getState().refresh();
 
     const parent =
       parentNotebook?.id || (await getParentNotebookId(notebook?.id || id));
@@ -97,10 +101,10 @@ export const AddNotebookSheet = ({
       });
     }
 
-    if (!notebook) {
+    if (!notebook && showMoveNotesOnComplete) {
       MoveNotes.present(await db.notebooks.notebook(id));
     } else {
-      close?.();
+      close?.(true);
     }
   };
 
@@ -169,7 +173,8 @@ AddNotebookSheet.present = (
   notebook?: Notebook,
   parentNotebook?: Notebook,
   context?: string,
-  onClose?: () => void
+  onClose?: (didAddNotebook: boolean) => void,
+  showMoveNotesOnComplete = true
 ) => {
   presentSheet({
     context: context,
@@ -177,9 +182,12 @@ AddNotebookSheet.present = (
       <AddNotebookSheet
         notebook={notebook}
         parentNotebook={parentNotebook}
-        close={close}
+        close={(didAddNotebook: boolean) => {
+          close?.();
+          onClose?.(didAddNotebook);
+        }}
+        showMoveNotesOnComplete={showMoveNotesOnComplete || false}
       />
-    ),
-    onClose: onClose
+    )
   });
 };

apps/mobile/app/components/sheets/add-to/index.tsx

@@ -46,6 +46,7 @@ import { IconButton } from "../../ui/icon-button";
 import Paragraph from "../../ui/typography/paragraph";
 import { NotebookItem } from "./notebook-item";
 import { useNotebookItemSelectionStore } from "./store";
+import { AddNotebookSheet } from "../add-notebook";
 
 async function updateInitialSelectionState(items: string[]) {
   const relations = await db.relations
@@ -141,6 +142,11 @@ const MoveNoteSheet = ({
     actionSheetRef.current?.hide();
   };
 
+  const hasSelected = () => {
+    const selection = useNotebookItemSelectionStore.getState().selection;
+    return Object.keys(selection).some((key) => selection[key] === "selected");
+  };
+
   const renderNotebook = useCallback(
     ({ index }: { item: boolean; index: number }) => (
       <NotebookItem items={notebooks} id={index} index={index} />
@@ -180,7 +186,7 @@ const MoveNoteSheet = ({
             paragraph={
               !multiSelect
                 ? "Long press to enable multi-select."
-                : "Select topics you want to add note(s) to."
+                : "Select notebooks you want to add note(s) to."
             }
           />
 
@@ -190,18 +196,21 @@ const MoveNoteSheet = ({
               columnGap: 10
             }}
           >
-            <IconButton
-              name="restore"
-              type="secondaryAccented"
-              onPress={() => {
-                const items = note ? [note.id] : selectedItemsList;
-                updateInitialSelectionState(items);
-              }}
-              style={{
-                width: 40,
-                height: 40
-              }}
-            />
+            {hasSelected() ? (
+              <IconButton
+                name="restore"
+                type="secondaryAccented"
+                color={colors.primary.icon}
+                onPress={() => {
+                  const items = note ? [note.id] : selectedItemsList;
+                  updateInitialSelectionState(items);
+                }}
+                style={{
+                  width: 40,
+                  height: 40
+                }}
+              />
+            ) : null}
 
             <Button
               height={40}
@@ -230,6 +239,36 @@ const MoveNoteSheet = ({
             style={{
               width: "100%"
             }}
+            ListHeaderComponent={
+              <View
+                style={{
+                  paddingHorizontal: 12,
+                  width: "100%"
+                }}
+              >
+                <Button
+                  title="Add new notebook"
+                  style={{
+                    alignSelf: "flex-start",
+                    paddingHorizontal: 12,
+                    justifyContent: "space-between"
+                  }}
+                  onPress={() => {
+                    AddNotebookSheet.present(
+                      undefined,
+                      undefined,
+                      "link-notebooks",
+                      undefined,
+                      false
+                    );
+                  }}
+                  icon="plus"
+                  iconPosition="right"
+                  type="secondaryAccented"
+                  width="100%"
+                />
+              </View>
+            }
             estimatedItemSize={50}
             renderItem={renderNotebook}
             ListEmptyComponent={
@@ -265,7 +304,8 @@ MoveNoteSheet.present = (note?: Note) => {
   presentSheet({
     component: (ref) => <MoveNoteSheet actionSheetRef={ref} note={note} />,
     enableGesturesInScrollView: false,
-    noBottomPadding: true
+    noBottomPadding: true,
+    keyboardHandlerDisabled: true
   });
 };
 export default MoveNoteSheet;

apps/mobile/app/components/sheets/add-to/notebook-item.tsx

@@ -226,7 +226,13 @@ export const NotebookItem = ({
             testID={notesnook.ids.notebook.menu}
             onPress={() => {
               if (!item) return;
-              AddNotebookSheet.present(undefined, item, "link-notebooks");
+              AddNotebookSheet.present(
+                undefined,
+                item,
+                "link-notebooks",
+                undefined,
+                false
+              );
             }}
             left={0}
             right={0}

apps/mobile/app/components/sheets/editor-tabs/index.tsx

@@ -43,6 +43,7 @@ type TabItem = {
   locked?: boolean;
   noteLocked?: boolean;
   readonly?: boolean;
+  pinned?: boolean;
 };
 
 const TabItemComponent = (props: {
@@ -83,7 +84,6 @@ const TabItemComponent = (props: {
       onPress={() => {
         if (!props.isFocused) {
           useTabStore.getState().focusTab(props.tab.id);
-          props.close?.();
           if (props.tab.locked) {
             eSendEvent(eUnlockNote);
           }
@@ -94,6 +94,7 @@ const TabItemComponent = (props: {
             }, 300);
           }
         }
+        props.close?.();
       }}
       onLongPress={() => {
         useTabStore.getState().updateTab(props.tab.id, {
@@ -129,7 +130,9 @@ const TabItemComponent = (props: {
               : colors.primary.paragraph
           }
           style={{
-            fontStyle: props.tab.previewTab ? "italic" : "normal"
+            fontFamily: props.tab.previewTab
+              ? "OpenSans-Italic"
+              : "OpenSans-Regular"
           }}
           numberOfLines={1}
           size={SIZE.md}
@@ -138,24 +141,50 @@ const TabItemComponent = (props: {
         </Paragraph>
       </View>
 
-      <IconButton
-        name="close"
-        size={SIZE.lg}
-        color={colors.primary.icon}
-        onPress={() => {
-          const isLastTab = useTabStore.getState().tabs.length === 1;
-          useTabStore.getState().removeTab(props.tab.id);
-          // The last tab is not actually removed, it is just cleaned up.
-          if (isLastTab) {
-            editorController.current?.reset(props.tab.id, true, true);
-            props.close?.();
-          }
+      <View
+        style={{
+          flexDirection: "row",
+          gap: 5,
+          paddingRight: 12
         }}
-        top={0}
-        left={0}
-        right={20}
-        bottom={0}
-      />
+      >
+        <IconButton
+          name="pin"
+          size={SIZE.lg}
+          color={props.tab.pinned ? colors.primary.accent : colors.primary.icon}
+          onPress={() => {
+            useTabStore.getState().updateTab(props.tab.id, {
+              pinned: !props.tab.pinned,
+              previewTab: false
+            });
+          }}
+          top={0}
+          left={0}
+          right={20}
+          bottom={0}
+        />
+
+        {!props.tab?.pinned ? (
+          <IconButton
+            name="close"
+            size={SIZE.lg}
+            color={colors.primary.icon}
+            onPress={() => {
+              const isLastTab = useTabStore.getState().tabs.length === 1;
+              useTabStore.getState().removeTab(props.tab.id);
+              // The last tab is not actually removed, it is just cleaned up.
+              if (isLastTab) {
+                editorController.current?.reset(props.tab.id, true, true);
+                props.close?.();
+              }
+            }}
+            top={0}
+            left={0}
+            right={20}
+            bottom={0}
+          />
+        ) : null}
+      </View>
     </Pressable>
   );
 };
@@ -223,7 +252,16 @@ export default function EditorTabs({
         />
       </View>
 
-      <FlatList windowSize={3} data={tabs} renderItem={renderTabItem} />
+      <FlatList
+        windowSize={3}
+        data={tabs.sort((t1, t2) => {
+          if (t1.pinned && t2.pinned) return 0;
+          if (t1.pinned) return -1;
+          if (t2.pinned) return 1;
+          return 0;
+        })}
+        renderItem={renderTabItem}
+      />
     </View>
   );
 }

apps/mobile/app/components/sheets/export-notes/index.tsx

@@ -39,6 +39,7 @@ import { getElevationStyle } from "../../../utils/elevation";
 import { eCloseSheet } from "../../../utils/events";
 import { SIZE, ph, pv } from "../../../utils/size";
 import { sleep } from "../../../utils/time";
+import { Dialog } from "../../dialog";
 import DialogHeader from "../../dialog/dialog-header";
 import { ProTag } from "../../premium/pro-tag";
 import { Button } from "../../ui/button";
@@ -47,7 +48,6 @@ import { Pressable } from "../../ui/pressable";
 import Seperator from "../../ui/seperator";
 import Heading from "../../ui/typography/heading";
 import Paragraph from "../../ui/typography/paragraph";
-import { Dialog } from "../../dialog";
 
 const ExportNotesSheet = ({
   ids,
@@ -71,7 +71,7 @@ const ExportNotesSheet = ({
   const [status, setStatus] = useState<string>();
   const premium = useUserStore((state) => state.premium);
 
-  const save = async (
+  const exportNoteAs = async (
     type: "pdf" | "txt" | "md" | "html" | "md-frontmatter"
   ) => {
     if (exporting) return;
@@ -81,9 +81,18 @@ const ExportNotesSheet = ({
     setComplete(false);
     let result;
     if (ids.length > 1) {
-      result = await Exporter.bulkExport(ids, type, setStatus);
+      result = await Exporter.bulkExport(
+        db.notes.all.where((eb) => eb("id", "in", ids)),
+        type,
+        setStatus
+      );
     } else {
-      result = await Exporter.exportNote(ids[0], type);
+      const note = await db.notes.note(ids[0]);
+      if (!note) {
+        setExporting(false);
+        return;
+      }
+      result = await Exporter.exportNote(note, type, setStatus);
       await sleep(1000);
     }
     if (!result) {
@@ -101,7 +110,7 @@ const ExportNotesSheet = ({
     {
       title: "PDF",
       func: async () => {
-        await save("pdf");
+        await exportNoteAs("pdf");
       },
       icon: "file-pdf-box",
       desc: "View in any pdf reader app",
@@ -111,7 +120,7 @@ const ExportNotesSheet = ({
     {
       title: "Markdown",
       func: async () => {
-        await save("md");
+        await exportNoteAs("md");
       },
       icon: "language-markdown",
       desc: "View in any text or markdown editor",
@@ -121,7 +130,7 @@ const ExportNotesSheet = ({
     {
       title: "Markdown + Frontmatter",
       func: async () => {
-        await save("md-frontmatter");
+        await exportNoteAs("md-frontmatter");
       },
       icon: "language-markdown",
       desc: "View in any text or markdown editor",
@@ -131,7 +140,7 @@ const ExportNotesSheet = ({
     {
       title: "Plain Text",
       func: async () => {
-        await save("txt");
+        await exportNoteAs("txt");
       },
       icon: "card-text",
       desc: "View in any text editor",
@@ -141,7 +150,7 @@ const ExportNotesSheet = ({
     {
       title: "HTML",
       func: async () => {
-        await save("html");
+        await exportNoteAs("html");
       },
       icon: "language-html5",
       desc: "View in any web browser & html reader",
@@ -250,11 +259,9 @@ const ExportNotesSheet = ({
               <>
                 <ActivityIndicator />
                 <Paragraph>
-                  {ids.length === 1
-                    ? "Exporting note... Please wait"
-                    : `Exporting notes${
-                        status ? ` (${status})` : ``
-                      }... Please wait`}
+                  {`${
+                    status ? `${status})` : `Exporting notes`
+                  }... Please wait`}
                 </Paragraph>
               </>
             ) : (

apps/mobile/app/components/sheets/github/issue.js

@@ -141,7 +141,7 @@ Logged in: ${user ? "yes" : "no"}`,
         defaultValue={title.current}
         style={{
           borderWidth: 1,
-          borderColor: colors.secondary.background,
+          borderColor: colors.primary.border,
           borderRadius: 5,
           padding: 12,
           fontFamily: "OpenSans-Regular",
@@ -178,7 +178,7 @@ For example:
         }}
         style={{
           borderWidth: 1,
-          borderColor: colors.secondary.background,
+          borderColor: colors.primary.border,
           borderRadius: 5,
           padding: 12,
           fontFamily: "OpenSans-Regular",

apps/mobile/app/components/sheets/link-note/index.tsx

@@ -219,7 +219,7 @@ export default function LinkNote(props: {
     <View
       style={{
         paddingHorizontal: 12,
-        minHeight: 400,
+        minHeight: "100%",
         maxHeight: "100%"
       }}
     >
@@ -311,6 +311,7 @@ export default function LinkNote(props: {
           style={{
             marginTop: 10
           }}
+          keyboardShouldPersistTaps="handled"
           windowSize={3}
           keyExtractor={(item) => item.id}
           data={nodes}
@@ -324,6 +325,7 @@ export default function LinkNote(props: {
               onSelectNote={onSelectNote}
             />
           )}
+          keyboardShouldPersistTaps="handled"
           style={{
             marginTop: 10
           }}

apps/mobile/app/components/sheets/migrate/index.tsx

@@ -99,6 +99,7 @@ export default function Migrate() {
       const { error } = await BackupService.run(false, "local");
       if (error) {
         ToastManager.error(error, "Backup failed");
+        reportError(error);
         setLoading(false);
         return;
       }
@@ -159,13 +160,14 @@ export default function Migrate() {
               }}
             >
               Migrating database{progress ? `(${progress?.collection})` : null}
-              {progress ? `(${progress.current}/${progress.total}) ` : null}...
-              please wait
+              {progress ? `(${progress.current}/${progress.total}) ` : null}
+              ... please wait
             </Paragraph>
 
             <View
               style={{
-                width: 200
+                width: 200,
+                alignSelf: "center"
               }}
             >
               <ProgressBarComponent

apps/mobile/app/components/sheets/move-notebook/index.tsx

@@ -0,0 +1,361 @@
+/*
+This file is part of the Notesnook project (https://notesnook.com/)
+
+Copyright (C) 2023 Streetwriters (Private) Limited
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+import { Notebook, VirtualizedGrouping } from "@notesnook/core";
+import { useThemeColors } from "@notesnook/theme";
+import React, { useCallback, useEffect, useState } from "react";
+import { Text, View } from "react-native";
+import { FlatList } from "react-native-actions-sheet";
+import create from "zustand";
+import { db } from "../../../common/database";
+import { useNotebook } from "../../../hooks/use-notebook";
+import { eSendEvent, presentSheet } from "../../../services/event-manager";
+import {
+  useNotebookStore,
+  useNotebooks
+} from "../../../stores/use-notebook-store";
+import { eOnNotebookUpdated } from "../../../utils/events";
+import {
+  findRootNotebookId,
+  getParentNotebookId
+} from "../../../utils/notebooks";
+import { SIZE } from "../../../utils/size";
+import { Dialog } from "../../dialog";
+import DialogHeader from "../../dialog/dialog-header";
+import { presentDialog } from "../../dialog/functions";
+import SheetProvider from "../../sheet-provider";
+import { Button } from "../../ui/button";
+import { IconButton } from "../../ui/icon-button";
+import { Pressable } from "../../ui/pressable";
+import Seperator from "../../ui/seperator";
+import Paragraph from "../../ui/typography/paragraph";
+import { AddNotebookSheet } from "../add-notebook";
+
+const useNotebookExpandedStore = create<{
+  expanded: {
+    [id: string]: boolean;
+  };
+  setExpanded: (id: string) => void;
+}>((set, get) => ({
+  expanded: {},
+  setExpanded(id: string) {
+    set({
+      expanded: {
+        ...get().expanded,
+        [id]: !get().expanded[id]
+      }
+    });
+  }
+}));
+
+export const MoveNotebookSheet = ({
+  selectedNotebooks,
+  close
+}: {
+  selectedNotebooks: Notebook[];
+  close?: () => void;
+}) => {
+  const [notebooks] = useNotebooks();
+  const { colors } = useThemeColors();
+  const [moveToTop, setMoveToTop] = useState(false);
+
+  useEffect(() => {
+    (async () => {
+      for (const notebook of selectedNotebooks) {
+        const root = await findRootNotebookId(notebook.id);
+        if (root !== notebook.id) {
+          setMoveToTop(true);
+          return;
+        }
+      }
+    })();
+  }, [selectedNotebooks]);
+
+  const renderItem = useCallback(
+    ({ index }: { index: number }) => {
+      return (
+        <NotebookItem
+          id={index}
+          items={notebooks}
+          level={0}
+          selectedNotebooks={selectedNotebooks}
+          onPress={async (selectedNotebook) => {
+            presentDialog({
+              title: `Move ${
+                selectedNotebooks.length > 1
+                  ? selectedNotebooks.length + " notebooks"
+                  : selectedNotebooks[0].title
+              }`,
+              paragraph: `Are you sure you want to move ${
+                selectedNotebooks.length > 1
+                  ? selectedNotebooks.length + " notebooks"
+                  : selectedNotebooks[0].title
+              } to ${selectedNotebook.title}?`,
+              positiveText: "Move",
+              context: "move-notebook",
+              positivePress: async () => {
+                for (const notebook of selectedNotebooks) {
+                  const parent = await getParentNotebookId(notebook.id);
+                  const root = await findRootNotebookId(notebook.id);
+
+                  if (selectedNotebook.id === notebook.id) continue;
+
+                  if (root !== notebook.id) {
+                    await db.relations.unlink(
+                      {
+                        type: "notebook",
+                        id: parent
+                      },
+                      notebook
+                    );
+                    eSendEvent(eOnNotebookUpdated, parent);
+                  }
+
+                  await db.relations.add(selectedNotebook, notebook);
+                  eSendEvent(eOnNotebookUpdated, selectedNotebook.id);
+                  eSendEvent(eOnNotebookUpdated, notebook.id);
+                }
+                useNotebookStore.getState().refresh();
+                close?.();
+              }
+            });
+          }}
+        />
+      );
+    },
+    [selectedNotebooks, notebooks, close]
+  );
+
+  return (
+    <View>
+      <SheetProvider context="move-notebook" />
+      <Dialog context="move-notebook" />
+
+      <View
+        style={{
+          paddingHorizontal: 12
+        }}
+      >
+        <DialogHeader
+          title={`Moving ${
+            selectedNotebooks.length > 1
+              ? selectedNotebooks.length + " notebooks"
+              : selectedNotebooks[0].title
+          }`}
+          paragraph={"Select the notebook you want to move this notebook to."}
+        />
+      </View>
+      <Seperator />
+
+      <FlatList
+        data={notebooks?.placeholders}
+        renderItem={renderItem}
+        windowSize={1}
+        ListHeaderComponent={
+          <View
+            style={{
+              paddingHorizontal: 12
+            }}
+          >
+            {moveToTop ? (
+              <Button
+                title="Move to top"
+                style={{
+                  alignSelf: "flex-start",
+                  width: "100%",
+                  justifyContent: "space-between"
+                }}
+                icon="arrow-up-bold"
+                iconPosition="right"
+                type="secondaryAccented"
+                onPress={async () => {
+                  for (const notebook of selectedNotebooks) {
+                    const parent = await getParentNotebookId(notebook.id);
+                    const root = await findRootNotebookId(notebook.id);
+                    if (root !== notebook.id) {
+                      await db.relations.unlink(
+                        {
+                          type: "notebook",
+                          id: parent
+                        },
+                        notebook
+                      );
+                      eSendEvent(eOnNotebookUpdated, parent);
+                      eSendEvent(eOnNotebookUpdated, notebook.id);
+                    }
+                  }
+                  useNotebookStore.getState().refresh();
+                  close?.();
+                }}
+              />
+            ) : null}
+          </View>
+        }
+        ListEmptyComponent={
+          <View
+            style={{
+              flex: 1,
+              justifyContent: "center",
+              alignItems: "center",
+              height: 200
+            }}
+          >
+            <Text
+              style={{
+                color: colors.secondary.icon
+              }}
+            >
+              No notebooks
+            </Text>
+          </View>
+        }
+      />
+    </View>
+  );
+};
+
+const NotebookItem = ({
+  id,
+  onPress,
+  items,
+  level = 0,
+  selectedNotebooks
+}: {
+  id: string | number;
+  level?: number;
+  items?: VirtualizedGrouping<Notebook>;
+  onPress: (item: Notebook) => void;
+  selectedNotebooks: Notebook[];
+}) => {
+  const { nestedNotebooks, notebook } = useNotebook(id, items, true);
+
+  const isExpanded = useNotebookExpandedStore((state) =>
+    !notebook ? false : state.expanded[notebook.id]
+  );
+  const { colors } = useThemeColors();
+
+  return selectedNotebooks.find(
+    (n) => n.id === notebook?.id
+  ) ? null : !notebook ? (
+    <View
+      style={{
+        height: 45
+      }}
+    />
+  ) : (
+    <View
+      style={{
+        minHeight: 45,
+        borderRadius: 0
+      }}
+    >
+      <Pressable
+        onPress={() => onPress(notebook)}
+        style={{
+          flexDirection: "row",
+          paddingHorizontal: 12,
+          height: 45
+        }}
+      >
+        {nestedNotebooks?.placeholders.length ? (
+          <IconButton
+            name={isExpanded ? "chevron-down" : "chevron-right"}
+            color={colors.primary.icon}
+            size={20}
+            onPress={() => {
+              if (!notebook) return;
+              useNotebookExpandedStore.getState().setExpanded(notebook.id);
+            }}
+          />
+        ) : (
+          <View
+            style={{
+              width: 35,
+              height: 30,
+              justifyContent: "center",
+              alignItems: "center"
+            }}
+          />
+        )}
+
+        <View
+          style={{
+            flexDirection: "row",
+            justifyContent: "space-between",
+            flexGrow: 1,
+            alignItems: "center"
+          }}
+        >
+          <Paragraph
+            numberOfLines={1}
+            style={{
+              color: colors.primary.paragraph,
+              fontSize: 15
+            }}
+          >
+            {notebook.title}
+          </Paragraph>
+
+          <IconButton
+            name="plus"
+            onPress={() => {
+              if (!notebook) return;
+              AddNotebookSheet.present(
+                undefined,
+                notebook,
+                "move-notebooks",
+                undefined,
+                false
+              );
+            }}
+            size={SIZE.lg}
+          />
+        </View>
+      </Pressable>
+
+      {nestedNotebooks?.placeholders?.length && isExpanded ? (
+        <View
+          style={{
+            paddingLeft: level + 1 > 0 && level + 1 < 5 ? 15 : 0,
+            marginTop: 5
+          }}
+        >
+          {nestedNotebooks.placeholders.map((item, index) => (
+            <NotebookItem
+              key={notebook?.id + index}
+              id={index}
+              onPress={onPress}
+              level={level + 1}
+              items={nestedNotebooks}
+              selectedNotebooks={selectedNotebooks}
+            />
+          ))}
+        </View>
+      ) : null}
+    </View>
+  );
+};
+
+MoveNotebookSheet.present = async (notebooks: Notebook[]) => {
+  presentSheet({
+    component: (ref, close) => (
+      <MoveNotebookSheet selectedNotebooks={notebooks} close={close} />
+    ),
+    keyboardHandlerDisabled: true
+  });
+};

apps/mobile/app/components/sheets/move-notes/movenote.tsx

@@ -20,8 +20,8 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { VirtualizedGrouping } from "@notesnook/core";
 import { Note, Notebook } from "@notesnook/core/dist/types";
 import { useThemeColors } from "@notesnook/theme";
-import React, { RefObject, useEffect, useState } from "react";
-import { View } from "react-native";
+import React, { RefObject, useEffect, useRef, useState } from "react";
+import { ActivityIndicator, TextInput, View } from "react-native";
 import { ActionSheetRef } from "react-native-actions-sheet";
 import { FlashList } from "react-native-actions-sheet/dist/src/views/FlashList";
 import { db } from "../../../common/database";
@@ -35,6 +35,7 @@ import { Dialog } from "../../dialog";
 import DialogHeader from "../../dialog/dialog-header";
 import { Button } from "../../ui/button";
 import { IconButton } from "../../ui/icon-button";
+import Input from "../../ui/input";
 import { Pressable } from "../../ui/pressable";
 import Seperator from "../../ui/seperator";
 import Paragraph from "../../ui/typography/paragraph";
@@ -50,39 +51,60 @@ export const MoveNotes = ({
 }) => {
   const { colors } = useThemeColors();
   const currentNotebook = notebook;
+  const inputRef = useRef<TextInput>(null);
+  const [loading, setLoading] = useState(false);
   const selectionCount = useItemSelectionStore(
     (state) =>
       Object.keys(state.selection).filter(
         (k) =>
-          state.initialState?.[k] !== "selected" &&
-          state.selection[k] !== "deselected"
+          state.selection?.[k] === "selected" ||
+          state.selection[k] === "deselected"
       )?.length > 0
   );
 
   const [notes, setNotes] = useState<VirtualizedGrouping<Note>>();
 
+  const loadNotes = React.useCallback(
+    async (query?: string) => {
+      setLoading(true);
+      const notes = query
+        ? db.lookup.notes(query).sorted()
+        : db.notes?.all.sorted(db.settings.getGroupOptions("notes") as any);
+
+      notes
+        .then(async (notes) => {
+          await notes.item(0);
+          setNotes(notes);
+          setLoading(false);
+        })
+        .catch(() => {
+          setLoading(false);
+        });
+
+      db.relations
+        .from(currentNotebook, "note")
+        .get()
+        .then((existingNotes) => {
+          const selection: { [name: string]: any } = {};
+          existingNotes.forEach((rel) => {
+            selection[rel.toId] = "selected";
+          });
+          useItemSelectionStore.setState({
+            selection: selection,
+            initialState: selection
+          });
+        });
+    },
+    [currentNotebook]
+  );
+
   useEffect(() => {
-    db.notes?.all.sorted(db.settings.getGroupOptions("notes")).then((notes) => {
-      setNotes(notes);
-    });
-    db.relations
-      .from(currentNotebook, "note")
-      .get()
-      .then((existingNotes) => {
-        const selection: { [name: string]: any } = {};
-        existingNotes.forEach((rel) => {
-          selection[rel.toId] = "selected";
-        });
-        useItemSelectionStore.setState({
-          selection: selection,
-          initialState: selection
-        });
-      });
+    loadNotes();
 
     return () => {
       useItemSelectionStore.getState().reset();
     };
-  }, [currentNotebook]);
+  }, [currentNotebook, loadNotes]);
 
   const renderItem = React.useCallback(
     ({ index }: { item: boolean; index: number }) => {
@@ -96,19 +118,33 @@ export const MoveNotes = ({
       style={{
         paddingHorizontal: 12,
         maxHeight: "100%",
-        height: notes?.placeholders.length
-          ? 50 * (notes?.placeholders.length + 2)
-          : 300
+        height: "100%"
       }}
     >
       <Dialog context="local" />
 
       <DialogHeader
         title={`Add notes to ${currentNotebook.title}`}
-        paragraph={"Select the topic in which you would like to move notes."}
+        paragraph={"Select the notes you want to move to this Notebook."}
       />
       <Seperator />
 
+      <Input
+        button={{
+          icon: "magnify",
+          color: colors.primary.accent,
+          size: SIZE.lg,
+          onPress: () => {}
+        }}
+        testID="search-input"
+        fwdRef={inputRef}
+        autoCapitalize="none"
+        onChangeText={(v) => {
+          loadNotes(v && v.trim() === "" ? undefined : v.trim());
+        }}
+        placeholder="Search a note"
+      />
+
       <FlashList
         ListEmptyComponent={
           <View
@@ -118,13 +154,17 @@ export const MoveNotes = ({
               alignItems: "center"
             }}
           >
-            <Paragraph color={colors.secondary.paragraph}>
-              No notes to show
-            </Paragraph>
+            {loading ? (
+              <ActivityIndicator size="large" color={colors.primary.accent} />
+            ) : (
+              <Paragraph color={colors.secondary.paragraph}>
+                No notes to show
+              </Paragraph>
+            )}
           </View>
         }
         estimatedItemSize={50}
-        data={notes?.placeholders}
+        data={loading ? [] : notes?.placeholders}
         renderItem={renderItem}
       />
 
@@ -135,6 +175,12 @@ export const MoveNotes = ({
               currentNotebook.id,
               ...useItemSelectionStore.getState().getSelectedItemIds()
             );
+
+            await db.notes?.removeFromNotebook(
+              currentNotebook.id,
+              ...useItemSelectionStore.getState().getDeselectedItemIds()
+            );
+
             updateNotebook(currentNotebook.id);
             Navigation.queueRoutesForUpdate();
             fwdRef?.current?.hide();
@@ -161,11 +207,12 @@ const SelectableNoteItem = React.memo(
     const selected = useItemSelectionStore((state) =>
       item?.id ? state.selection[item.id] === "selected" : false
     );
+
     const exists = useItemSelectionStore((state) =>
       item?.id ? state.initialState[item.id] === "selected" : false
     );
 
-    return exists ? null : (
+    return (
       <Pressable
         testID="listitem.select"
         onPress={() => {
@@ -205,8 +252,14 @@ const SelectableNoteItem = React.memo(
                   ? "check-circle-outline"
                   : "checkbox-blank-circle-outline"
               }
-              type="selected"
-              color={selected ? colors.selected.icon : colors.primary.icon}
+              type="plain"
+              color={
+                selected
+                  ? colors.selected.icon
+                  : exists && !selected
+                  ? colors.static.red
+                  : colors.primary.icon
+              }
             />
 
             <View

apps/mobile/app/components/sheets/new-feature/index.tsx

@@ -17,13 +17,14 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
+import { useThemeColors } from "@notesnook/theme";
 import React from "react";
 import { Platform, View } from "react-native";
+import { ScrollView } from "react-native-actions-sheet";
 import { getVersion } from "react-native-device-info";
 import { features } from "../../../features";
 import { eSendEvent, presentSheet } from "../../../services/event-manager";
 import SettingsService from "../../../services/settings";
-import { useThemeColors } from "@notesnook/theme";
 import { eCloseSheet } from "../../../utils/events";
 import { SIZE } from "../../../utils/size";
 import { Button } from "../../ui/button";
@@ -36,7 +37,13 @@ export type FeatureType = {
   platform?: "ios" | "android";
 };
 
-const NewFeature = ({ features }: { features: FeatureType[] }) => {
+const NewFeature = ({
+  features,
+  version
+}: {
+  features: FeatureType[];
+  version?: string | null;
+}) => {
   const { colors } = useThemeColors();
 
   return (
@@ -44,30 +51,33 @@ const NewFeature = ({ features }: { features: FeatureType[] }) => {
       style={{
         alignItems: "center",
         paddingHorizontal: 12,
-        paddingTop: 12
+        paddingTop: 12,
+        maxHeight: "100%"
       }}
     >
       <Heading color={colors.secondary.heading} size={SIZE.md}>
-        New Version Highlights 🎉
+        {!version ? "New version " : `v${version} `}Highlights 🎉
       </Heading>
 
       <Seperator />
 
-      {features.map((item) => (
-        <View
-          key={item.title}
-          style={{
-            backgroundColor: colors.secondary.background,
-            padding: 12,
-            borderRadius: 10,
-            width: "100%",
-            marginBottom: 10
-          }}
-        >
-          <Heading size={SIZE.lg - 2}>{item.title}</Heading>
-          <Paragraph>{item.body}</Paragraph>
-        </View>
-      ))}
+      <ScrollView>
+        {features.map((item) => (
+          <View
+            key={item.title}
+            style={{
+              backgroundColor: colors.secondary.background,
+              padding: 12,
+              borderRadius: 10,
+              width: "100%",
+              marginBottom: 10
+            }}
+          >
+            <Heading size={SIZE.lg - 2}>{item.title}</Heading>
+            <Paragraph selectable>{item.body}</Paragraph>
+          </View>
+        ))}
+      </ScrollView>
       <Seperator />
 
       <Button
@@ -108,7 +118,13 @@ NewFeature.present = () => {
   );
   if (_features.length === 0) return;
   presentSheet({
-    component: <NewFeature features={features} />
+    component: (
+      <NewFeature
+        features={features}
+        version={SettingsService.getProperty("version")}
+      />
+    ),
+    disableClosing: true
   });
   return true;
 };

apps/mobile/app/components/sheets/notebook-sheet/index.tsx

@@ -19,13 +19,19 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { Notebook, VirtualizedGrouping } from "@notesnook/core";
 import { useThemeColors } from "@notesnook/theme";
 import React, { useEffect, useRef, useState } from "react";
-import { RefreshControl, View, useWindowDimensions } from "react-native";
+import {
+  Platform,
+  RefreshControl,
+  View,
+  useWindowDimensions
+} from "react-native";
 import ActionSheet, { ActionSheetRef } from "react-native-actions-sheet";
 import { FlashList } from "react-native-actions-sheet/dist/src/views/FlashList";
 import Config from "react-native-config";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import create from "zustand";
 import { notesnook } from "../../../../e2e/test.ids";
+import { db } from "../../../common/database";
 import { MMKV } from "../../../common/database/mmkv";
 import { useNotebook } from "../../../hooks/use-notebook";
 import NotebookScreen from "../../../screens/notebook";
@@ -43,6 +49,7 @@ import { IconButton } from "../../ui/icon-button";
 import { Pressable } from "../../ui/pressable";
 import Paragraph from "../../ui/typography/paragraph";
 import { AddNotebookSheet } from "../add-notebook";
+import { MoveNotebookSheet } from "../move-notebook";
 import Sort from "../sort";
 
 const useItemSelectionStore = createItemSelectionStore(true, false);
@@ -61,7 +68,8 @@ class NotebookSheetConfig {
   }
 
   static get(item: ConfigItem) {
-    return MMKV.getInt(NotebookSheetConfig.makeId(item)) || 0;
+    const value = MMKV.getInt(NotebookSheetConfig.makeId(item));
+    return typeof value === "number" ? value : 0;
   }
 
   static set(item: ConfigItem, index = 0) {
@@ -124,11 +132,6 @@ export const NotebookSheet = () => {
         if (!focusedRouteId) return;
         const nextRoot = await findRootNotebookId(focusedRouteId);
         if (nextRoot !== currentItem.current) {
-          console.log(
-            "NotebookSheet.useEffect.canShow",
-            "Root changed to",
-            nextRoot
-          );
           useItemSelectionStore.setState({
             enabled: false,
             selection: {}
@@ -137,17 +140,14 @@ export const NotebookSheet = () => {
         currentItem.current = nextRoot;
         const snapPoint = NotebookSheetConfig.get({
           type: "notebook",
-          id: nextRoot as string
+          id: focusedRouteId as string
         });
 
         if (ref.current?.isOpen()) {
           ref.current?.snapToIndex(snapPoint);
         } else {
-          setTimeout(() => {
-            ref.current?.show(snapPoint);
-          }, 150);
+          ref.current?.show(snapPoint);
         }
-        console.log("NotebookSheet.useEffect.didShow", focusedRouteId);
         setRoot(nextRoot);
         onRequestUpdate();
       });
@@ -160,7 +160,7 @@ export const NotebookSheet = () => {
         ref.current?.hide();
       }
     }
-  }, [canShow, onRequestUpdate, focusedRouteId]);
+  }, [canShow, focusedRouteId]);
 
   return (
     <ActionSheet
@@ -196,11 +196,56 @@ export const NotebookSheet = () => {
         backgroundColor: colors.secondary.background
       }}
       keyboardHandlerEnabled={false}
-      snapPoints={Config.isTesting === "true" ? [100] : [20, 100]}
+      snapPoints={
+        Config.isTesting === "true"
+          ? [100]
+          : [Platform.OS === "android" ? 15 : 10, 100]
+      }
       initialSnapIndex={1}
       backgroundInteractionEnabled
       gestureEnabled
     >
+      <View
+        style={{
+          position: "absolute",
+          right: 24 + normalize(50),
+          marginTop: -80
+        }}
+      >
+        <Pressable
+          testID={notesnook.buttons.add}
+          type="secondary"
+          onPress={() => {
+            if (!notebook) return;
+            AddNotebookSheet.present(
+              undefined,
+              notebook,
+              undefined,
+              undefined,
+              false
+            );
+          }}
+          style={{
+            borderRadius: 100
+          }}
+        >
+          <View
+            style={{
+              alignItems: "center",
+              justifyContent: "center",
+              height: normalize(50),
+              width: normalize(50)
+            }}
+          >
+            <Icon
+              name="notebook-plus"
+              color={colors.primary.icon}
+              size={SIZE.xxl}
+            />
+          </View>
+        </Pressable>
+      </View>
+
       <View
         style={{
           position: "absolute",
@@ -220,8 +265,8 @@ export const NotebookSheet = () => {
             style={{
               alignItems: "center",
               justifyContent: "center",
-              height: normalize(60),
-              width: normalize(60)
+              height: normalize(50),
+              width: normalize(50)
             }}
           >
             <Icon name="plus" color="white" size={SIZE.xxl} />
@@ -278,6 +323,26 @@ export const NotebookSheet = () => {
                   size={22}
                 />
 
+                <IconButton
+                  style={{
+                    marginLeft: 10,
+                    width: 40 * fontScale,
+                    height: 40 * fontScale
+                  }}
+                  onPress={async () => {
+                    const ids = useItemSelectionStore
+                      .getState()
+                      .getSelectedItemIds();
+                    const notebooks = await db.notebooks.all.items(ids);
+                    MoveNotebookSheet.present(notebooks);
+                  }}
+                  color={colors.primary.icon}
+                  tooltipText="Clear selection"
+                  tooltipPosition={1}
+                  name="arrow-right-bold-box-outline"
+                  size={22}
+                />
+
                 <IconButton
                   style={{
                     marginLeft: 10,
@@ -319,20 +384,6 @@ export const NotebookSheet = () => {
                     height: 40 * fontScale
                   }}
                 />
-                <IconButton
-                  name="plus"
-                  onPress={() => {
-                    if (!notebook) return;
-                    AddNotebookSheet.present(undefined, notebook, undefined);
-                  }}
-                  testID="add-notebook-button"
-                  color={colors.primary.icon}
-                  size={22}
-                  style={{
-                    width: 40 * fontScale,
-                    height: 40 * fontScale
-                  }}
-                />
 
                 <IconButton
                   name={collapsed ? "chevron-up" : "chevron-down"}

apps/mobile/app/components/sheets/publish-note/index.tsx

@@ -357,7 +357,9 @@ const PublishNoteSheet = ({
         }}
         onPress={async () => {
           try {
-            await openLinkInBrowser("https://docs.notesnook.com/monographs/");
+            await openLinkInBrowser(
+              "https://help.notesnook.com/publish-notes-with-monographs"
+            );
           } catch (e) {
             console.error(e);
           }

apps/mobile/app/components/sheets/reminder-notify/index.tsx

@@ -159,7 +159,7 @@ export default function ReminderNotify({
                 ? 160 * references?.placeholders?.length
                 : 500,
             borderTopWidth: 1,
-            borderTopColor: colors.secondary.background,
+            borderTopColor: colors.primary.border,
             marginTop: 5,
             paddingTop: 5
           }}

apps/mobile/app/components/sheets/reminder/index.tsx

@@ -18,7 +18,12 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 import { useThemeColors } from "@notesnook/theme";
 import React, { RefObject, useRef, useState } from "react";
-import { Platform, TextInput, View } from "react-native";
+import {
+  Platform,
+  TextInput,
+  View,
+  ScrollView as RNScrollView
+} from "react-native";
 import { ActionSheetRef, ScrollView } from "react-native-actions-sheet";
 import DateTimePickerModal from "react-native-modal-datetime-picker";
 import {
@@ -364,7 +369,7 @@ export default function ReminderSheet({
               ))}
             </View>
 
-            <ScrollView showsHorizontalScrollIndicator={false} horizontal>
+            <RNScrollView showsHorizontalScrollIndicator={false} horizontal>
               {recurringMode === RecurringModes.Daily ||
               recurringMode === RecurringModes.Year
                 ? null
@@ -425,7 +430,7 @@ export default function ReminderSheet({
                       }}
                     />
                   ))}
-            </ScrollView>
+            </RNScrollView>
           </View>
         ) : null}
 

apps/mobile/app/components/sheets/restore-data/index.js

@@ -48,6 +48,7 @@ import { Button } from "../../ui/button";
 import Seperator from "../../ui/seperator";
 import SheetWrapper from "../../ui/sheet";
 import Paragraph from "../../ui/typography/paragraph";
+import { useUserStore } from "../../../stores/use-user-store";
 
 const RestoreDataSheet = () => {
   const [visible, setVisible] = useState(false);
@@ -246,7 +247,6 @@ const RestoreDataComponent = ({ close, setRestoring, restoring }) => {
       await db.backup.import(backup, password, key);
     });
     await db.initCollections();
-    initialize();
     refreshAllStores();
     ToastManager.show({
       heading: "Backup restored successfully.",
@@ -384,10 +384,20 @@ const RestoreDataComponent = ({ close, setRestoring, restoring }) => {
         return;
       }
       try {
+        useUserStore.setState({
+          disableAppLockRequests: true
+        });
+        console.log("disabled...");
         const file = await DocumentPicker.pickSingle({
           copyTo: "cachesDirectory"
         });
 
+        setTimeout(() => {
+          useUserStore.setState({
+            disableAppLockRequests: false
+          });
+        }, 1000);
+
         if (file.name.endsWith(".nnbackupz")) {
           setRestoring(true);
           await restoreFromZip(file.fileCopyUri, true);
@@ -399,6 +409,11 @@ const RestoreDataComponent = ({ close, setRestoring, restoring }) => {
         }
       } catch (e) {
         console.log("error", e.stack);
+        setTimeout(() => {
+          useUserStore.setState({
+            disableAppLockRequests: false
+          });
+        }, 1000);
         setRestoring(false);
         backupError(e);
       }
@@ -415,7 +430,7 @@ const RestoreDataComponent = ({ close, setRestoring, restoring }) => {
         borderRadius: 0,
         flexDirection: "row",
         borderBottomWidth: 0.5,
-        borderBottomColor: colors.secondary.background
+        borderBottomColor: colors.primary.border
       }}
     >
       <View

apps/mobile/app/components/sheets/sort/index.js

@@ -50,7 +50,7 @@ const Sort = ({ type, screen }) => {
   const setOrderBy = async () => {
     let _groupOptions = {
       ...groupOptions,
-      sortDirection: groupOptions.sortDirection === "asc" ? "desc" : "asc"
+      sortDirection: groupOptions?.sortDirection === "asc" ? "desc" : "asc"
     };
     if (type === "topics") {
       _groupOptions.groupBy = "none";
@@ -85,7 +85,7 @@ const Sort = ({ type, screen }) => {
 
         <Button
           title={
-            groupOptions.sortDirection === "asc"
+            groupOptions?.sortDirection === "asc"
               ? groupOptions.groupBy === "abc" ||
                 groupOptions.sortBy === "title"
                 ? "A - Z"
@@ -100,7 +100,7 @@ const Sort = ({ type, screen }) => {
               : "New - Old"
           }
           icon={
-            groupOptions.sortDirection === "asc"
+            groupOptions?.sortDirection === "asc"
               ? "sort-ascending"
               : "sort-descending"
           }
@@ -127,7 +127,7 @@ const Sort = ({ type, screen }) => {
           justifyContent: "flex-start",
           flexWrap: "wrap",
           borderBottomWidth: isTopicSheet ? 0 : 1,
-          borderBottomColor: colors.secondary.background,
+          borderBottomColor: colors.primary.border,
           marginBottom: 12,
           paddingHorizontal: 12,
           paddingBottom: 12,
@@ -229,7 +229,7 @@ const Sort = ({ type, screen }) => {
 
                   if (item === "abc") {
                     _groupOptions.sortBy = "title";
-                    _groupOptions.sortDirection = "asc";
+                    _groupOptions.sortDirection = "desc";
                   }
 
                   updateGroupOptions(_groupOptions);

apps/mobile/app/components/sheets/update/index.js

@@ -170,6 +170,7 @@ export const Update = ({ version: appVersion, fwdRef }) => {
                   lineHeight: 20,
                   marginTop: 10
                 }}
+                selectable
               >
                 {version.body}
               </Paragraph>
@@ -181,6 +182,7 @@ export const Update = ({ version: appVersion, fwdRef }) => {
                 style={{
                   marginBottom: 5
                 }}
+                selectable
               >
                 • {item}
               </Paragraph>

apps/mobile/app/components/side-menu/color-section.tsx

@@ -43,6 +43,10 @@ export const ColorSection = React.memo(
     ]);
     const loading = useSettingStore((state) => state.isAppLoading);
     const setColorNotes = useMenuStore((state) => state.setColorNotes);
+    const [order, hiddensItems] = useMenuStore((state) => [
+      state.order["colors"],
+      state.hiddenItems["colors"]
+    ]);
 
     useEffect(() => {
       if (!loading) {
@@ -59,8 +63,8 @@ export const ColorSection = React.memo(
           db.settings.setSideBarHiddenItems("colors", data);
         }}
         disableDefaultDrag={true}
-        itemOrder={db.settings.getSideBarOrder("colors")}
-        hiddenItems={db.settings.getSideBarHiddenItems("colors")}
+        itemOrder={order}
+        hiddenItems={hiddensItems}
         alwaysBounceVertical={false}
         data={colorNotes}
         style={{

apps/mobile/app/components/side-menu/index.tsx

@@ -19,15 +19,13 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import { useThemeColors } from "@notesnook/theme";
 import React, { useCallback } from "react";
-import { FlatList, View } from "react-native";
-import { notesnook } from "../../../e2e/test.ids";
+import { View } from "react-native";
+import { DraxProvider, DraxScrollView } from "react-native-drax";
 import { db } from "../../common/database";
 import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
-import { DDS } from "../../services/device-detection";
 import { eSendEvent } from "../../services/event-manager";
-import Navigation from "../../services/navigation";
+import { useMenuStore } from "../../stores/use-menu-store";
 import { useSettingStore } from "../../stores/use-setting-store";
-import { useThemeStore } from "../../stores/use-theme-store";
 import { useUserStore } from "../../stores/use-user-store";
 import { SUBSCRIPTION_STATUS } from "../../utils/constants";
 import { eOpenPremiumDialog } from "../../utils/events";
@@ -49,30 +47,14 @@ export const SideMenu = React.memo(
     );
     const isAppLoading = useSettingStore((state) => state.isAppLoading);
     const dragging = useSideBarDraggingStore((state) => state.dragging);
+    const [order, hiddensItems] = useMenuStore((state) => [
+      state.order["routes"],
+      state.hiddenItems["routes"]
+    ]);
 
     const introCompleted = useSettingStore(
       (state) => state.settings.introCompleted
     );
-    const BottomItemsList = [
-      {
-        name: isDark ? "Day" : "Night",
-        icon: "theme-light-dark",
-        func: () => {
-          useThemeStore.getState().setColorScheme();
-        },
-        switch: true,
-        on: !!isDark,
-        close: false
-      },
-      {
-        name: "Settings",
-        icon: "cog-outline",
-        close: true,
-        func: () => {
-          Navigation.navigate("Settings");
-        }
-      }
-    ];
 
     const pro = {
       name: "Notesnook Pro",
@@ -92,8 +74,8 @@ export const SideMenu = React.memo(
             onHiddenItemsChanged={(data) => {
               db.settings.setSideBarHiddenItems("routes", data);
             }}
-            itemOrder={db.settings.getSideBarOrder("routes")}
-            hiddenItems={db.settings.getSideBarHiddenItems("routes")}
+            itemOrder={order}
+            hiddenItems={hiddensItems}
             alwaysBounceVertical={false}
             data={MenuItemsList}
             style={{
@@ -115,7 +97,7 @@ export const SideMenu = React.memo(
           <PinnedSection />
         </>
       ),
-      []
+      [order, hiddensItems]
     );
 
     return !isAppLoading && introCompleted ? (
@@ -134,16 +116,12 @@ export const SideMenu = React.memo(
             paddingTop: insets.top
           }}
         >
-          <FlatList
-            alwaysBounceVertical={false}
-            contentContainerStyle={{
-              flexGrow: 1
-            }}
-            showsVerticalScrollIndicator={false}
-            data={[0]}
-            keyExtractor={() => "mainMenuView"}
-            renderItem={renderItem}
-          />
+          <DraxProvider>
+            <DraxScrollView nestedScrollEnabled={false}>
+              {renderItem()}
+            </DraxScrollView>
+          </DraxProvider>
+
           <View
             style={{
               paddingHorizontal: 12
@@ -153,26 +131,6 @@ export const SideMenu = React.memo(
             subscriptionType === SUBSCRIPTION_STATUS.BASIC ? (
               <MenuItem testID={pro.name} key={pro.name} item={pro} index={0} />
             ) : null}
-
-            {BottomItemsList.slice(DDS.isLargeTablet() ? 0 : 1, 3).map(
-              (item, index) => (
-                <MenuItem
-                  testID={
-                    item.name == "Night mode"
-                      ? notesnook.ids.menu.nightmode
-                      : item.name
-                  }
-                  key={item.name}
-                  item={item}
-                  index={index}
-                  rightBtn={
-                    DDS.isLargeTablet() || item.name === "Notesnook Pro"
-                      ? undefined
-                      : BottomItemsList[0]
-                  }
-                />
-              )
-            )}
           </View>
 
           {dragging ? (
@@ -204,14 +162,7 @@ export const SideMenu = React.memo(
               />
             </View>
           ) : (
-            <View
-              style={{
-                width: "100%",
-                paddingHorizontal: 0
-              }}
-            >
-              <UserStatus />
-            </View>
+            <UserStatus />
           )}
         </View>
       </View>

apps/mobile/app/components/side-menu/pinned-section.tsx

@@ -44,7 +44,7 @@ export const PinnedSection = React.memo(
     const menuPins = useMenuStore((state) => state.menuPins);
     const loading = useSettingStore((state) => state.isAppLoading);
     const setMenuPins = useMenuStore((state) => state.setMenuPins);
-
+    const [order] = useMenuStore((state) => [state.order["shortcuts"]]);
     useEffect(() => {
       if (!loading) {
         setMenuPins();
@@ -61,7 +61,13 @@ export const PinnedSection = React.memo(
         Navigation.closeDrawer();
       });
     };
-    const renderItem = ({ item }: { item: Notebook | Tag; index: number }) => {
+    const renderItem = ({
+      item,
+      index
+    }: {
+      item: Notebook | Tag;
+      index: number;
+    }) => {
       return <PinItem item={item} onPress={onPress} />;
     };
 
@@ -77,7 +83,7 @@ export const PinnedSection = React.memo(
           }}
           onHiddenItemsChanged={(data) => {}}
           canHideItems={false}
-          itemOrder={db.settings.getSideBarOrder("shortcuts")}
+          itemOrder={order}
           hiddenItems={[]}
           alwaysBounceVertical={false}
           data={menuPins}
@@ -94,7 +100,10 @@ export const PinnedSection = React.memo(
             <Notice
               size="small"
               type="information"
-              text="Add shortcuts for notebooks, topics and tags here."
+              text="Add shortcuts for notebooks and tags here."
+              style={{
+                marginHorizontal: 12
+              }}
             />
           }
         />

apps/mobile/app/components/side-menu/user-status.js

@@ -25,19 +25,20 @@ import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
 import useSyncProgress from "../../hooks/use-sync-progress";
 import { eSendEvent } from "../../services/event-manager";
+import Navigation from "../../services/navigation";
 import Sync from "../../services/sync";
+import { useThemeStore } from "../../stores/use-theme-store";
 import { SyncStatus, useUserStore } from "../../stores/use-user-store";
 import { eOpenLoginDialog } from "../../utils/events";
 import { tabBarRef } from "../../utils/global-refs";
 import { SIZE } from "../../utils/size";
+import { IconButton } from "../ui/icon-button";
 import { Pressable } from "../ui/pressable";
 import { TimeSince } from "../ui/time-since";
 import Paragraph from "../ui/typography/paragraph";
 
-const PROFILE_PIC_URL = `https://picsum.photos/id/177/367/267`;
-
 export const UserStatus = () => {
-  const { colors } = useThemeColors();
+  const { colors, isDark } = useThemeColors();
   const user = useUserStore((state) => state.user);
   const syncing = useUserStore((state) => state.syncing);
   const lastSyncStatus = useUserStore((state) => state.lastSyncStatus);
@@ -55,7 +56,8 @@ export const UserStatus = () => {
         alignSelf: "center",
         paddingBottom: Platform.OS === "ios" ? insets.bottom / 2 : null,
         borderTopWidth: 1,
-        borderTopColor: colors.secondary.background
+        borderTopColor: colors.primary.border,
+        backgroundColor: colors.primary.background
       }}
     >
       <View
@@ -66,13 +68,9 @@ export const UserStatus = () => {
         }}
       >
         <Pressable
-          onPress={async () => {
-            if (user) {
-              Sync.run();
-            } else {
-              tabBarRef.current?.closeDrawer();
-              eSendEvent(eOpenLoginDialog);
-            }
+          onPress={() => {
+            Navigation.navigate("Settings");
+            tabBarRef.current.closeDrawer();
           }}
           type="plain"
           style={{
@@ -80,7 +78,8 @@ export const UserStatus = () => {
             justifyContent: "flex-start",
             padding: 12,
             borderRadius: 0,
-            alignItems: "center"
+            alignItems: "center",
+            gap: 10
           }}
         >
           {userProfile?.profilePicture ? (
@@ -91,11 +90,19 @@ export const UserStatus = () => {
               style={{
                 width: 35,
                 height: 35,
-                borderRadius: 100,
-                marginRight: 10
+                borderRadius: 100
               }}
             />
-          ) : null}
+          ) : (
+            <Icon
+              name="cog-outline"
+              size={SIZE.lg - 2}
+              color={colors.secondary.icon}
+              style={{
+                paddingLeft: 8
+              }}
+            />
+          )}
 
           <View
             style={{
@@ -104,22 +111,12 @@ export const UserStatus = () => {
             }}
           >
             <Paragraph
-              style={{
-                flexWrap: "wrap"
-              }}
+              numberOfLines={1}
               size={SIZE.sm}
               color={colors.primary.heading}
             >
-              {!user
-                ? "Login to sync your notes."
-                : lastSyncStatus === SyncStatus.Failed
-                ? "Sync failed, tap to retry"
-                : syncing
-                ? `Syncing your notes${
-                    progress ? ` (${progress.current})` : ""
-                  }`
-                : !userProfile?.fullName
-                ? "Tap to sync"
+              {!user || !userProfile?.fullName
+                ? "Settings"
                 : userProfile.fullName}
             </Paragraph>
 
@@ -134,16 +131,20 @@ export const UserStatus = () => {
                 "Not logged in"
               ) : lastSynced && lastSynced !== "Never" ? (
                 <>
-                  {lastSyncStatus === SyncStatus.Failed
+                  {syncing
+                    ? `Syncing ${progress ? `(${progress.current})` : ""}`
+                    : lastSyncStatus === SyncStatus.Failed
                     ? "Sync failed"
                     : "Synced"}{" "}
-                  <TimeSince
-                    style={{
-                      fontSize: SIZE.xs,
-                      color: colors.secondary.paragraph
-                    }}
-                    time={lastSynced}
-                  />
+                  {!syncing ? (
+                    <TimeSince
+                      style={{
+                        fontSize: SIZE.xs,
+                        color: colors.secondary.paragraph
+                      }}
+                      time={lastSynced}
+                    />
+                  ) : null}
                   {isOffline ? " (offline)" : ""}
                 </>
               ) : (
@@ -151,7 +152,7 @@ export const UserStatus = () => {
               )}{" "}
               <Icon
                 name="checkbox-blank-circle"
-                size={11}
+                size={9}
                 allowFontScaling
                 color={
                   !user || lastSyncStatus === SyncStatus.Failed
@@ -164,25 +165,80 @@ export const UserStatus = () => {
             </Paragraph>
           </View>
 
-          {user ? (
-            syncing ? (
-              <ActivityIndicator color={colors.primary.accent} size={SIZE.xl} />
-            ) : lastSyncStatus === SyncStatus.Failed ? (
-              <Icon
-                color={colors.error.icon}
-                name="sync-alert"
-                size={SIZE.lg}
-                allowFontScaling
-              />
-            ) : (
-              <Icon
-                allowFontScaling
-                color={colors.primary.accent}
-                name="sync"
-                size={SIZE.lg}
-              />
-            )
-          ) : null}
+          <View
+            style={{
+              flexDirection: "row",
+              gap: 0
+            }}
+          >
+            <IconButton
+              hitSlop={{
+                top: 10,
+                bottom: 10
+              }}
+              onPress={() => {
+                useThemeStore.getState().setColorScheme();
+              }}
+              name="theme-light-dark"
+              color={isDark ? colors.primary.accent : colors.primary.icon}
+              size={SIZE.lg}
+              style={{
+                borderRadius: 100,
+                width: 40,
+                height: 40
+              }}
+            />
+
+            <Pressable
+              style={{
+                borderRadius: 100,
+                width: 40,
+                height: 40
+              }}
+              hitSlop={{
+                top: 10,
+                bottom: 10
+              }}
+              onPress={() => {
+                if (user) {
+                  Sync.run();
+                } else {
+                  tabBarRef.current?.closeDrawer();
+                  eSendEvent(eOpenLoginDialog);
+                }
+              }}
+            >
+              {user ? (
+                syncing ? (
+                  <ActivityIndicator
+                    color={colors.primary.accent}
+                    size={SIZE.xl}
+                  />
+                ) : lastSyncStatus === SyncStatus.Failed ? (
+                  <Icon
+                    color={colors.error.icon}
+                    name="sync-alert"
+                    size={SIZE.lg}
+                    allowFontScaling
+                  />
+                ) : (
+                  <Icon
+                    allowFontScaling
+                    color={colors.primary.icon}
+                    name="sync"
+                    size={SIZE.lg}
+                  />
+                )
+              ) : (
+                <Icon
+                  allowFontScaling
+                  color={colors.primary.accent}
+                  size={SIZE.lg}
+                  name="login"
+                />
+              )}
+            </Pressable>
+          </View>
         </Pressable>
       </View>
     </View>

apps/mobile/app/components/tabs/index.tsx

@@ -59,7 +59,7 @@ export interface TabsRef {
   lock: () => boolean;
   openDrawer: (animated?: boolean) => void;
   closeDrawer: (animated?: boolean) => void;
-  page: number;
+  page: () => number;
   setScrollEnabled: () => true;
   isDrawerOpen: () => boolean;
   node: RefObject<Animated.View>;
@@ -121,7 +121,12 @@ export const FluidTabs = forwardRef<TabsRef, TabProps>(function FluidTabs(
       } else {
         if (prevWidths.current?.sidebar !== widths.sidebar) {
           translateX.value =
-            !appState || appState?.movedAway ? widths.sidebar : editorPosition;
+            !appState || (appState && appState?.movedAway)
+              ? widths.sidebar
+              : editorPosition;
+          if (translateX.value === editorPosition) {
+            onChangeTab?.({ i: 2, from: 1 });
+          }
         }
       }
       isLoaded.current = true;
@@ -234,7 +239,7 @@ export const FluidTabs = forwardRef<TabsRef, TabProps>(function FluidTabs(
         onDrawerStateChange(false);
         isDrawerOpen.value = false;
       },
-      page: currentTab.value,
+      page: () => currentTab.value,
       setScrollEnabled: () => true,
       node: node
     }),

apps/mobile/app/components/ui/sheet/index.js

@@ -28,6 +28,7 @@ import { Toast } from "../../toast";
 import { useAppState } from "../../../hooks/use-app-state";
 import SettingsService from "../../../services/settings";
 import { useUserStore } from "../../../stores/use-user-store";
+import { getContainerBorder } from "../../../utils/colors";
 
 /**
  *
@@ -73,9 +74,17 @@ const SheetWrapper = ({
       borderTopLeftRadius: 15,
       alignSelf: "center",
       borderBottomRightRadius: 0,
-      borderBottomLeftRadius: 0
+      borderBottomLeftRadius: 0,
+      ...getContainerBorder(colors.primary.border, 0.5),
+      borderBottomWidth: 0
     };
-  }, [colors.primary.background, largeTablet, smallTablet, width]);
+  }, [
+    colors.primary.background,
+    colors.primary.border,
+    largeTablet,
+    smallTablet,
+    width
+  ]);
 
   const _onOpen = () => {
     if (lockEvents.current) return;

apps/mobile/app/components/walkthroughs/walkthroughs.tsx

@@ -129,9 +129,9 @@ const notebooks: { id: string; steps: TStep[] } = {
       }
     },
     {
-      title: "Notebook > Topic > Notes",
-      text: "Every Notebook has various topics which are like sections that hold all your notes.",
-      walkthroughItem: (colors: ThemeStore["colors"]) => (
+      title: "Notebook > Notes",
+      text: "Every Notebook can have notes and sub notebooks.",
+      walkthroughItem: (colors: any) => (
         <View
           style={{
             width: "100%",
@@ -245,7 +245,7 @@ const notebooks: { id: string; steps: TStep[] } = {
     },
     {
       title: "Easy access",
-      text: "You can create shortcuts of frequently accessed notebooks or topics in Side Menu",
+      text: "You can create shortcuts of frequently accessed notebooks in the side menu",
       walkthroughItem: () => (
         <View
           style={{

apps/mobile/app/features.ts

@@ -19,4 +19,35 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import { FeatureType } from "./components/sheets/new-feature";
 
-export const features: FeatureType[] = [];
+export const features: FeatureType[] = [
+  {
+    title: "Bi-directional note linking",
+    body: "Now you can link notes to each other in both directions."
+  },
+  {
+    title: "Tabs",
+    body: "Tabs allow you to have multiple notes open at the same time. You can switch between them easily."
+  },
+  {
+    title: "Nested notebooks",
+    body: "You can now create notebooks inside other notebooks."
+  },
+  {
+    title: "At-rest encryption",
+    body: "Your notes are now encrypted when stored on the device."
+  },
+  {
+    title: "Material You themed icon",
+    body: "The app now has a Material You themed icon that changes color based on the wallpaper.",
+    platform: "android"
+  },
+  {
+    title: "New note quick settings tile",
+    body: "You can now add a new note tile to quickly create notes from quick settings panel.",
+    platform: "android"
+  },
+  {
+    title: "And so much more...",
+    body: "V3 packs so much that it's hard to put everything here, check out our blog at Notesnook V3 is here, and it's packed with new features and improvements such as bi-directional note linking, better syncing, at-rest encryption, nested notebooks, editor tabs, better app lock and so much more. https://blog.notesnook.com/introducing-notesnook-v3."
+  }
+];

apps/mobile/app/hooks/use-actions.tsx

@@ -67,6 +67,7 @@ import { convertNoteToText } from "../utils/note-to-text";
 import { sleep } from "../utils/time";
 import { ReferencesList } from "../components/sheets/references";
 import { createInternalLink } from "@notesnook/core";
+import { MoveNotebookSheet } from "../components/sheets/move-notebook";
 
 export const useActions = ({
   close,
@@ -197,19 +198,22 @@ export const useActions = ({
       paragraph: "Change the title of the tag " + item.title,
       positivePress: async (value: string) => {
         if (!value || value === "" || value.trimStart().length == 0) return;
+        try {
+          await db.tags.add({
+            id: item.id,
+            title: value
+          });
 
-        await db.tags.add({
-          id: item.id,
-          title: value
-        });
-
-        eSendEvent(Navigation.routeNames.TaggedNotes);
-        InteractionManager.runAfterInteractions(() => {
-          useTagStore.getState().refresh();
-          useMenuStore.getState().setMenuPins();
-          Navigation.queueRoutesForUpdate();
-          useRelationStore.getState().update();
-        });
+          eSendEvent(Navigation.routeNames.TaggedNotes);
+          InteractionManager.runAfterInteractions(() => {
+            useTagStore.getState().refresh();
+            useMenuStore.getState().setMenuPins();
+            Navigation.queueRoutesForUpdate();
+            useRelationStore.getState().update();
+          });
+        } catch (e) {
+          ToastManager.error(e as Error, undefined, "local");
+        }
       },
       input: true,
       defaultValue: item.title,
@@ -487,6 +491,14 @@ export const useActions = ({
         func: () => {
           MoveNotes.present(item);
         }
+      },
+      {
+        id: "move-notebook",
+        title: "Move notebook",
+        icon: "arrow-right-bold-box-outline",
+        func: () => {
+          MoveNotebookSheet.present([item]);
+        }
       }
     );
   }
@@ -736,41 +748,45 @@ export const useActions = ({
     }
 
     async function copyContent() {
-      if (processingId.current === "copyContent") {
-        ToastManager.show({
-          heading: "Please wait...",
-          message: "We are preparing your note for copy to clipboard",
-          context: "local"
-        });
-        return;
-      }
-      if (!checkItemSynced()) return;
-      if (locked) {
-        close();
-        await sleep(300);
-        openVault({
-          copyNote: true,
-          novault: true,
-          locked: true,
-          item: item,
-          title: "Copy note",
-          description: "Unlock note to copy to clipboard."
-        });
-      } else {
-        processingId.current = "copyContent";
-
-        const text = await convertNoteToText(item as Note, true);
-        if (!text) {
-          ToastManager.error(new Error(Errors.export("text")));
+      try {
+        if (processingId.current === "copyContent") {
+          ToastManager.show({
+            heading: "Please wait...",
+            message: "We are preparing your note for copy to clipboard",
+            context: "local"
+          });
           return;
         }
-        Clipboard.setString(text);
-        processingId.current = undefined;
-        ToastManager.show({
-          heading: "Note copied to clipboard",
-          type: "success",
-          context: "local"
-        });
+
+        if (locked) {
+          close();
+          await sleep(300);
+          openVault({
+            copyNote: true,
+            novault: true,
+            locked: true,
+            item: item,
+            title: "Copy note",
+            description: "Unlock note to copy to clipboard."
+          });
+        } else {
+          processingId.current = "copyContent";
+          const text = await convertNoteToText(item as Note, true);
+          if (!text) {
+            ToastManager.error(new Error(Errors.export("text")));
+            return;
+          }
+          Clipboard.setString(text);
+          processingId.current = undefined;
+          ToastManager.show({
+            heading: "Note copied to clipboard",
+            type: "success",
+            context: "local"
+          });
+        }
+      } catch (e) {
+        console.error(e);
+        ToastManager.error(e as Error);
       }
     }
 

apps/mobile/app/hooks/use-app-events.tsx

@@ -17,12 +17,14 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
+import { User } from "@notesnook/core";
 import {
   EV,
   EVENTS,
   SYNC_CHECK_IDS,
   SyncStatusEvent
 } from "@notesnook/core/dist/common";
+import { EventManagerSubscription } from "@notesnook/core/dist/utils/event-manager";
 import notifee from "@notifee/react-native";
 import NetInfo, {
   NetInfoState,
@@ -44,10 +46,6 @@ import RNBootSplash from "react-native-bootsplash";
 import { checkVersion } from "react-native-check-version";
 import Config from "react-native-config";
 import * as RNIap from "react-native-iap";
-import { User } from "@notesnook/core";
-import { EventManagerSubscription } from "@notesnook/core/dist/utils/event-manager";
-//@ts-ignore
-import { enabled } from "react-native-privacy-snapshot";
 import { DatabaseLogger, db, setupDatabase } from "../common/database";
 import { MMKV } from "../common/database/mmkv";
 import Migrate from "../components/sheets/migrate";
@@ -75,6 +73,7 @@ import {
   setRecoveryKeyMessage,
   setUpdateAvailableMessage
 } from "../services/message";
+import Notifications from "../services/notifications";
 import PremiumService from "../services/premium";
 import SettingsService from "../services/settings";
 import Sync from "../services/sync";
@@ -84,8 +83,8 @@ import { useMessageStore } from "../stores/use-message-store";
 import { useSettingStore } from "../stores/use-setting-store";
 import { SyncStatus, useUserStore } from "../stores/use-user-store";
 import { updateStatusBarColor } from "../utils/colors";
+import { BETA } from "../utils/constants";
 import {
-  eClearEditor,
   eCloseSheet,
   eLoginSessionExpired,
   eOnLoadNote,
@@ -97,8 +96,6 @@ import {
 import { getGithubVersion } from "../utils/github-version";
 import { tabBarRef } from "../utils/global-refs";
 import { sleep } from "../utils/time";
-import Notifications from "../services/notifications";
-import { BETA } from "../utils/constants";
 
 const onCheckSyncStatus = async (type: SyncStatusEvent) => {
   const { disableSync, disableAutoSync } = SettingsService.get();
@@ -246,19 +243,19 @@ async function checkForShareExtensionLaunchedInBackground() {
 }
 
 async function saveEditorState() {
-  if (editorState().currentlyEditing) {
+  if (!editorState().movedAway) {
     const id = useTabStore.getState().getCurrentNoteId();
     const note = id ? await db.notes.note(id) : undefined;
     const locked = note && (await db.vaults.itemExists(note));
     if (locked) return;
     const state = JSON.stringify({
       editing: editorState().currentlyEditing,
-      note: note,
       movedAway: editorState().movedAway,
       timestamp: Date.now()
     });
-
     MMKV.setString("appState", state);
+  } else {
+    MMKV.removeItem("appState");
   }
 }
 
@@ -390,7 +387,7 @@ export const useAppEvents = () => {
         setUser(user);
 
         useUserStore.setState({
-          profile: await db.user.getProfile()
+          profile: db.settings.getProfile()
         });
 
         if (SettingsService.get().sessionExpired) {
@@ -513,18 +510,8 @@ export const useAppEvents = () => {
 
     const onAppStateChanged = async (state: AppStateStatus) => {
       if (state === "active") {
-        if (SettingsService.shouldLockAppOnEnterForeground()) {
-          useUserStore.getState().lockApp(true);
-        }
-
         notifee.setBadgeCount(0);
         updateStatusBarColor();
-        if (
-          !SettingsService.canLockAppInBackground() &&
-          !SettingsService.get().privacyScreen
-        ) {
-          enabled(false);
-        }
 
         checkAutoBackup();
         await reconnectSSE();
@@ -544,13 +531,6 @@ export const useAppEvents = () => {
         //@ts-ignore
         globalThis["IS_SHARE_EXTENSION"] = false;
       } else {
-        SettingsService.appEnteredBackground();
-        const id = useTabStore.getState().getCurrentNoteId();
-        const note = id ? await db.notes.note(id) : undefined;
-        const locked = note && (await db.vaults.itemExists(note));
-        if (locked && SettingsService.canLockAppInBackground()) {
-          eSendEvent(eClearEditor);
-        }
         await saveEditorState();
         if (
           SettingsService.canLockAppInBackground() &&
@@ -558,7 +538,8 @@ export const useAppEvents = () => {
           !useUserStore.getState().appLocked &&
           !useUserStore.getState().disableAppLockRequests
         ) {
-          if (SettingsService.getProperty("appLockTimer") === 0) {
+          if (SettingsService.shouldLockAppOnEnterForeground()) {
+            DatabaseLogger.log(`AppEvents: Locking app on enter background`);
             useUserStore.getState().lockApp(true);
           }
 
@@ -569,13 +550,6 @@ export const useAppEvents = () => {
             Keyboard.dismiss();
           }
         }
-        if (
-          (SettingsService.get().privacyScreen ||
-            SettingsService.canLockAppInBackground()) &&
-          !useSettingStore.getState().requestBiometrics
-        ) {
-          enabled(true);
-        }
       }
     };
 
@@ -698,6 +672,9 @@ export const useAppEvents = () => {
 
     if (db.isInitialized) {
       Notifications.setupReminders(true);
+      if (SettingsService.get().notifNotes) {
+        Notifications.pinQuickNote(false);
+      }
       useSettingStore.getState().setAppLoading(false);
       DatabaseLogger.info("Database initialized");
     }

apps/mobile/app/hooks/use-db-item.ts

@@ -71,12 +71,10 @@ export const useDBItem = <T extends keyof ItemTypeKey>(
       if (typeof itemId === "string" && itemId !== itemIdRef.current) return;
       if (!isValidIdOrIndex(idOrIndex)) return;
 
-      console.log("useDBItem.onUpdateItem", idOrIndex, type);
-
       if (items && typeof idOrIndex === "number") {
         items.item(idOrIndex).then((item) => {
           setItem(item.item);
-          itemIdRef.current = item.item.id;
+          itemIdRef.current = item.item?.id;
         });
       } else {
         if (!(db as any)[type + "s"][type]) {

apps/mobile/app/hooks/use-notebook.ts

@@ -36,7 +36,6 @@ export const useNotebook = (
 
   const onRequestUpdate = React.useCallback(() => {
     if (!item?.id) return;
-    console.log("useNotebook.onRequestUpdate", item?.id, Date.now());
 
     const selector = db.relations.from(
       {
@@ -59,7 +58,6 @@ export const useNotebook = (
 
   useEffect(() => {
     if (nestedNotebooks) {
-      console.log("useNotebook.useEffect.onRequestUpdate");
       onRequestUpdate();
     }
   }, [item?.id, onRequestUpdate, nestedNotebooks]);

apps/mobile/app/hooks/use-vault-status.ts

@@ -18,7 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import React, { useCallback, useEffect } from "react";
-import BiometicService from "../services/biometrics";
+import BiometricService from "../services/biometrics";
 import { eSubscribeEvent, eUnSubscribeEvent } from "../services/event-manager";
 import { db } from "../common/database";
 
@@ -39,8 +39,8 @@ export const useVaultStatus = () => {
 
   const checkVaultStatus = useCallback(() => {
     db.vault?.exists().then(async (exists) => {
-      const available = await BiometicService.isBiometryAvailable();
-      const fingerprint = await BiometicService.hasInternetCredentials();
+      const available = await BiometricService.isBiometryAvailable();
+      const fingerprint = await BiometricService.hasInternetCredentials();
       if (
         VaultStatusCache.exists === exists &&
         VaultStatusCache.biometryEnrolled === fingerprint &&

apps/mobile/app/navigation/tabs-holder.js

@@ -64,6 +64,8 @@ import { useSettingStore } from "../stores/use-setting-store";
 import {
   eClearEditor,
   eCloseFullscreenEditor,
+  eOnEnterEditor,
+  eOnExitEditor,
   eOnLoadNote,
   eOpenFullscreenEditor,
   eUnlockNote
@@ -164,9 +166,7 @@ const _TabsHolder = () => {
             _deviceMode === "smallTablet"
               ? dimensions.width -
                 valueLimiter(dimensions.width * 0.4, 300, 450)
-              : dimensions.width > 1100
-              ? dimensions.width * 0.55
-              : dimensions.width * 0.5,
+              : dimensions.width * 0.48,
           zIndex: null,
           paddingHorizontal: 0
         }
@@ -257,9 +257,7 @@ const _TabsHolder = () => {
           position: "relative",
           width:
             current === "tablet"
-              ? size.width > 1100
-                ? size.width * 0.55
-                : size.width * 0.5
+              ? size.width * 0.48
               : current === "smallTablet"
               ? size.width - valueLimiter(size.width * 0.4, 300, 450)
               : size.width,
@@ -271,6 +269,9 @@ const _TabsHolder = () => {
     if (!needsUpdate) {
       return;
     }
+
+    const state = getAppState();
+
     setTimeout(() => {
       switch (current) {
         case "tablet":
@@ -285,7 +286,8 @@ const _TabsHolder = () => {
           break;
         case "mobile":
           if (
-            !editorState().movedAway &&
+            state &&
+            !state?.movedAway &&
             useTabStore.getState().getCurrentNoteId()
           ) {
             tabBarRef.current?.goToIndex(2, false);
@@ -367,15 +369,9 @@ const _TabsHolder = () => {
       editor: dimensions.width - valueLimiter(dimensions.width * 0.4, 300, 450)
     },
     tablet: {
-      sidebar:
-        dimensions.width > 1100
-          ? dimensions.width * 0.15
-          : dimensions.width * 0.2,
+      sidebar: dimensions.width * 0.22,
       list: dimensions.width * 0.3,
-      editor:
-        dimensions.width > 1100
-          ? dimensions.width * 0.55
-          : dimensions.width * 0.5
+      editor: dimensions.width * 0.48
     }
   };
 
@@ -511,11 +507,13 @@ const _TabsHolder = () => {
 };
 export const TabHolder = React.memo(_TabsHolder, () => true);
 
-const onChangeTab = async (obj) => {
-  if (obj.i === 2) {
+const onChangeTab = async (event) => {
+  if (event.i === 2) {
     editorState().movedAway = false;
     editorState().isFocused = true;
     activateKeepAwake();
+    eSendEvent(eOnEnterEditor);
+
     if (!useTabStore.getState().getCurrentNoteId()) {
       eSendEvent(eOnLoadNote, {
         newNote: true
@@ -524,16 +522,15 @@ const onChangeTab = async (obj) => {
       if (
         useTabStore.getState().getTab(useTabStore.getState().currentTab).locked
       ) {
-        console.log("Unlocking note....");
         eSendEvent(eUnlockNote);
       }
     }
   } else {
-    if (obj.from === 2) {
+    if (event.from === 2) {
       deactivateKeepAwake();
       editorState().movedAway = true;
       editorState().isFocused = false;
-      eSendEvent(eClearEditor, "removeHandler");
+      eSendEvent(eOnExitEditor);
 
       // Lock all tabs with locked notes...
       for (const tab of useTabStore.getState().tabs) {