ci: fix release workflow

enabled

.commitlintrc.js

@@ -20,6 +20,7 @@ const SCOPES = [
   "logger",
   "theme",
   "core",
+  "clipper",
   "config",
   "ci",
   "setup",

.eslintignore

@@ -18,6 +18,7 @@ apps/web/public/an.js
 
 # editor
 packages/editor/styles/
+packages/editor/languages/
 
 # editor mobile
 packages/editor-mobile/build.bundle

.eslintrc.js

@@ -2,7 +2,7 @@ const LICENSE = [
   "",
   "This file is part of the Notesnook project (https://notesnook.com/)",
   "",
-  "Copyright (C) 2022 Streetwriters (Private) Limited",
+  "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",

.github/workflows/android.publish.internal.yml

@@ -0,0 +1,64 @@
+name: Publish @notesnook/android-internal
+
+on: workflow_dispatch
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    timeout-minutes: 40
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - uses: actions/setup-node@master
+        with:
+          node-version: '16'
+          cache: 'npm'
+          cache-dependency-path: |
+            apps/mobile/package-lock.json
+            apps/web/package-lock.json
+            packages/core/package-lock.json
+            packages/crypto/package-lock.json
+            packages/crypto-worker/package-lock.json
+            packages/editor-mobile/package-lock.json
+            packages/editor/package-lock.json
+            packages/logger/package-lock.json
+            packages/streamable-fs/package-lock.json
+            packages/theme/package-lock.json
+
+      - name: Use specific Java version for the builds
+        uses: joschi/setup-jdk@v2
+        with:
+          java-version: '11'
+          architecture: 'x64'
+
+      - name: Install node modules
+        run: |
+          npm ci
+      - name: Make Gradlew Executable
+        run: cd apps/mobile/native/android && chmod +x ./gradlew
+
+      - name: Build unsigned app bundle
+        run: yarn release:android:bundle
+
+      - name: Sign app bundle for Playstore release
+        id: sign_app
+        uses: r0adkll/sign-android-release@v1
+        with:
+          releaseDirectory: apps/mobile/native/android/app/build/outputs/bundle/release
+          signingKeyBase64: ${{ secrets.SIGNING_KEY }}
+          alias: ${{ secrets.ALIAS }}
+          keyStorePassword: ${{ secrets.KEY_PASSWORD }}
+          keyPassword: ${{ secrets.KEY_PASSWORD }}   
+
+      - name: Publish to Playstore
+        id: deploy
+        uses: r0adkll/upload-google-play@v1
+        with:
+          serviceAccountJsonPlainText: ${{ secrets.SERVICE_ACCOUNT_JSON }}
+          packageName: com.streetwriters.notesnook
+          releaseFile: ${{steps.sign_app.outputs.signedReleaseFile}}
+          track: internal
+          status: completed
+          whatsNewDirectory: apps/mobile/native/android/releasenotes/             

.github/workflows/android.publish.yml

@@ -95,7 +95,7 @@ jobs:
 
       - name: Publish to Playstore
         id: deploy
-        uses: r0adkll/upload-google-play@v1
+        uses: r0adkll/upload-google-play@v1.1.1
         with:
           serviceAccountJsonPlainText: ${{ secrets.SERVICE_ACCOUNT_JSON }}
           packageName: com.streetwriters.notesnook

.github/workflows/core.tests.yml

@@ -45,9 +45,10 @@ jobs:
           npm ci --prefer-offline --no-audit
       - name: Add environment variables
         run: |
-          echo "EMAIL=${{ secrets.USER_EMAIL }}" >> $GITHUB_ENV
-          echo "PASSWORD='${{ secrets.USER_PASSWORD }}'" >> $GITHUB_ENV
-          echo "HASHED_PASSWORD=${{ secrets.USER_HASHED_PASSWORD }}" >> $GITHUB_ENV
+          echo "USER_EMAIL=${{ secrets.USER_EMAIL }}" >> $GITHUB_ENV
+          echo "USER_PASSWORD=${{ secrets.USER_PASSWORD }}" >> $GITHUB_ENV
+          echo "USER_TOTP_SECRET=${{ secrets.USER_TOTP_SECRET }}" >> $GITHUB_ENV
+          echo "USER_HASHED_PASSWORD=${{ secrets.USER_HASHED_PASSWORD }}" >> $GITHUB_ENV
           echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
 
       - name: Run all @notesnook/core tests

.github/workflows/desktop.publish.yml

@@ -127,7 +127,9 @@ jobs:
           path: ./apps/web/desktop/build
 
       - name: Install packages
-        run: npm i
+        run: |
+          npm i
+          npm i dmg-license
         working-directory: ./apps/web/desktop
       
       - name: Install provisioning profile

.github/workflows/web.tests.yml

@@ -63,7 +63,7 @@ jobs:
     name: 🧪 Test (${{ matrix.shard }}/${{ strategy.job-total }})
     strategy:
       matrix:
-        shard: [1, 2, 3]
+        shard: [1, 2, 3, 4]
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
@@ -95,7 +95,7 @@ jobs:
       - name: Install packages
         run: |
           npm i --ignore-scripts --prefer-offline --no-audit
-          npm install -D @playwright/test
+          npm install -D @playwright/test otplib
 
       - name: Validate build extraction
         run: ls -ld ./apps/web/build/index.html
@@ -107,8 +107,9 @@ jobs:
       - name: Add environment variables
         run: |
           echo "USER_EMAIL=${{ secrets.USER_EMAIL }}" >> $GITHUB_ENV
-          echo "CURRENT_USER_PASSWORD=${{ secrets.USER_PASSWORD }}" >> $GITHUB_ENV
-          echo "CURRENT_USER_KEY=${{ secrets.USER_KEY }}" >> $GITHUB_ENV
+          echo "USER_PASSWORD=${{ secrets.USER_PASSWORD }}" >> $GITHUB_ENV
+          echo "USER_TOTP_SECRET=${{ secrets.USER_TOTP_SECRET }}" >> $GITHUB_ENV
+          echo "USER_KEY=${{ secrets.USER_KEY }}" >> $GITHUB_ENV
 
       - name: Run tests
         run: npx playwright test --shard=${{ matrix.shard }}/${{ strategy.job-total }}

.gitignore

@@ -3,4 +3,7 @@ coverage
 node_modules
 dist
 .DS_STORE
-nx-cloud.env
+nx-cloud.env
+.idea
+.eslintcache
+.env.local

.prettierrc.js

@@ -4,5 +4,6 @@ module.exports = {
   semi: true,
   printWidth: 80,
   useTabs: false,
-  tabWidth: 2
+  tabWidth: 2,
+  bracketSpacing: true
 };

.vscode/extensions.json

@@ -0,0 +1,11 @@
+{
+  // See https://go.microsoft.com/fwlink/?LinkId=827846
+  // for the documentation about the extensions.json format
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "ms-playwright.playwright",
+    "firefox-devtools.vscode-firefox-debug",
+    "msjsdiag.vscode-react-native"
+  ]
+}

.vscode/notesnook.code-workspace

@@ -0,0 +1,72 @@
+{
+  "folders": [
+    {
+      "name": "✨ notesnook",
+      "path": ".."
+    },
+    {
+      "name": "🚀 @notesnook/mobile",
+      "path": "../apps/mobile"
+    },
+    {
+      "name": "🚀 @notesnook/web",
+      "path": "../apps/web"
+    },
+    {
+      "name": "🚀 @notesnook/desktop",
+      "path": "../apps/web/desktop"
+    },
+    {
+      "name": "🚀 @notesnook/web-clipper",
+      "path": "../extensions/web-clipper"
+    },
+    {
+      "name": "📦 @notesnook/clipper",
+      "path": "../packages/clipper"
+    },
+    {
+      "name": "📦 @notesnook/core",
+      "path": "../packages/core"
+    },
+    {
+      "name": "📦 @notesnook/crypto",
+      "path": "../packages/crypto"
+    },
+    {
+      "name": "📦 @notesnook/crypto-worker",
+      "path": "../packages/crypto-worker"
+    },
+    {
+      "name": "📦 @notesnook/editor",
+      "path": "../packages/editor"
+    },
+    {
+      "name": "📦 @notesnook/editor-mobile",
+      "path": "../packages/editor-mobile"
+    },
+    {
+      "name": "📦 @notesnook/logger",
+      "path": "../packages/logger"
+    },
+    {
+      "name": "📦 @notesnook/streamable-fs",
+      "path": "../packages/streamable-fs"
+    },
+    {
+      "name": "📦 @notesnook/theme",
+      "path": "../packages/theme"
+    }
+  ],
+  "settings": {
+    "typescript.tsdk": "node_modules/typescript/lib",
+    "javascript.format.enable": true,
+    "editor.formatOnSave": true,
+    "editor.formatOnSaveMode": "modificationsIfAvailable",
+    "eslint.packageManager": "npm",
+    "eslint.run": "onSave",
+    "[javascript]": {
+      "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "eslint.execArgv": ["--cache"]
+  }
+}

.vscode/settings.json

@@ -1,3 +0,0 @@
-{
-  "typescript.tsdk": "node_modules/typescript/lib"
-}

AUTHORS

@@ -1,3 +1,4 @@
 Notesnook is written & maintained by:
   - Abdullah Atta <abdullahatta@streetwriters.co>
   - Ammar Ahmed <ammarahmed6506@gmail.com>
+  - Muhammad Ali <alihamuh@gmail.com>

CONTRIBUTING.md

@@ -28,12 +28,6 @@ If you've thought of a way that Notesnook could be better, we want to hear about
 
 Before you open a new feature request, please make sure it's not a duplicate. **Duplicate feature requests & bug reports are closed immediately.**
 
-### Improving documentation
-
-All app related documentation can be found in the `docs/` directory. All the files in this directory are simple markdown files which you can edit either directly on GitHub, or in your favorite text editor.
-
-If you find a mistake in the documentation or would like to contribute something new to the documentation, feel free to open a pull request; creating an issue for this is not required.
-
 ### Helping out in the issue tracker
 
 There are always new issues getting opened that need to be triaged, sorted & organized, so the developers can easily find the most critical and/or relevant bugs to fix. Any help in this regard is appreciated.
@@ -91,7 +85,11 @@ The DCO is a declaration attached to every contribution made by every developer
 Signed-off-by: Jane Smith <jane.smith@email.com>
 ```
 
-You may type this line on your own when writing your commit messages. However, if your [user.name](http://user.name) and [user.email](http://user.email) are set in your git configs, you can use `-s` or `--signoff` to add the `Signed-off-by` line to the end of the commit message.
+On VSCode, it looks like this:
+
+![](resources/vscode-signed-off-commit.png)
+
+You may type this line on your own when writing your commit messages. However, if your [user.name](http://user.name) and [user.email](http://user.email) are set in your git configs, you can use `-s` or `--signoff` to add the `Signed-off-by` line to the end of the commit message automatically.
 
 #### Include `<scope>:` in your commit message
 

apps/mobile/.vscode/launch.json

@@ -25,4 +25,4 @@
       "request": "attach"
     }
   ]
-}
+}

apps/mobile/app/app.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -16,7 +16,7 @@ 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 "react-native-gesture-handler";
 import React, { useEffect } from "react";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { SafeAreaProvider } from "react-native-safe-area-context";
@@ -31,6 +31,16 @@ import { TipManager } from "./services/tip-manager";
 import { useUserStore } from "./stores/use-user-store";
 import { View } from "react-native";
 import { useState } from "react";
+import NetInfo from "@react-native-community/netinfo";
+//import { BackgroundSync } from "./services/background-sync";
+Notifications.init();
+NetInfo.configure({
+  reachabilityUrl: "https://notesnook.com",
+  reachabilityTest: (response) => {
+    if (!response) return false;
+    return response?.status >= 200 && response?.status < 300;
+  }
+});
 
 SettingsService.init();
 SettingsService.checkOrientation();
@@ -42,6 +52,7 @@ const App = () => {
     if (appLockMode && appLockMode !== "none") {
       useUserStore.getState().setVerifyUser(true);
     }
+    //BackgroundSync.start();
     setInit(true);
     setTimeout(async () => {
       SettingsService.onFirstLaunch();

apps/mobile/app/assets/images/assets.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/common/analytics/index.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -21,7 +21,7 @@ import { Platform } from "react-native";
 import "react-native-get-random-values";
 import * as Keychain from "react-native-keychain";
 import { generateSecureRandom } from "react-native-securerandom";
-import Sodium from "react-native-sodium";
+import Sodium from "@ammarahmed/react-native-sodium";
 
 const KEYSTORE_CONFIG = Platform.select({
   ios: {

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -25,10 +25,12 @@ import filesystem from "../filesystem";
 import EventSource from "../../utils/sse/even-source-ios";
 import AndroidEventSource from "../../utils/sse/event-source";
 import Storage, { KV } from "./storage";
+import * as Gzip from "react-native-gzip";
+
 const LoggerStorage = new MMKVLoader()
   .withInstanceID("notesnook_logs")
   .initialize();
-initalize(new KV(LoggerStorage));
+initalize(new KV(LoggerStorage), true);
 export const DatabaseLogger = dbLogger;
 
 /**
@@ -37,7 +39,11 @@ export const DatabaseLogger = dbLogger;
 export var db = new Database(
   Storage,
   Platform.OS === "ios" ? EventSource : AndroidEventSource,
-  filesystem
+  filesystem,
+  {
+    compress: Gzip.deflate,
+    decompress: Gzip.inflate
+  }
 );
 
 db.host(
@@ -48,11 +54,11 @@ db.host(
         SSE_HOST: "https://events.streetwriters.co",
         SUBSCRIPTIONS_HOST: "https://subscriptions.streetwriters.co",
         ISSUES_HOST: "https://issues.streetwriters.co"
-        // API_HOST: 'http://192.168.10.29:5264',
-        // AUTH_HOST: 'http://192.168.10.29:8264',
-        // SSE_HOST: 'http://192.168.10.29:7264',
-        // SUBSCRIPTIONS_HOST: 'http://192.168.10.29:9264',
-        // ISSUES_HOST: 'http://192.168.10.29:2624'
+        // API_HOST: "http://192.168.8.101:5264",
+        // AUTH_HOST: "http://192.168.8.101:8264",
+        // SSE_HOST: "http://192.168.8.101:7264",
+        // SUBSCRIPTIONS_HOST: "http://192.168.8.101:9264",
+        // ISSUES_HOST: "http://192.168.8.101:2624"
       }
     : {
         API_HOST: "https://api.notesnook.com",

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/common/filesystem/download-attachment.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -20,7 +20,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React from "react";
 import { Platform } from "react-native";
 import * as ScopedStorage from "react-native-scoped-storage";
-import Sodium from "react-native-sodium";
+import Sodium from "@ammarahmed/react-native-sodium";
 import RNFetchBlob from "rn-fetch-blob";
 import { ShareComponent } from "../../components/sheets/export-notes/share";
 import { presentSheet, ToastEvent } from "../../services/event-manager";
@@ -68,7 +68,7 @@ export default async function downloadAttachment(hash, global = true) {
       chunkSize: attachment.chunkSize
     };
 
-    let fileUri = await Sodium.decryptFile(key, info, false);
+    let fileUri = await Sodium.decryptFile(key, info, "file");
     ToastEvent.show({
       heading: "Download successful",
       message: attachment.metadata.filename + " downloaded",

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -17,10 +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 {
-  checkAttachment, downloadFile,
-  getUploadedFileSize
-} from "./download";
+import { checkAttachment, downloadFile, getUploadedFileSize } from "./download";
 import {
   clearFileStorage,
   deleteFile,

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -18,7 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import { Platform } from "react-native";
-import Sodium from "react-native-sodium";
+import Sodium from "@ammarahmed/react-native-sodium";
 import RNFetchBlob from "rn-fetch-blob";
 import { cacheDir, getRandomId } from "./utils";
 
@@ -36,13 +36,12 @@ export async function readEncrypted(filename, key, cipherData) {
         ...cipherData,
         hash: filename
       },
-      true
+      cipherData.outputType === "base64" ? "base64" : "text"
     );
     return output;
   } catch (e) {
     RNFetchBlob.fs.unlink(path).catch(console.log);
     console.log(e);
-    console.log("error");
     return false;
   }
 }

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/common/logger/index.ts

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/announcement.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/body.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/cta.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -23,10 +23,7 @@ import { Linking, View } from "react-native";
 import { eSendEvent, presentSheet } from "../../services/event-manager";
 import Sync from "../../services/sync";
 import { useThemeStore } from "../../stores/use-theme-store";
-import {
-  eCloseAnnouncementDialog,
-  eCloseProgressDialog
-} from "../../utils/events";
+import { eCloseAnnouncementDialog, eCloseSheet } from "../../utils/events";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import { PricingPlans } from "../premium/pricing-plans";
@@ -60,11 +57,11 @@ export const Cta = ({ actions, style = {}, color, inline }) => {
         )
       });
     } else if (item.type === "force-sync") {
-      eSendEvent(eCloseProgressDialog);
+      eSendEvent(eCloseSheet);
       await sleep(300);
       Progress.present();
       Sync.run("global", true, true, () => {
-        eSendEvent(eCloseProgressDialog);
+        eSendEvent(eCloseSheet);
       });
     }
   };

apps/mobile/app/components/announcements/description.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/functions.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/list.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/photo.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/subheading.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/announcements/title.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -35,10 +35,7 @@ import PremiumService from "../../services/premium";
 import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { formatBytes } from "../../utils";
-import {
-  eCloseAttachmentDialog,
-  eCloseProgressDialog
-} from "../../utils/events";
+import { eCloseAttachmentDialog, eCloseSheet } from "../../utils/events";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import { Dialog } from "../dialog";
@@ -71,7 +68,7 @@ const Actions = ({ attachment, setAttachments, fwdRef }) => {
           useAttachmentStore.getState().remove(attachment.metadata.hash);
         }
         downloadAttachment(attachment.metadata.hash, false);
-        eSendEvent(eCloseProgressDialog, contextId);
+        eSendEvent(eCloseSheet, contextId);
       },
       icon: "download"
     },
@@ -150,7 +147,7 @@ const Actions = ({ attachment, setAttachments, fwdRef }) => {
       onPress: async () => {
         await db.attachments.remove(attachment.metadata.hash, false);
         setAttachments([...db.attachments.all]);
-        eSendEvent(eCloseProgressDialog, contextId);
+        eSendEvent(eCloseSheet, contextId);
       },
       icon: "delete-outline"
     }
@@ -230,16 +227,18 @@ const Actions = ({ attachment, setAttachments, fwdRef }) => {
             {formatBytes(attachment.length)}
           </Paragraph>
 
-          <Paragraph
-            style={{
-              marginRight: 10
-            }}
-            size={SIZE.xs + 1}
-            color={colors.icon}
-          >
-            {attachment.noteIds.length} note
-            {attachment.noteIds.length > 1 ? "s" : ""}
-          </Paragraph>
+          {attachment.noteIds ? (
+            <Paragraph
+              style={{
+                marginRight: 10
+              }}
+              size={SIZE.xs + 1}
+              color={colors.icon}
+            >
+              {attachment.noteIds.length} note
+              {attachment.noteIds.length > 1 ? "s" : ""}
+            </Paragraph>
+          ) : null}
           <Paragraph
             onPress={() => {
               Clipboard.setString(attachment.metadata.hash);
@@ -291,7 +290,7 @@ const Actions = ({ attachment, setAttachments, fwdRef }) => {
                     });
                     return;
                   }
-                  eSendEvent(eCloseProgressDialog, contextId);
+                  eSendEvent(eCloseSheet, contextId);
                   await sleep(150);
                   eSendEvent(eCloseAttachmentDialog);
                   await sleep(300);

apps/mobile/app/components/attachments/attachment-item.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/auth/auth-modal.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/auth/change-password.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -26,7 +26,7 @@ import {
   ToastEvent
 } from "../../services/event-manager";
 import { useUserStore } from "../../stores/use-user-store";
-import { eCloseProgressDialog } from "../../utils/events";
+import { eCloseSheet } from "../../utils/events";
 import DialogHeader from "../dialog/dialog-header";
 import { Button } from "../ui/button";
 import Input from "../ui/input";
@@ -72,7 +72,7 @@ export const ChangePassword = () => {
         context: "global"
       });
       setLoading(false);
-      eSendEvent(eCloseProgressDialog);
+      eSendEvent(eCloseSheet);
     } catch (e) {
       setLoading(false);
       ToastEvent.show({

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/auth/forgot-password.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -97,6 +97,9 @@ export const ForgotPassword = () => {
             text: email.current
           });
         }}
+        indicatorStyle={{
+          width: 100
+        }}
         gestureEnabled
         id="forgotpassword_sheet"
       >

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -17,18 +17,13 @@ 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, { useEffect, useRef, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { View } from "react-native";
 import { SheetManager } from "react-native-actions-sheet";
 import Animated, { FadeInDown, FadeOutUp } from "react-native-reanimated";
-import { db } from "../../common/database";
 import { DDS } from "../../services/device-detection";
-import { eSendEvent, ToastEvent } from "../../services/event-manager";
-import { clearMessage } from "../../services/message";
-import PremiumService from "../../services/premium";
-import SettingsService from "../../services/settings";
+import { eSendEvent } from "../../services/event-manager";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { useUserStore } from "../../stores/use-user-store";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import BaseDialog from "../dialog/base-dialog";
@@ -42,101 +37,48 @@ import Paragraph from "../ui/typography/paragraph";
 import { SVG } from "./background";
 import { hideAuth } from "./common";
 import { ForgotPassword } from "./forgot-password";
-import TwoFactorVerification from "./two-factor";
+import { useLogin } from "./use-login";
+
+const LoginSteps = {
+  emailAuth: 1,
+  mfaAuth: 2,
+  passwordAuth: 3
+};
+
 export const Login = ({ changeMode }) => {
   const colors = useThemeStore((state) => state.colors);
-  const email = useRef();
-  const emailInputRef = useRef();
-  const passwordInputRef = useRef();
-  const password = useRef();
   const [focused, setFocused] = useState(false);
-  const [error, setError] = useState(false);
-  const [loading, setLoading] = useState(false);
-
-  const setUser = useUserStore((state) => state.setUser);
-
-  const validateInfo = () => {
-    if (!password.current || !email.current) {
-      ToastEvent.show({
-        heading: "All fields required",
-        message: "Fill all the fields and try again",
-        type: "error",
-        context: "local"
-      });
-
-      return false;
-    }
-
-    return true;
-  };
+  const {
+    step,
+    setStep,
+    password,
+    email,
+    emailInputRef,
+    passwordInputRef,
+    loading,
+    setLoading,
+    setError,
+    login
+  } = useLogin(async () => {
+    hideAuth();
+    eSendEvent("userLoggedIn", true);
+    await sleep(500);
+    Progress.present();
+  });
 
   useEffect(() => {
     async () => {
+      setStep(LoginSteps.emailAuth);
       await sleep(500);
       emailInputRef.current?.focus();
       setFocused(true);
     };
+    return () => {
+      setStep(LoginSteps.emailAuth);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const login = async (mfa, callback) => {
-    if (!validateInfo() || error) return;
-    setLoading(true);
-    let user;
-    try {
-      if (mfa) {
-        await db.user.mfaLogin(
-          email.current.toLowerCase(),
-          password.current,
-          mfa
-        );
-      } else {
-        await db.user.login(email.current.toLowerCase(), password.current);
-      }
-      callback && callback(true);
-
-      user = await db.user.getUser();
-      if (!user) throw new Error("Email or password incorrect!");
-      PremiumService.setPremiumStatus();
-      setUser(user);
-      clearMessage();
-      ToastEvent.show({
-        heading: "Login successful",
-        message: `Logged in as ${user.email}`,
-        type: "success",
-        context: "global"
-      });
-      hideAuth();
-      SettingsService.set({
-        sessionExpired: false,
-        userEmailConfirmed: user?.isEmailConfirmed
-      });
-      eSendEvent("userLoggedIn", true);
-      await sleep(500);
-      Progress.present();
-    } catch (e) {
-      callback && callback(false);
-      if (e.message === "Multifactor authentication required.") {
-        setLoading(false);
-        await sleep(300);
-        TwoFactorVerification.present(async (mfa) => {
-          if (mfa) {
-            await login(mfa);
-          } else {
-            setLoading(false);
-          }
-        }, e.data);
-      } else {
-        setLoading(false);
-        ToastEvent.show({
-          heading: user ? "Failed to sync" : "Login failed",
-          message: e.message,
-          type: "error",
-          context: "local"
-        });
-      }
-    }
-  };
-
   return (
     <>
       <ForgotPassword />
@@ -228,48 +170,54 @@ export const Login = ({ changeMode }) => {
             autoCorrect={false}
             autoCapitalize="none"
             errorMessage="Email is invalid"
-            placeholder="Email"
+            placeholder="Enter your email"
+            defaultValue={email.current}
+            editable={step === LoginSteps.emailAuth}
             onSubmit={() => {
               passwordInputRef.current?.focus();
             }}
           />
 
-          <Input
-            fwdRef={passwordInputRef}
-            onChangeText={(value) => {
-              password.current = value;
-            }}
-            testID="input.password"
-            returnKeyLabel="Done"
-            returnKeyType="done"
-            secureTextEntry
-            autoComplete="password"
-            autoCapitalize="none"
-            autoCorrect={false}
-            placeholder="Password"
-            marginBottom={0}
-            onSubmit={() => login()}
-          />
-          <Button
-            title="Forgot your password?"
-            style={{
-              alignSelf: "flex-end",
-              height: 30,
-              paddingHorizontal: 0
-            }}
-            onPress={() => {
-              SheetManager.show("forgotpassword_sheet", email.current);
-            }}
-            textStyle={{
-              textDecorationLine: "underline"
-            }}
-            fontSize={SIZE.xs}
-            type="gray"
-          />
+          {step === LoginSteps.passwordAuth && (
+            <>
+              <Input
+                fwdRef={passwordInputRef}
+                onChangeText={(value) => {
+                  password.current = value;
+                }}
+                testID="input.password"
+                returnKeyLabel="Done"
+                returnKeyType="done"
+                secureTextEntry
+                autoComplete="password"
+                autoCapitalize="none"
+                autoCorrect={false}
+                placeholder="Password"
+                marginBottom={0}
+                defaultValue={password.current}
+                onSubmit={() => login()}
+              />
+              <Button
+                title="Forgot your password?"
+                style={{
+                  alignSelf: "flex-end",
+                  height: 30,
+                  paddingHorizontal: 0
+                }}
+                onPress={() => {
+                  SheetManager.show("forgotpassword_sheet", email.current);
+                }}
+                textStyle={{
+                  textDecorationLine: "underline"
+                }}
+                fontSize={SIZE.xs}
+                type="gray"
+              />
+            </>
+          )}
 
           <View
             style={{
-              // position: 'absolute',
               marginTop: 25,
               alignSelf: "center"
             }}
@@ -280,11 +228,36 @@ export const Login = ({ changeMode }) => {
                 borderRadius: 100
               }}
               loading={loading}
-              onPress={() => login()}
-              //  width="100%"
+              onPress={login}
               type="accent"
-              title={loading ? null : "Login to your account"}
+              title={
+                loading
+                  ? null
+                  : step === LoginSteps.emailAuth
+                  ? "Login"
+                  : "Continue"
+              }
             />
+
+            {step === LoginSteps.passwordAuth && (
+              <Button
+                title="Cancel logging in"
+                style={{
+                  alignSelf: "center",
+                  height: 30,
+                  marginTop: 10
+                }}
+                onPress={() => {
+                  setStep(LoginSteps.emailAuth);
+                  setLoading(false);
+                }}
+                textStyle={{
+                  textDecorationLine: "underline"
+                }}
+                fontSize={SIZE.xs}
+                type="errorShade"
+              />
+            )}
           </View>
         </View>
       </Animated.View>

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -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, { useEffect, useRef, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { Modal, View } from "react-native";
 import { db } from "../../common/database";
 import BiometricService from "../../services/biometrics";
@@ -27,27 +27,23 @@ import {
   eUnSubscribeEvent,
   ToastEvent
 } from "../../services/event-manager";
-import { clearMessage } from "../../services/message";
-import PremiumService from "../../services/premium";
 import SettingsService from "../../services/settings";
 import Sync from "../../services/sync";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { useUserStore } from "../../stores/use-user-store";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import { Dialog } from "../dialog";
 import { presentDialog } from "../dialog/functions";
 import SheetProvider from "../sheet-provider";
-import { Progress } from "../sheets/progress";
 import { Toast } from "../toast";
 import { Button } from "../ui/button";
 import { IconButton } from "../ui/icon-button";
 import Input from "../ui/input";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
-import TwoFactorVerification from "./two-factor";
+import { LoginSteps, useLogin } from "./use-login";
 
-function getEmail(email) {
+function getObfuscatedEmail(email) {
   if (!email) return null;
   return email.replace(/(.{2})(.*)(?=@)/, function (gp1, gp2, gp3) {
     for (let i = 0; i < gp3.length; i++) {
@@ -59,15 +55,14 @@ function getEmail(email) {
 
 export const SessionExpired = () => {
   const colors = useThemeStore((state) => state.colors);
-  const email = useRef();
-  const passwordInputRef = useRef();
-  const password = useRef();
   const [visible, setVisible] = useState(false);
   const [focused, setFocused] = useState(false);
-
-  const setUser = useUserStore((state) => state.setUser);
-
-  const [loading, setLoading] = useState(false);
+  const { step, password, email, passwordInputRef, loading, login } = useLogin(
+    () => {
+      eSendEvent("userLoggedIn", true);
+      setVisible(false);
+    }
+  );
 
   const logout = async () => {
     try {
@@ -92,9 +87,9 @@ export const SessionExpired = () => {
       eUnSubscribeEvent("session_expired", open);
       setFocused(false);
     };
-  }, [visible]);
+  }, [visible, open]);
 
-  const open = async () => {
+  const open = React.useCallback(async () => {
     try {
       let res = await db.user.tokenManager.getToken();
       if (!res) throw new Error("no token found");
@@ -120,64 +115,8 @@ export const SessionExpired = () => {
       email.current = user.email;
       setVisible(true);
     }
-  };
+  }, [email]);
 
-  const login = async (mfa, callback) => {
-    setLoading(true);
-    let user;
-    try {
-      if (mfa) {
-        await db.user.mfaLogin(
-          email.current.toLowerCase(),
-          password.current,
-          mfa
-        );
-      } else {
-        await db.user.login(email.current.toLowerCase(), password.current);
-      }
-      callback && callback(true);
-      setVisible(false);
-      user = await db.user.getUser();
-      if (!user) throw new Error("Email or password incorrect!");
-      PremiumService.setPremiumStatus();
-      setUser(user);
-      clearMessage();
-      ToastEvent.show({
-        heading: "Login successful",
-        message: `Logged in as ${user.email}`,
-        type: "success",
-        context: "global"
-      });
-      await SettingsService.set({
-        sessionExpired: false,
-        userEmailConfirmed: user?.isEmailConfirmed
-      });
-      eSendEvent("userLoggedIn", true);
-      await sleep(500);
-      Progress.present();
-      setLoading(false);
-    } catch (e) {
-      callback && callback(false);
-      if (e.message === "Multifactor authentication required.") {
-        TwoFactorVerification.present(async (mfa) => {
-          if (mfa) {
-            await login(mfa);
-          } else {
-            setLoading(false);
-          }
-        }, e.data);
-      } else {
-        console.log(e.stack);
-        setLoading(false);
-        ToastEvent.show({
-          heading: user ? "Failed to sync" : "Login failed",
-          message: e.message,
-          type: "error",
-          context: "local"
-        });
-      }
-    }
-  };
   return (
     visible && (
       <Modal
@@ -194,7 +133,8 @@ export const SessionExpired = () => {
             width: focused ? "100%" : "99.9%",
             padding: 12,
             justifyContent: "center",
-            flex: 1
+            flex: 1,
+            backgroundColor: colors.bg
           }}
         >
           <View
@@ -225,29 +165,32 @@ export const SessionExpired = () => {
               }}
             >
               Your session on this device has expired. Please enter password for{" "}
-              {getEmail(email.current)} to continue.
+              {getObfuscatedEmail(email.current)} to continue.
             </Paragraph>
           </View>
 
-          <Input
-            fwdRef={passwordInputRef}
-            onChangeText={(value) => {
-              password.current = value;
-            }}
-            returnKeyLabel="Next"
-            returnKeyType="next"
-            secureTextEntry
-            autoComplete="password"
-            autoCapitalize="none"
-            autoCorrect={false}
-            placeholder="Password"
-            onSubmit={() => login()}
-          />
+          {step === LoginSteps.passwordAuth ? (
+            <Input
+              fwdRef={passwordInputRef}
+              onChangeText={(value) => {
+                password.current = value;
+              }}
+              returnKeyLabel="Next"
+              returnKeyType="next"
+              secureTextEntry
+              autoComplete="password"
+              autoCapitalize="none"
+              autoCorrect={false}
+              placeholder="Password"
+              onSubmit={() => login()}
+            />
+          ) : null}
 
           <Button
             style={{
               marginTop: 10,
-              width: "100%"
+              width: 250,
+              borderRadius: 100
             }}
             loading={loading}
             onPress={() => login()}

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -20,7 +20,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React, { useRef, useState } from "react";
 import { Dimensions, View } from "react-native";
 import Animated, { FadeInDown, FadeOutUp } from "react-native-reanimated";
-import umami from "../../common/analytics";
 import { db } from "../../common/database";
 import { DDS } from "../../services/device-detection";
 import { ToastEvent } from "../../services/event-manager";
@@ -79,7 +78,6 @@ export const Signup = ({ changeMode, trial }) => {
       clearMessage();
       setEmailVerifyMessage();
       hideAuth();
-      umami.pageView("/account-created", "/welcome/signup");
       await sleep(300);
       if (trial) {
         PremiumService.sheet(null, null, true);

apps/mobile/app/components/auth/two-factor.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -27,7 +27,7 @@ import {
   ToastEvent
 } from "../../services/event-manager";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { eCloseProgressDialog } from "../../utils/events";
+import { eCloseSheet } from "../../utils/events";
 import { SIZE } from "../../utils/size";
 import { Button } from "../ui/button";
 import { IconButton } from "../ui/icon-button";
@@ -54,7 +54,7 @@ const TwoFactorVerification = ({ onMfaLogin, mfaInfo }) => {
     app: "Enter the 6 digit code from your authenticator app to continue logging in",
     sms: "Enter the 6 digit code sent to your phone number to continue logging in",
     email: "Enter the 6 digit code sent to your email to continue logging in",
-    recoveryCode: "Enter the 8 digit recovery code to continue logging in"
+    recoveryCode: "Enter the recovery code to continue logging in"
   };
 
   const secondaryMethodsText = {
@@ -65,9 +65,7 @@ const TwoFactorVerification = ({ onMfaLogin, mfaInfo }) => {
   };
 
   const onNext = async () => {
-    const length = currentMethod.method === "recoveryCode" ? 8 : 6;
-
-    if (!code.current || code.current.length !== length) return;
+    if (!code.current || code.current.length < 6) return;
     setLoading(true);
     inputRef.current?.blur();
     await onMfaLogin(
@@ -77,7 +75,7 @@ const TwoFactorVerification = ({ onMfaLogin, mfaInfo }) => {
       },
       (result) => {
         if (result) {
-          eSendEvent(eCloseProgressDialog, "two_factor_verify");
+          eSendEvent(eCloseSheet, "two_factor_verify");
         }
         setLoading(false);
       }
@@ -202,21 +200,24 @@ const TwoFactorVerification = ({ onMfaLogin, mfaInfo }) => {
           <>
             <Input
               placeholder={
-                currentMethod.method === "recoveryCode" ? "xxxxxxxx" : "xxxxxx"
+                currentMethod.method === "recoveryCode"
+                  ? "xxxxx-xxxxx"
+                  : "xxxxxx"
               }
-              maxLength={currentMethod.method === "recoveryCode" ? 8 : 6}
+              testID={"input.totp"}
+              maxLength={currentMethod.method === "recoveryCode" ? undefined : 6}
               fwdRef={inputRef}
               textAlign="center"
               onChangeText={(value) => {
                 code.current = value;
-                onNext();
+                //onNext();
               }}
               inputStyle={{
                 fontSize: SIZE.lg,
                 height: 60,
                 textAlign: "center",
                 letterSpacing: 10,
-                width: null
+                width: 250
               }}
               keyboardType={
                 currentMethod.method === "recoveryCode" ? "default" : "numeric"

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

@@ -0,0 +1,156 @@
+/*
+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 { useRef, useState } from "react";
+import { db } from "../../common/database";
+import { eSendEvent, ToastEvent } from "../../services/event-manager";
+import { clearMessage } from "../../services/message";
+import PremiumService from "../../services/premium";
+import SettingsService from "../../services/settings";
+import { useUserStore } from "../../stores/use-user-store";
+import { eCloseSheet } from "../../utils/events";
+import TwoFactorVerification from "./two-factor";
+
+export const LoginSteps = {
+  emailAuth: 1,
+  mfaAuth: 2,
+  passwordAuth: 3
+};
+
+export const useLogin = (onFinishLogin) => {
+  const [error, setError] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const setUser = useUserStore((state) => state.setUser);
+  const [step, setStep] = useState(LoginSteps.emailAuth);
+  const email = useRef();
+  const password = useRef();
+  const emailInputRef = useRef();
+  const passwordInputRef = useRef();
+
+  const validateInfo = () => {
+    if (
+      (!password.current && step === LoginSteps.passwordAuth) ||
+      (!email.current && step === LoginSteps.emailAuth)
+    ) {
+      ToastEvent.show({
+        heading: "All fields required",
+        message: "Fill all the fields and try again",
+        type: "error",
+        context: "local"
+      });
+
+      return false;
+    }
+
+    return true;
+  };
+
+  const login = async () => {
+    if (!validateInfo() || error) return;
+    try {
+      setLoading(true);
+      switch (step) {
+        case LoginSteps.emailAuth: {
+          const mfaInfo = await db.user.authenticateEmail(email.current);
+          if (mfaInfo) {
+            TwoFactorVerification.present(async (mfa, callback) => {
+              try {
+                const success = await db.user.authenticateMultiFactorCode(
+                  mfa.code,
+                  mfa.method
+                );
+                
+                if (success) {
+                  setStep(LoginSteps.passwordAuth);
+                  setLoading(false);
+                  setTimeout(() => {
+                    passwordInputRef.current?.focus();
+                  }, 1);
+                  callback && callback(true);
+                }
+                callback && callback(false);
+              } catch (e) {
+                callback && callback(false);
+                if (e.message === "invalid_grant") {
+                  eSendEvent(eCloseSheet, "two_factor_verify");
+                  setLoading(false);
+                  setStep(LoginSteps.emailAuth);
+                }
+              }
+            }, mfaInfo);
+          }
+          break;
+        }
+        case LoginSteps.passwordAuth: {
+          await db.user.authenticatePassword(email.current, password.current);
+          finishLogin();
+          break;
+        }
+      }
+      setLoading(false);
+    } catch (e) {
+      finishWithError(e);
+    }
+  };
+
+  const finishWithError = async (e) => {
+    if (e.message === "invalid_grant") setStep(LoginSteps.emailAuth);
+    setLoading(false);
+    ToastEvent.show({
+      heading: "Login failed",
+      message: e.message,
+      type: "error",
+      context: "local"
+    });
+  };
+
+  const finishLogin = async () => {
+    const user = await db.user.getUser();
+    if (!user) throw new Error("Email or password incorrect!");
+    PremiumService.setPremiumStatus();
+    setUser(user);
+    clearMessage();
+    ToastEvent.show({
+      heading: "Login successful",
+      message: `Logged in as ${user.email}`,
+      type: "success",
+      context: "global"
+    });
+    SettingsService.set({
+      sessionExpired: false,
+      userEmailConfirmed: user?.isEmailConfirmed
+    });
+    onFinishLogin?.();
+    setLoading(false);
+  };
+
+  return {
+    login,
+    step,
+    setStep,
+    email,
+    password,
+    passwordInputRef,
+    emailInputRef,
+    loading,
+    setLoading,
+    error,
+    setError
+  };
+};

apps/mobile/app/components/container/container-header.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -18,7 +18,8 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import React from "react";
-import { KeyboardAvoidingView, Platform, SafeAreaView } from "react-native";
+import { KeyboardAvoidingView, Platform, View } from "react-native";
+import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
 import useIsFloatingKeyboard from "../../hooks/use-is-floating-keyboard";
 import { useSettingStore } from "../../stores/use-setting-store";
 import { Header } from "../header";
@@ -28,6 +29,7 @@ export const Container = ({ children }) => {
   const introCompleted = useSettingStore(
     (state) => state.settings.introCompleted
   );
+  const insets = useGlobalSafeAreaInsets();
   return (
     <KeyboardAvoidingView
       behavior="padding"
@@ -36,10 +38,12 @@ export const Container = ({ children }) => {
         flex: 1
       }}
     >
-      <SafeAreaView
+      <View
         style={{
           flex: 1,
-          overflow: "hidden"
+          overflow: "hidden",
+          paddingTop: Platform.OS === "android" ? 0 : insets.top,
+          paddingBottom: Platform.OS === "android" ? 0 : insets.bottom
         }}
       >
         {!introCompleted ? null : (
@@ -50,7 +54,7 @@ export const Container = ({ children }) => {
         )}
 
         {children}
-      </SafeAreaView>
+      </View>
     </KeyboardAvoidingView>
   );
 };

apps/mobile/app/components/delay-layout/default-placeholder.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/delay-layout/index.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/delay-layout/settings-placeholder.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialog-provider/recievers.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialog/dialog-header.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -18,7 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import React from "react";
-import { Text, View } from "react-native";
+import { Text, View, ViewStyle } from "react-native";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { SIZE } from "../../utils/size";
 import { Button } from "../ui/button";
@@ -35,11 +35,13 @@ type DialogHeaderProps = {
     loading?: boolean;
     title?: string;
     type?: PressableButtonProps["type"];
+    icon?: string;
   };
   paragraphColor?: string;
   padding?: number;
   centered?: boolean;
   titlePart?: string;
+  style?: ViewStyle;
 };
 
 const DialogHeader = ({
@@ -49,7 +51,8 @@ const DialogHeader = ({
   paragraphColor,
   padding,
   centered,
-  titlePart
+  titlePart,
+  style
 }: DialogHeaderProps) => {
   const colors = useThemeStore((state) => state.colors);
 
@@ -61,7 +64,8 @@ const DialogHeader = ({
           alignItems: "center",
           justifyContent: "space-between",
           minHeight: 50,
-          paddingHorizontal: padding
+          paddingHorizontal: padding,
+          ...style
         }}
       >
         <View
@@ -96,6 +100,7 @@ const DialogHeader = ({
                 loading={button.loading}
                 fontSize={13}
                 title={button.title}
+                icon={button.icon}
                 type={button.type || "grayBg"}
                 height={25}
               />

apps/mobile/app/components/dialog/functions.ts

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialogs/add-topic/index.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialogs/jump-to-section/index.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialogs/loading/index.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/dialogs/result/pro-features.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -23,7 +23,7 @@ import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import { eSendEvent } from "../../../services/event-manager";
 import { useThemeStore } from "../../../stores/use-theme-store";
 import {
-  eCloseProgressDialog,
+  eCloseSheet,
   eCloseResultDialog,
   eOpenPremiumDialog
 } from "../../../utils/events";
@@ -82,7 +82,7 @@ export const ProFeatures = ({ count = 6 }) => {
       <Paragraph
         onPress={async () => {
           eSendEvent(eCloseResultDialog);
-          eSendEvent(eCloseProgressDialog);
+          eSendEvent(eCloseSheet);
           await sleep(300);
           eSendEvent(eOpenPremiumDialog);
         }}

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/exception-handler/index.tsx

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/header/left-menus.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/header/title.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -32,6 +32,7 @@ import { SIZE } from "../../utils/size";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { useCallback } from "react";
+import Tag from "../ui/tag";
 
 const titleState = {};
 
@@ -104,7 +105,8 @@ export const Title = () => {
       style={{
         opacity: 1,
         flexShrink: 1,
-        flexDirection: "row"
+        flexDirection: "row",
+        alignItems: "center"
       }}
     >
       {!hide && !isHidden ? (
@@ -135,6 +137,7 @@ export const Title = () => {
           {title}
         </Heading>
       ) : null}
+      <Tag visible={currentScreen.beta} text="BETA" />
     </View>
   );
 };

apps/mobile/app/components/image-preview/index.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -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, { useEffect } from "react";
+import React from "react";
 import {
   Dimensions,
   Image,
@@ -26,7 +26,6 @@ import {
   View
 } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
-import umami from "../../common/analytics";
 import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
 import { useNavigationFocus } from "../../hooks/use-navigation-focus";
 import { DDS } from "../../services/device-detection";
@@ -50,9 +49,6 @@ export const SVG_Z =
 
 const Intro = ({ navigation }) => {
   const colors = useThemeStore((state) => state.colors);
-  const introCompleted = useSettingStore(
-    (state) => state.settings.introCompleted
-  );
   const isTelemetryEnabled = useSettingStore(
     (state) => state.settings.telemetry
   );
@@ -64,12 +60,6 @@ const Intro = ({ navigation }) => {
     }
   });
 
-  useEffect(() => {
-    if (!introCompleted) {
-      umami.pageView("/welcome", "", []);
-    }
-  }, [introCompleted]);
-
   return (
     <View
       testID="notesnook.splashscreen"
@@ -171,8 +161,6 @@ const Intro = ({ navigation }) => {
             navigation.navigate("AppLock", {
               welcome: true
             });
-
-            umami.pageView("/home", "/welcome");
           }}
           style={{
             paddingHorizontal: 24,

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -25,11 +25,7 @@ import { enabled } from "react-native-privacy-snapshot";
 import { DatabaseLogger, db, loadDatabase } from "../../common/database";
 import { useAppState } from "../../hooks/use-app-state";
 import BiometricService from "../../services/biometrics";
-import {
-  eSendEvent,
-  presentSheet,
-  ToastEvent
-} from "../../services/event-manager";
+import { eSendEvent, presentSheet } from "../../services/event-manager";
 import { setRateAppMessage } from "../../services/message";
 import PremiumService from "../../services/premium";
 import SettingsService from "../../services/settings";
@@ -56,6 +52,8 @@ import Paragraph from "../ui/typography/paragraph";
 import { Walkthrough } from "../walkthroughs";
 import Config from "react-native-config";
 import { getGithubVersion } from "../../utils/github-version";
+import notifee from "@notifee/react-native";
+
 
 const Launcher = React.memo(
   function Launcher() {
@@ -134,6 +132,7 @@ const Launcher = React.memo(
         eSendEvent("session_expired");
         return;
       }
+      notifee.setBadgeCount(0);
       await useMessageStore.getState().setAnnouncement();
       if (NewFeature.present()) return;
       if (await checkAppUpdateAvailable()) return;
@@ -155,7 +154,7 @@ const Launcher = React.memo(
       if (__DEV__) return;
       try {
         const version =
-          Config.GITHUB_RELEASE !== "true"
+          Config.GITHUB_RELEASE === "true"
             ? await getGithubVersion()
             : await checkVersion();
         if (!version || !version?.needsUpdate) return false;
@@ -199,13 +198,7 @@ const Launcher = React.memo(
     };
 
     const onUnlockBiometrics = useCallback(async () => {
-      if (!(await BiometricService.isBiometryAvailable())) {
-        ToastEvent.show({
-          heading: "Biometrics unavailable",
-          message: "Try unlocking the app with your account password"
-        });
-        return;
-      }
+      if (!(await BiometricService.isBiometryAvailable())) return;
       let verified = await BiometricService.validateUser(
         "Unlock to access your notes",
         ""

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/list-items/headers/header.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -122,7 +122,7 @@ export const SectionHeader = React.memo(
             alignItems: "center"
           }}
         >
-          {index === 0 ? (
+          {index === 0 && (
             <>
               <Button
                 onPress={() => {
@@ -130,6 +130,7 @@ export const SectionHeader = React.memo(
                     component: <Sort screen={screen} type={type} />
                   });
                 }}
+                hidden={screen === "Reminders"}
                 tooltipText="Change sorting of items in list"
                 fwdRef={sortRef}
                 title={groupBy}
@@ -152,38 +153,35 @@ export const SectionHeader = React.memo(
                 iconPosition="right"
               />
 
-              {type === "notes" || type === "notebooks" || type === "home" ? (
-                <IconButton
-                  customStyle={{
-                    width: 25,
-                    height: 25
-                  }}
-                  testID="icon-compact-mode"
-                  tooltipText={
-                    listMode == "compact"
-                      ? "Switch to normal mode"
-                      : "Switch to compact mode"
-                  }
-                  fwdRef={compactModeRef}
-                  color={colors.icon}
-                  name={
-                    listMode == "compact" ? "view-list" : "view-list-outline"
-                  }
-                  onPress={() => {
-                    let settings = {};
-                    settings[
-                      type !== "notebooks"
-                        ? "notesListMode"
-                        : "notebooksListMode"
-                    ] = listMode === "normal" ? "compact" : "normal";
+              <IconButton
+                customStyle={{
+                  width: 25,
+                  height: 25
+                }}
+                hidden={
+                  type !== "notes" && type !== "notebooks" && type !== "home"
+                }
+                testID="icon-compact-mode"
+                tooltipText={
+                  listMode == "compact"
+                    ? "Switch to normal mode"
+                    : "Switch to compact mode"
+                }
+                fwdRef={compactModeRef}
+                color={colors.icon}
+                name={listMode == "compact" ? "view-list" : "view-list-outline"}
+                onPress={() => {
+                  let settings = {};
+                  settings[
+                    type !== "notebooks" ? "notesListMode" : "notebooksListMode"
+                  ] = listMode === "normal" ? "compact" : "normal";
 
-                    SettingsService.set(settings);
-                  }}
-                  size={SIZE.lg - 2}
-                />
-              ) : null}
+                  SettingsService.set(settings);
+                }}
+                size={SIZE.lg - 2}
+              />
             </>
-          ) : null}
+          )}
         </View>
       </View>
     );

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -17,6 +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 { getUpcomingReminder } from "@notesnook/core/collections/reminders";
 import { decode, EntityLevel } from "entities";
 import React from "react";
 import { View } from "react-native";
@@ -25,6 +26,7 @@ import { notesnook } from "../../../../e2e/test.ids";
 import { db } from "../../../common/database";
 import { TaggedNotes } from "../../../screens/notes/tagged";
 import { TopicNotes } from "../../../screens/notes/topic-notes";
+import { useRelationStore } from "../../../stores/use-relation-store";
 import { useSettingStore } from "../../../stores/use-setting-store";
 import { useThemeStore } from "../../../stores/use-theme-store";
 import { COLORS_NOTE } from "../../../utils/color-scheme";
@@ -32,6 +34,7 @@ import { SIZE } from "../../../utils/size";
 import { Properties } from "../../properties";
 import { Button } from "../../ui/button";
 import { IconButton } from "../../ui/icon-button";
+import { ReminderTime } from "../../ui/reminder-time";
 import { TimeSince } from "../../ui/time-since";
 import Heading from "../../ui/typography/heading";
 import Paragraph from "../../ui/typography/paragraph";
@@ -86,7 +89,10 @@ const NoteItem = ({
   const compactMode = notesListMode === "compact";
   const attachmentCount = db.attachments?.ofNote(item.id, "all")?.length || 0;
   const notebooks = React.useMemo(() => getNotebook(item), [item]);
-
+  const reminders = db.relations.from(item, "reminder");
+  const reminder = getUpcomingReminder(reminders);
+  const _update = useRelationStore((state) => state.updater);
+  const noteColor = COLORS_NOTE[item.color?.toLowerCase()];
   return (
     <>
       <View
@@ -102,14 +108,15 @@ const NoteItem = ({
               alignItems: "center",
               zIndex: 10,
               elevation: 10,
-              marginBottom: 2.5
+              marginBottom: 2.5,
+              flexWrap: "wrap"
             }}
           >
             {notebooks?.map((_item) => (
               <Button
                 title={_item.title}
                 key={_item}
-                height={20}
+                height={25}
                 icon="book-outline"
                 type="grayBg"
                 fontSize={SIZE.xs}
@@ -122,11 +129,23 @@ const NoteItem = ({
                   marginRight: 5,
                   borderWidth: 0.5,
                   borderColor: colors.icon,
-                  paddingHorizontal: 6
+                  paddingHorizontal: 6,
+                  marginBottom: 5
                 }}
                 onPress={() => navigateToTopic(_item.topic)}
               />
             ))}
+
+            <ReminderTime
+              reminder={reminder}
+              color={noteColor}
+              onPress={() => {
+                Properties.present(reminder);
+              }}
+              style={{
+                height: 25
+              }}
+            />
           </View>
         ) : null}
 

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -20,21 +20,21 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React from "react";
 import NoteItem from ".";
 import { notesnook } from "../../../../e2e/test.ids";
-import { useSelectionStore } from "../../../stores/use-selection-store";
-import { useTrashStore } from "../../../stores/use-trash-store";
-import { useEditorStore } from "../../../stores/use-editor-store";
+import { db } from "../../../common/database";
 import { DDS } from "../../../services/device-detection";
 import {
   eSendEvent,
+  hideSheet,
   openVault,
-  ToastEvent
+  presentSheet
 } from "../../../services/event-manager";
-import Navigation from "../../../services/navigation";
+import { useEditorStore } from "../../../stores/use-editor-store";
+import { useSelectionStore } from "../../../stores/use-selection-store";
 import { history } from "../../../utils";
-import { db } from "../../../common/database";
 import { eOnLoadNote, eShowMergeDialog } from "../../../utils/events";
 import { tabBarRef } from "../../../utils/global-refs";
 import { presentDialog } from "../../dialog/functions";
+import NotePreview from "../../note-history/preview";
 import SelectionWrapper from "../selection-wrapper";
 
 const present = () =>
@@ -44,9 +44,9 @@ const present = () =>
     paragraph: "Please sync again to open this note for editing"
   });
 
-export const openNote = async (item, isTrash, setSelectedItem) => {
+export const openNote = async (item, isTrash, setSelectedItem, isSheet) => {
   let _note = item;
-
+  if (isSheet) hideSheet();
   if (!isTrash) {
     _note = db.notes.note(item.id).data;
     if (!db.notes.note(item.id)?.synced()) {
@@ -84,39 +84,11 @@ export const openNote = async (item, isTrash, setSelectedItem) => {
     return;
   }
   if (isTrash) {
-    presentDialog({
-      title: `Restore ${item.itemType}`,
-      paragraph: `Restore or delete ${item.itemType} forever`,
-      positiveText: "Restore",
-      negativeText: "Delete",
-      positivePress: async () => {
-        await db.trash.restore(item.id);
-        Navigation.queueRoutesForUpdate(
-          "Tags",
-          "Notes",
-          "Notebooks",
-          "Favorites",
-          "Trash",
-          "TaggedNotes",
-          "ColoredNotes",
-          "TopicNotes"
-        );
-        useSelectionStore.getState().setSelectionMode(false);
-        ToastEvent.show({
-          heading: "Restore successful",
-          type: "success"
-        });
-      },
-      onClose: async () => {
-        await db.trash.delete(item.id);
-        useTrashStore.getState().setTrash();
-        useSelectionStore.getState().setSelectionMode(false);
-        ToastEvent.show({
-          heading: "Permanantly deleted items",
-          type: "success",
-          context: "local"
-        });
-      }
+    const content = await db.content.get(item.contentId);
+    presentSheet({
+      component: (
+        <NotePreview note={item} content={{ type: "tiptap", data: content }} />
+      )
     });
   } else {
     useEditorStore.getState().setReadonly(_note?.readonly);
@@ -128,7 +100,7 @@ export const openNote = async (item, isTrash, setSelectedItem) => {
 };
 
 export const NoteWrapper = React.memo(
-  function NoteWrapper({ item, index, tags, dateBy }) {
+  function NoteWrapper({ item, index, tags, dateBy, isSheet }) {
     const isTrash = item.type === "trash";
     const setSelectedItem = useSelectionStore((state) => state.setSelectedItem);
 
@@ -137,7 +109,8 @@ export const NoteWrapper = React.memo(
         index={index}
         height={100}
         testID={notesnook.ids.note.get(index)}
-        onPress={() => openNote(item, isTrash, setSelectedItem)}
+        onPress={() => openNote(item, isTrash, setSelectedItem, isSheet)}
+        isSheet={isSheet}
         item={item}
       >
         <NoteItem item={item} dateBy={dateBy} tags={tags} isTrash={isTrash} />

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -24,7 +24,7 @@ import { notesnook } from "../../../../e2e/test.ids";
 import { TopicNotes } from "../../../screens/notes/topic-notes";
 import { useSettingStore } from "../../../stores/use-setting-store";
 import { useThemeStore } from "../../../stores/use-theme-store";
-import { getTotalNotes, history } from "../../../utils";
+import { history } from "../../../utils";
 import { SIZE } from "../../../utils/size";
 import { Properties } from "../../properties";
 import { Button } from "../../ui/button";
@@ -131,16 +131,6 @@ export const NotebookItem = ({
             height: SIZE.md + 2
           }}
         >
-          <Paragraph
-            color={colors.accent}
-            size={SIZE.xs}
-            style={{
-              marginRight: 6
-            }}
-          >
-            {isTopic ? "Topic" : "Notebook"}
-          </Paragraph>
-
           {isTrash ? (
             <>
               <Paragraph

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -0,0 +1,187 @@
+/*
+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 React from "react";
+import { View } from "react-native";
+import { notesnook } from "../../../../e2e/test.ids";
+import type { Reminder } from "../../../services/notifications";
+import { useThemeStore } from "../../../stores/use-theme-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 Icon from "react-native-vector-icons/MaterialCommunityIcons";
+import ReminderSheet from "../../sheets/reminder";
+import { ReminderTime } from "../../ui/reminder-time";
+
+const ReminderItem = React.memo(
+  ({
+    item,
+    index,
+    isSheet
+  }: {
+    item: Reminder;
+    index: number;
+    isSheet: boolean;
+  }) => {
+    const colors = useThemeStore((state) => state.colors);
+    const openReminder = () => {
+      ReminderSheet.present(item, undefined, isSheet);
+    };
+    return (
+      <SelectionWrapper
+        //@ts-ignore
+        index={index}
+        height={100}
+        onPress={openReminder}
+        item={item}
+        isSheet={isSheet}
+      >
+        <View
+          style={{
+            flexShrink: 1,
+            opacity: item.disabled ? 0.5 : 1
+          }}
+        >
+          <Heading
+            numberOfLines={1}
+            style={{
+              flexWrap: "wrap"
+            }}
+            size={SIZE.md}
+          >
+            {item.title}
+          </Heading>
+
+          {item.description ? (
+            <Paragraph
+              style={{
+                flexWrap: "wrap"
+              }}
+              numberOfLines={2}
+            >
+              {item.description}
+            </Paragraph>
+          ) : null}
+
+          <View
+            style={{
+              flexDirection: "row",
+              flexWrap: "wrap"
+            }}
+          >
+            {item.disabled ? (
+              <View
+                style={{
+                  backgroundColor: colors.nav,
+                  borderRadius: 5,
+                  flexDirection: "row",
+                  paddingHorizontal: 6,
+                  alignItems: "center",
+                  marginTop: 5,
+                  justifyContent: "flex-start",
+                  alignSelf: "flex-start",
+                  marginRight: 10,
+                  height: 30
+                }}
+              >
+                <Icon
+                  name="bell-off-outline"
+                  size={SIZE.md}
+                  color={colors.errorText}
+                />
+                <Paragraph
+                  size={SIZE.xs + 1}
+                  color={colors.icon}
+                  style={{ marginLeft: 5 }}
+                >
+                  Disabled
+                </Paragraph>
+              </View>
+            ) : null}
+            {item.mode === "repeat" && item.recurringMode ? (
+              <View
+                style={{
+                  backgroundColor: colors.nav,
+                  borderRadius: 5,
+                  flexDirection: "row",
+                  paddingHorizontal: 6,
+                  alignItems: "center",
+                  marginTop: 5,
+                  justifyContent: "flex-start",
+                  alignSelf: "flex-start",
+                  marginRight: 10,
+                  height: 30
+                }}
+              >
+                <Icon name="reload" size={SIZE.md} color={colors.accent} />
+                <Paragraph
+                  size={SIZE.xs + 1}
+                  color={colors.icon}
+                  style={{ marginLeft: 5 }}
+                >
+                  {item.recurringMode.slice(0, 1).toUpperCase() +
+                    item.recurringMode.replace("y", "i").slice(1) +
+                    "ly"}
+                </Paragraph>
+              </View>
+            ) : null}
+
+            <ReminderTime
+              reminder={item}
+              checkIsActive={false}
+              fontSize={SIZE.xs + 1}
+              style={{
+                justifyContent: "flex-start",
+                borderWidth: 0,
+                height: 30,
+                alignSelf: "flex-start",
+                marginTop: 5
+              }}
+            />
+          </View>
+        </View>
+        <IconButton
+          testID={notesnook.listitem.menu}
+          color={colors.pri}
+          name="dots-horizontal"
+          size={SIZE.xl}
+          onPress={() => Properties.present(item, [], isSheet)}
+          customStyle={{
+            justifyContent: "center",
+            height: 35,
+            width: 35,
+            borderRadius: 100,
+            alignItems: "center"
+          }}
+        />
+      </SelectionWrapper>
+    );
+  },
+  (prev, next) => {
+    if (prev.item?.dateModified !== next.item?.dateModified) {
+      return false;
+    }
+    return true;
+  }
+);
+ReminderItem.displayName = "ReminderItem";
+
+export default ReminderItem;

apps/mobile/app/components/list-items/selection-wrapper/action-strip.js

@@ -1,309 +0,0 @@
-/*
-This file is part of the Notesnook project (https://notesnook.com/)
-
-Copyright (C) 2022 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 Clipboard from "@react-native-clipboard/clipboard";
-import React, { useEffect, useState } from "react";
-import { View } from "react-native";
-import Animated, { SlideInUp, SlideOutDown } from "react-native-reanimated";
-import { db } from "../../../common/database";
-import { openVault, ToastEvent } from "../../../services/event-manager";
-import Navigation from "../../../services/navigation";
-import { useMenuStore } from "../../../stores/use-menu-store";
-import { useNotebookStore } from "../../../stores/use-notebook-store";
-import { useSelectionStore } from "../../../stores/use-selection-store";
-import { useThemeStore } from "../../../stores/use-theme-store";
-import { useTrashStore } from "../../../stores/use-trash-store";
-import { dWidth, getElevation, toTXT } from "../../../utils";
-import { deleteItems } from "../../../utils/functions";
-import { presentDialog } from "../../dialog/functions";
-import { Button } from "../../ui/button";
-import { IconButton } from "../../ui/icon-button";
-
-export const ActionStrip = ({ note, setActionStrip }) => {
-  const colors = useThemeStore((state) => state.colors);
-  const selectionMode = useSelectionStore((state) => state.selectionMode);
-  const setNotebooks = useNotebookStore((state) => state.setNotebooks);
-  const setMenuPins = useMenuStore((state) => state.setMenuPins);
-  const setSelectedItem = useSelectionStore((state) => state.setSelectedItem);
-  const setSelectionMode = useSelectionStore((state) => state.setSelectionMode);
-
-  const [isPinnedToMenu, setIsPinnedToMenu] = useState(false);
-  const [width, setWidth] = useState(dWidth - 16);
-  useEffect(() => {
-    if (note.type === "note") return;
-    setIsPinnedToMenu(db.shortcuts.exists(note.id));
-  }, [note.id, note.type]);
-
-  const updateNotes = () => {
-    Navigation.queueRoutesForUpdate(
-      "Notes",
-      "Favorites",
-      "ColoredNotes",
-      "TaggedNotes",
-      "TopicNotes"
-    );
-  };
-
-  const actions = [
-    {
-      title: "Pin " + note.type,
-      icon: note.pinned ? "pin-off" : "pin",
-      visible: note.type === "note" || note.type === "notebook",
-      onPress: async () => {
-        if (!note.id) return;
-
-        if (note.type === "note") {
-          await db.notes.note(note.id).pin();
-        } else {
-          await db.notebooks.notebook(note.id).pin();
-          setNotebooks();
-        }
-        updateNotes();
-        setActionStrip(false);
-      }
-    },
-    {
-      title: "Add to favorites",
-      icon: note.favorite ? "star-off" : "star",
-      onPress: async () => {
-        if (!note.id) return;
-        if (note.type === "note") {
-          await db.notes.note(note.id).favorite();
-        } else {
-          await db.notebooks.notebook(note.id).favorite();
-        }
-        updateNotes();
-        setActionStrip(false);
-      },
-      visible: note.type === "note",
-      color: !note.favorite ? "orange" : null
-    },
-
-    {
-      title: isPinnedToMenu
-        ? "Remove Shortcut from Menu"
-        : "Add Shortcut to Menu",
-      icon: isPinnedToMenu ? "link-variant-remove" : "link-variant",
-      onPress: async () => {
-        try {
-          if (isPinnedToMenu) {
-            await db.shortcuts.remove(note.id);
-            ToastEvent.show({
-              heading: "Shortcut removed from menu",
-              type: "success"
-            });
-          } else {
-            if (note.type === "topic") {
-              await db.shortcuts.add({
-                item: {
-                  type: "topic",
-                  id: note.id,
-                  notebookId: note.notebookId
-                }
-              });
-            } else {
-              await db.shortcuts.add({
-                item: {
-                  type: "notebook",
-                  id: note.id
-                }
-              });
-            }
-            ToastEvent.show({
-              heading: "Shortcut added to menu",
-              type: "success"
-            });
-          }
-          setIsPinnedToMenu(db.shortcuts.exists(note.id));
-          setMenuPins();
-
-          setActionStrip(false);
-        } catch (e) {
-          console.error(e);
-        }
-      },
-      visible: note.type !== "note"
-    },
-    {
-      title: "Copy Note",
-      icon: "content-copy",
-      visible: note.type === "note",
-      onPress: async () => {
-        if (note.locked) {
-          openVault({
-            copyNote: true,
-            novault: true,
-            locked: true,
-            item: note,
-            title: "Copy note",
-            description: "Unlock note to copy to clipboard."
-          });
-        } else {
-          let text = await toTXT(note);
-          text = `${note.title}\n \n ${text}`;
-          Clipboard.setString(text);
-          ToastEvent.show({
-            heading: "Note copied to clipboard",
-            type: "success"
-          });
-        }
-        setActionStrip(false);
-      }
-    },
-    {
-      title: "Restore " + note.itemType,
-      icon: "delete-restore",
-      onPress: async () => {
-        await db.trash.restore(note.id);
-        Navigation.queueRoutesForUpdate(
-          "Notes",
-          "Favorites",
-          "ColoredNotes",
-          "TaggedNotes",
-          "TopicNotes",
-          "Trash",
-          "Notebooks"
-        );
-
-        ToastEvent.show({
-          heading:
-            note.type === "note"
-              ? "Note restored from trash"
-              : "Notebook restored from trash",
-          type: "success"
-        });
-
-        setActionStrip(false);
-      },
-      visible: note.type === "trash"
-    },
-    {
-      title: "Delete" + note.itemType,
-      icon: "delete",
-      visible: note.type === "trash",
-      onPress: () => {
-        presentDialog({
-          title: "Permanent delete",
-          paragraph: `Are you sure you want to delete this ${note.itemType} permanantly from trash?`,
-          positiveText: "Delete",
-          negativeText: "Cancel",
-          positivePress: async () => {
-            await db.trash.delete(note.id);
-            useTrashStore.getState().setTrash();
-            useSelectionStore.getState().setSelectionMode(false);
-            ToastEvent.show({
-              heading: "Permanantly deleted items",
-              type: "success",
-              context: "local"
-            });
-          },
-          positiveType: "errorShade"
-        });
-        setActionStrip(false);
-      }
-    },
-    {
-      title: "Delete" + note.type,
-      icon: "delete",
-      visible: note.type !== "trash",
-      onPress: async () => {
-        try {
-          await deleteItems(note);
-        } catch (e) {
-          console.error(e);
-        }
-        setActionStrip(false);
-      }
-    },
-    {
-      title: "Close",
-      icon: "close",
-      onPress: () => setActionStrip(false),
-      color: colors.light,
-      bg: colors.red,
-      visible: true
-    }
-  ];
-
-  return (
-    <Animated.View
-      onLayout={(event) => {
-        setWidth(event.nativeEvent.layout.width);
-      }}
-      entering={SlideInUp.springify().mass(0.4)}
-      exiting={SlideOutDown}
-      style={{
-        position: "absolute",
-        zIndex: 999,
-        width: "102%",
-        height: "100%",
-        flexDirection: "row",
-        justifyContent: "flex-end",
-        alignItems: "center"
-      }}
-    >
-      <Button
-        type="accent"
-        title="Select"
-        icon="check"
-        tooltipText="Select Item"
-        onPress={() => {
-          if (!selectionMode) {
-            setSelectionMode(true);
-          }
-          setSelectedItem(note);
-          setActionStrip(false);
-        }}
-        style={{
-          borderRadius: 100,
-          paddingHorizontal: 12,
-          ...getElevation(5)
-        }}
-        height={30}
-      />
-      {actions.map((item) =>
-        item.visible ? (
-          <View
-            key={item.icon}
-            style={{
-              width: width / 1.4 / actions.length,
-              height: width / 1.4 / actions.length,
-              backgroundColor: item.bg || colors.nav,
-              borderRadius: 100,
-              justifyContent: "center",
-              alignItems: "center",
-              ...getElevation(5),
-              marginLeft: 15
-            }}
-          >
-            <IconButton
-              color={item.color || colors.heading}
-              onPress={item.onPress}
-              tooltipText={item.title}
-              top={60}
-              bottom={60}
-              name={item.icon}
-              size={width / 2.8 / actions.length}
-            />
-          </View>
-        ) : null
-      )}
-    </Animated.View>
-  );
-};

apps/mobile/app/components/list-items/selection-wrapper/back-fill.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -17,16 +17,11 @@ 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, { useEffect, useState } from "react";
-import {
-  eSubscribeEvent,
-  eUnSubscribeEvent
-} from "../../../services/event-manager";
+import React, { useRef } from "react";
+import { useSelectionStore } from "../../../stores/use-selection-store";
 import { useSettingStore } from "../../../stores/use-setting-store";
 import { useThemeStore } from "../../../stores/use-theme-store";
-import { history } from "../../../utils";
 import { PressableButton } from "../../ui/pressable";
-import { ActionStrip } from "./action-strip";
 import { Filler } from "./back-fill";
 import { SelectionIcon } from "./selection";
 
@@ -36,10 +31,11 @@ const SelectionWrapper = ({
   background,
   onLongPress,
   onPress,
-  testID
+  testID,
+  isSheet
 }) => {
+  const itemId = useRef(item.id);
   const colors = useThemeStore((state) => state.colors);
-  const [actionStrip, setActionStrip] = useState(false);
   const notebooksListMode = useSettingStore(
     (state) => state.settings.notebooksListMode
   );
@@ -51,34 +47,23 @@ const SelectionWrapper = ({
     (item.type === "notebook" || item.type === "note") &&
     listMode === "compact";
 
+  if (item.id !== itemId.current) {
+    itemId.current = item.id;
+  }
+
   const _onLongPress = () => {
-    if (history.selectedItemsList.length > 0) return;
-    setActionStrip(!actionStrip);
+    if (!useSelectionStore.getState().selectionMode) {
+      useSelectionStore.getState().setSelectionMode(true);
+    }
+    useSelectionStore.getState().setSelectedItem(item);
   };
 
   const _onPress = async () => {
-    if (actionStrip) {
-      setActionStrip(false);
-      return;
-    }
     await onPress();
   };
-
-  const closeStrip = () => {
-    setActionStrip(false);
-  };
-
-  useEffect(() => {
-    eSubscribeEvent("navigate", closeStrip);
-
-    return () => {
-      eUnSubscribeEvent("navigate", closeStrip);
-    };
-  }, []);
-
   return (
     <PressableButton
-      customColor="transparent"
+      customColor={isSheet ? colors.transGray : "transparent"}
       testID={testID}
       onLongPress={_onLongPress}
       onPress={_onPress}
@@ -90,10 +75,11 @@ const SelectionWrapper = ({
         justifyContent: "space-between",
         alignItems: "center",
         width: "100%",
-        borderRadius: 0,
         overflow: "hidden",
         paddingHorizontal: 12,
-        paddingVertical: compactMode ? 8 : 12
+        paddingVertical: compactMode ? 8 : 12,
+        borderRadius: isSheet ? 10 : 0,
+        marginBottom: isSheet ? 12 : undefined
       }}
     >
       {item.type === "note" ? (
@@ -101,15 +87,10 @@ const SelectionWrapper = ({
       ) : null}
       <SelectionIcon
         compactMode={compactMode}
-        setActionStrip={setActionStrip}
         item={item}
         onLongPress={onLongPress}
       />
       {children}
-
-      {actionStrip ? (
-        <ActionStrip note={item} setActionStrip={setActionStrip} />
-      ) : null}
     </PressableButton>
   );
 };

apps/mobile/app/components/list-items/selection-wrapper/selection.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -24,7 +24,7 @@ import { useSelectionStore } from "../../../stores/use-selection-store";
 import { useThemeStore } from "../../../stores/use-theme-store";
 import { SIZE } from "../../../utils/size";
 
-export const SelectionIcon = ({ setActionStrip, item }) => {
+export const SelectionIcon = ({ item }) => {
   const colors = useThemeStore((state) => state.colors);
 
   const selectionMode = useSelectionStore((state) => state.selectionMode);
@@ -35,7 +35,6 @@ export const SelectionIcon = ({ setActionStrip, item }) => {
 
   useEffect(() => {
     if (selectionMode) {
-      setActionStrip(false);
       let exists = selectedItemsList.filter(
         (o) => o.dateCreated === item.dateCreated
       );
@@ -50,16 +49,9 @@ export const SelectionIcon = ({ setActionStrip, item }) => {
         }
       }
     }
-  }, [
-    selectedItemsList,
-    item.id,
-    selectionMode,
-    setActionStrip,
-    item.dateCreated,
-    selected
-  ]);
+  }, [selectedItemsList, item.id, selectionMode, item.dateCreated, selected]);
 
-  return selectionMode && selected ? (
+  return selectionMode ? (
     <View
       style={{
         width: 40,
@@ -73,11 +65,13 @@ export const SelectionIcon = ({ setActionStrip, item }) => {
       }}
       pointerEvents="none"
     >
-      <Icon
-        size={SIZE.xl}
-        color={selected ? colors.accent : colors.icon}
-        name="check"
-      />
+      {selected ? (
+        <Icon
+          size={SIZE.xl}
+          color={selected ? colors.accent : colors.icon}
+          name={"check"}
+        />
+      ) : null}
     </View>
   ) : null;
 };

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

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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

apps/mobile/app/components/list/card.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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
@@ -47,50 +47,58 @@ export const Card = ({ color, warning }) => {
           width: "95%",
           flexDirection: "row",
           alignItems: "center",
-          justifyContent: "flex-start",
+          justifyContent: "space-between",
           paddingHorizontal: 0
         }}
       >
         <View
           style={{
-            width: 40,
-            backgroundColor:
-              messageBoardState.type === "error"
-                ? hexToRGBA(colors.red, 0.15)
-                : hexToRGBA(color, 0.15),
-            height: 40,
-            marginLeft: 10,
-            borderRadius: 100,
-            alignItems: "center",
-            justifyContent: "center"
+            flexDirection: "row",
+            alignItems: "center"
           }}
         >
-          <Icon
-            size={SIZE.lg}
-            color={
-              messageBoardState.type === "error" ? colors.errorText : color
-            }
-            name={messageBoardState.icon}
-          />
-        </View>
-
-        <View
-          style={{
-            marginLeft: 10,
-            maxWidth: "70%"
-          }}
-        >
-          <Paragraph color={colors.icon} size={SIZE.xs}>
-            {messageBoardState.message}
-          </Paragraph>
-          <Paragraph
+          <View
             style={{
-              maxWidth: "100%"
+              width: 40,
+              backgroundColor:
+                messageBoardState.type === "error"
+                  ? hexToRGBA(colors.red, 0.15)
+                  : hexToRGBA(color, 0.15),
+              height: 40,
+              borderRadius: 100,
+              alignItems: "center",
+              justifyContent: "center"
             }}
-            color={colors.heading}
           >
-            {messageBoardState.actionText}
-          </Paragraph>
+            <Icon
+              size={SIZE.lg}
+              color={
+                messageBoardState.type === "error" ? colors.errorText : color
+              }
+              name={messageBoardState.icon}
+            />
+          </View>
+
+          <View
+            style={{
+              marginLeft: 10,
+              flexShrink: 1,
+              marginRight: 10
+            }}
+          >
+            <Paragraph color={colors.icon} size={SIZE.xs}>
+              {messageBoardState.message}
+            </Paragraph>
+            <Paragraph
+              style={{
+                flexWrap: "wrap",
+                flexShrink: 1
+              }}
+              color={colors.heading}
+            >
+              {messageBoardState.actionText}
+            </Paragraph>
+          </View>
         </View>
 
         <View
@@ -98,9 +106,7 @@ export const Card = ({ color, warning }) => {
             width: 40,
             height: 40,
             justifyContent: "center",
-            alignItems: "center",
-            position: "absolute",
-            right: 6
+            alignItems: "center"
           }}
         >
           <Icon

apps/mobile/app/components/list/empty.js

@@ -1,7 +1,7 @@
 /*
 This file is part of the Notesnook project (https://notesnook.com/)
 
-Copyright (C) 2022 Streetwriters (Private) Limited
+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