mobile: convert sheets with input to screens or simple modals

.github/actions/setup-node-with-cache/action.yml

@@ -7,7 +7,7 @@ runs:
     - name: Setup Node
       uses: actions/setup-node@v4
       with:
-        node-version: 22.x
+        node-version: 20.x
         cache: "npm"
         cache-dependency-path: |
           package-lock.json

.github/pull_request_template.md

@@ -1,30 +0,0 @@
-## Description
-<!-- Add a detailed summary of what this feature/bugfix does -->
-
-## Type of Change
-- [ ] Bug fix
-- [ ] Feature
-
-## Visuals
-- [ ] Attached relevant screenshots / screen recording / GIF
-- [ ] N/A (not a feature or no UI changes)
-
-## Testing
-- [ ] Ran all E2E tests
-- [ ] Ran all integration tests
-- [ ] Added/updated tests for this change (if needed)
-- [ ] N/A (tests not needed — explanation provided below)
-
-### If tests were not added, explain why
-<!-- explanation -->
-
-## Platform
-<!-- Describe which platforms this PR is related to -->
-
-- [ ] Web
-- [ ] Mobile
-- [ ] Desktop
-
-## Sign-off
-- [ ] QA passed
-- [ ] UI/UX passed

.github/workflows/android.e2e.yml

@@ -47,21 +47,16 @@ jobs:
       - name: Install Detox CLI
         run: npm install detox-cli --global
 
-      - name: Check for typescript errors
-        run: |
-          cd apps/mobile
-          npx tsc --noEmit
-
       - name: Detox build
         run: |
           yarn build:android
-          ls apps/mobile/android/app/build/outputs/apk
-          ls apps/mobile/android/app/build/outputs/apk/release
+          ls apps/mobile/native/android/app/build/outputs/apk
+          ls apps/mobile/native/android/app/build/outputs/apk/release
 
       - name: Get device name
         id: device
         run: |
-          AVD_NAME=$(node -p "require('./apps/mobile/.detoxrc.js').devices.emulator.device.avdName")
+          AVD_NAME=$(node -p "require('./apps/mobile/native/.detoxrc.js').devices.emulator.device.avdName")
           echo "AVD_NAME=$AVD_NAME" >> $GITHUB_OUTPUT
 
       - name: AVD cache

.github/workflows/android.preview.firebase.yml

@@ -1,135 +0,0 @@
-name: Notesnook Android Preview
-
-on:
-  pull_request_target:
-    types: [opened, reopened, synchronize]
-    branches: [master, beta]
-    paths:
-      - "apps/mobile/**"
-      - "packages/**"
-      - ".github/workflows/android.preview.firebase.yml"
-
-jobs:
-  authorize:
-    environment: ${{ github.event_name == 'pull_request_target' &&
-      github.event.pull_request.head.repo.full_name != github.repository &&
-      'external' || 'internal' }}
-
-    runs-on: ubuntu-latest
-    steps:
-      - run: echo true
-
-  build:
-    needs: authorize
-    runs-on: ubuntu-22.04
-    env:
-      STAGING_BUILD: true
-
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v2
-        with:
-          ref: ${{ github.event.pull_request.head.sha || github.ref }}
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Use specific Java version for the builds
-        uses: joschi/setup-jdk@v2
-        with:
-          java-version: "17"
-          architecture: "x64"
-
-      - name: Free Disk Space (Ubuntu)
-        uses: jlumbroso/free-disk-space@main
-        with:
-          # this might remove tools that are actually needed,
-          # if set to "true" but frees about 6 GB
-          tool-cache: false
-
-          # all of these default to true, but feel free to set to
-          # "false" if necessary for your workflow
-          android: false
-          dotnet: true
-          haskell: true
-          large-packages: true
-          docker-images: true
-          swap-storage: true
-
-      - name: Install node modules
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=mobile
-
-      - name: Make Gradlew Executable
-        run: cd apps/mobile/android && chmod +x ./gradlew
-
-      - name: Get build number
-        id: build-number
-        run: echo "timestamp=$(($(date +%s) - 1774851180 ))" >> $GITHUB_OUTPUT
-
-      - name: Check for typescript errors
-        run: |
-          npm run tx mobile:build
-          cd apps/mobile
-          npx tsc --noEmit
-
-      - name: Build arm64-v8a apk
-        run: |
-          cd apps/mobile/android
-          ./gradlew assembleRelease -PreactNativeArchitectures=arm64-v8a -PstagingReleaseBuild=true -PprBuildNumber=${{ steps.build-number.outputs.timestamp }}
-
-      - name: Get app version
-        id: package-version
-        uses: saionaro/extract-package-version@master
-        with:
-          path: apps/mobile
-
-      - name: Publish to firebase CLI
-        id: firebase-output
-        uses: wzieba/Firebase-Distribution-Github-Action@v1
-        with:
-          appId: ${{secrets.FIREBASE_APP_ID}}
-          serviceCredentialsFileContent: ${{ secrets.QA_SERVICE_ACCOUNT }}
-          groups: testers
-          file: apps/mobile/android/app/build/outputs/apk/release/app-arm64-v8a-release.apk
-          releaseNotes: Preview for https://github.com/streetwriters/notesnook/pull/${{github.event.number}}
-
-      - name: Post or update PR comment
-        uses: actions/github-script@v6
-        env:
-          preview_url: ${{ steps.firebase-output.outputs.TESTING_URI }}
-        with:
-          script: |
-            const marker = '<!-- android-preview-comment -->';
-            const prNumber = context.issue.number;
-            const previewUrl = process.env.preview_url || '';
-            const body = `${marker}\n**Android App Preview**\n\n${previewUrl || 'Preview URL unavailable — check workflow logs.'}\n\nCommit: ${process.env.GITHUB_SHA}\n`;
-            const { data: comments } = await github.rest.issues.listComments({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              issue_number: prNumber,
-            });
-            const existing = comments.find(c => c.body && c.body.includes(marker));
-            if (existing) {
-              await github.rest.issues.updateComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                comment_id: existing.id,
-                body,
-              });
-            } else {
-              await github.rest.issues.createComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                issue_number: prNumber,
-                body,
-              });
-            }
-
-      - name: Upload sourcemaps
-        uses: actions/upload-artifact@v4
-        with:
-          name: sourcemaps
-          path: |
-            apps/mobile/android/app/build/generated/sourcemaps/**/*.map

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

@@ -5,6 +5,7 @@ on: workflow_dispatch
 jobs:
   build:
     runs-on: ubuntu-22.04
+    timeout-minutes: 40
     env:
       CMAKE_C_COMPILER_LAUNCHER: ccache
       CMAKE_CXX_COMPILER_LAUNCHER: ccache
@@ -30,23 +31,7 @@ jobs:
           npm run bootstrap -- --scope=mobile
 
       - name: Make Gradlew Executable
-        run: cd apps/mobile/android && chmod +x ./gradlew
-
-      - name: Free Disk Space (Ubuntu)
-        uses: jlumbroso/free-disk-space@main
-        with:
-          # this might remove tools that are actually needed,
-          # if set to "true" but frees about 6 GB
-          tool-cache: false
-
-          # all of these default to true, but feel free to set to
-          # "false" if necessary for your workflow
-          android: false
-          dotnet: true
-          haskell: true
-          large-packages: true
-          docker-images: true
-          swap-storage: true
+        run: cd apps/mobile/native/android && chmod +x ./gradlew
 
       - name: Install CCache
         uses: hendrikmuhs/ccache-action@v1.2.11
@@ -88,15 +73,6 @@ jobs:
       - name: CCache Stats Before Build
         run: ccache -sv
 
-      - name: Check for typescript errors
-        run: |
-          npm run tx mobile:build
-          cd apps/mobile
-          npx tsc --noEmit
-
-      - name: Remove debug keystore
-        run: rm -rf apps/mobile/android/app/debug.keystore
-
       - name: Build unsigned app bundle
         run: yarn release:android:bundle
 
@@ -107,13 +83,13 @@ jobs:
         id: sign_app
         uses: r0adkll/sign-android-release@master
         with:
-          releaseDirectory: apps/mobile/android/app/build/outputs/bundle/release
+          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 }}
         env:
-          BUILD_TOOLS_VERSION: "36.0.0"
+          BUILD_TOOLS_VERSION: "33.0.0"
 
       - name: Build apks for Github release
         run: yarn release:android
@@ -122,17 +98,17 @@ jobs:
         id: sign_apk
         uses: r0adkll/sign-android-release@master
         with:
-          releaseDirectory: apps/mobile/android/app/build/outputs/apk/release
+          releaseDirectory: apps/mobile/native/android/app/build/outputs/apk/release
           signingKeyBase64: ${{ secrets.PUBLIC_SIGNING_KEY }}
           alias: ${{ secrets.PUBLIC_ALIAS }}
           keyStorePassword: ${{ secrets.PUBLIC_KEY_PASSWORD }}
           keyPassword: ${{ secrets.PUBLIC_KEY_PASSWORD }}
         env:
-          BUILD_TOOLS_VERSION: "36.0.0"
+          BUILD_TOOLS_VERSION: "33.0.0"
 
       - name: Rename apk files
         run: |
-          cd apps/mobile/android/app/build/outputs/apk/release/
+          cd apps/mobile/native/android/app/build/outputs/apk/release/
           mv app-arm64-v8a-release-unsigned-signed.apk notesnook-arm64-v8a.apk
           mv app-armeabi-v7a-release-unsigned-signed.apk notesnook-armeabi-v7a.apk
           mv app-x86-release-unsigned-signed.apk notesnook-x86.apk
@@ -140,7 +116,7 @@ jobs:
 
       - name: Get app version
         id: package-version
-        uses: saionaro/extract-package-version@master
+        uses: martinbeentjes/npm-get-version-action@master
         with:
           path: apps/mobile
 
@@ -153,21 +129,21 @@ jobs:
           releaseFiles: ${{steps.sign_app.outputs.signedReleaseFile}}
           track: beta
           status: completed
-          whatsNewDirectory: apps/mobile/android/releasenotes/
+          whatsNewDirectory: apps/mobile/native/android/releasenotes/
 
       - name: Create release draft on Github
         uses: softprops/action-gh-release@v1
         with:
           draft: true
-          tag_name: ${{ steps.package-version.outputs.version}}-beta-android
-          name: Notesnook Android v${{ steps.package-version.outputs.version}}
+          tag_name: ${{ steps.package-version.outputs.current-version}}-beta-android
+          name: Notesnook Android v${{ steps.package-version.outputs.current-version}}
           repository: streetwriters/notesnook
           token: ${{ secrets.GITHUB_TOKEN }}
           files: |
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-arm64-v8a.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-armeabi-v7a.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-x86.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-x86_64.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-arm64-v8a.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-armeabi-v7a.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-x86.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-x86_64.apk
             ${{steps.sign_app.outputs.signedReleaseFile}}
 
       - name: Upload sourcemaps
@@ -175,5 +151,5 @@ jobs:
         with:
           name: sourcemaps
           path: |
-            apps/mobile/android/app/build/**/*.map
+            apps/mobile/native/android/app/build/**/*.map
             packages/editor-mobile/sourcemaps/*.map

.github/workflows/android.publish.yml

@@ -5,6 +5,7 @@ on: workflow_dispatch
 jobs:
   build:
     runs-on: ubuntu-22.04
+    timeout-minutes: 40
     env:
       CMAKE_C_COMPILER_LAUNCHER: ccache
       CMAKE_CXX_COMPILER_LAUNCHER: ccache
@@ -24,29 +25,13 @@ jobs:
           java-version: "17"
           architecture: "x64"
 
-      - name: Free Disk Space (Ubuntu)
-        uses: jlumbroso/free-disk-space@main
-        with:
-          # this might remove tools that are actually needed,
-          # if set to "true" but frees about 6 GB
-          tool-cache: false
-
-          # all of these default to true, but feel free to set to
-          # "false" if necessary for your workflow
-          android: false
-          dotnet: true
-          haskell: true
-          large-packages: true
-          docker-images: true
-          swap-storage: true
-
       - name: Install node modules
         run: |
           npm ci --ignore-scripts --prefer-offline --no-audit
           npm run bootstrap -- --scope=mobile
 
       - name: Make Gradlew Executable
-        run: cd apps/mobile/android && chmod +x ./gradlew
+        run: cd apps/mobile/native/android && chmod +x ./gradlew
 
       - name: Install CCache
         uses: hendrikmuhs/ccache-action@v1.2.11
@@ -88,15 +73,6 @@ jobs:
       - name: CCache Stats Before Build
         run: ccache -sv
 
-      - name: Check for typescript errors
-        run: |
-          npm run tx mobile:build
-          cd apps/mobile
-          npx tsc --noEmit
-
-      - name: Remove debug keystore
-        run: rm -rf apps/mobile/android/app/debug.keystore
-
       - name: Build unsigned app bundle
         run: yarn release:android:bundle
 
@@ -107,13 +83,13 @@ jobs:
         id: sign_app
         uses: r0adkll/sign-android-release@master
         with:
-          releaseDirectory: apps/mobile/android/app/build/outputs/bundle/release
+          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 }}
         env:
-          BUILD_TOOLS_VERSION: "36.0.0"
+          BUILD_TOOLS_VERSION: "33.0.0"
 
       - name: Build apks for Github release
         run: yarn release:android
@@ -122,17 +98,17 @@ jobs:
         id: sign_apk
         uses: r0adkll/sign-android-release@master
         with:
-          releaseDirectory: apps/mobile/android/app/build/outputs/apk/release
+          releaseDirectory: apps/mobile/native/android/app/build/outputs/apk/release
           signingKeyBase64: ${{ secrets.PUBLIC_SIGNING_KEY }}
           alias: ${{ secrets.PUBLIC_ALIAS }}
           keyStorePassword: ${{ secrets.PUBLIC_KEY_PASSWORD }}
           keyPassword: ${{ secrets.PUBLIC_KEY_PASSWORD }}
         env:
-          BUILD_TOOLS_VERSION: "36.0.0"
+          BUILD_TOOLS_VERSION: "33.0.0"
 
       - name: Rename apk files
         run: |
-          cd apps/mobile/android/app/build/outputs/apk/release/
+          cd apps/mobile/native/android/app/build/outputs/apk/release/
           mv app-arm64-v8a-release-unsigned-signed.apk notesnook-arm64-v8a.apk
           mv app-armeabi-v7a-release-unsigned-signed.apk notesnook-armeabi-v7a.apk
           mv app-x86-release-unsigned-signed.apk notesnook-x86.apk
@@ -140,7 +116,7 @@ jobs:
 
       - name: Get app version
         id: package-version
-        uses: saionaro/extract-package-version@master
+        uses: martinbeentjes/npm-get-version-action@master
         with:
           path: apps/mobile
 
@@ -153,26 +129,26 @@ jobs:
           releaseFiles: ${{steps.sign_app.outputs.signedReleaseFile}}
           track: production
           status: completed
-          whatsNewDirectory: apps/mobile/android/releasenotes/
+          whatsNewDirectory: apps/mobile/native/android/releasenotes/
 
       - name: Create release draft on Github
         uses: softprops/action-gh-release@v1
         with:
           draft: true
-          tag_name: ${{ steps.package-version.outputs.version}}-android
-          name: Notesnook Android v${{ steps.package-version.outputs.version}}
+          tag_name: ${{ steps.package-version.outputs.current-version}}-android
+          name: Notesnook Android v${{ steps.package-version.outputs.current-version}}
           repository: streetwriters/notesnook
           token: ${{ secrets.GITHUB_TOKEN }}
           files: |
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-arm64-v8a.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-armeabi-v7a.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-x86.apk
-            apps/mobile/android/app/build/outputs/apk/release/notesnook-x86_64.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-arm64-v8a.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-armeabi-v7a.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-x86.apk
+            apps/mobile/native/android/app/build/outputs/apk/release/notesnook-x86_64.apk
 
       - name: Upload sourcemaps
         uses: actions/upload-artifact@v4
         with:
           name: sourcemaps
           path: |
-            apps/mobile/android/app/build/**/*.map
+            apps/mobile/native/android/app/build/**/*.map
             packages/editor-mobile/sourcemaps/*.map

.github/workflows/core.tests.yml

@@ -9,13 +9,7 @@ on:
       - "packages/core/**"
       # re-run workflow if workflow file changes
       - ".github/workflows/core.tests.yml"
-  pull_request_target:
-    branches:
-      - "master"
-    paths:
-      - "packages/core/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/core.tests.yml"
+  pull_request:
     types:
       - "ready_for_review"
       - "opened"
@@ -23,21 +17,11 @@ on:
       - "reopened"
 
 jobs:
-  authorize:
-    environment: ${{ github.event_name == 'pull_request_target' &&
-      github.event.pull_request.head.repo.full_name != github.repository &&
-      'external' || 'internal' }}
-    runs-on: ubuntu-latest
-    steps:
-      - run: echo true
-
   test:
-    needs: authorize
     runs-on: ubuntu-22.04
+
     steps:
       - uses: actions/checkout@v4
-        with:
-          ref: ${{ github.event.pull_request.head.sha || github.ref }}
 
       - name: Setup Node
         uses: ./.github/actions/setup-node-with-cache
@@ -52,6 +36,7 @@ jobs:
           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
-        run: npm run tx @notesnook/core:test:e2e
+        run: npx nx test:e2e @notesnook/core

.github/workflows/desktop.preview.yml

@@ -1,301 +0,0 @@
-name: Preview @notesnook/desktop
-
-on:
-  pull_request:
-    types: [opened, reopened, synchronize]
-    branches: [master, beta]
-    paths:
-      - "apps/desktop/**"
-      - "apps/web/**"
-      - "packages/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/desktop.preview.yml"
-
-jobs:
-  build:
-    if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
-    name: Build
-    runs-on: ubuntu-22.04
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Install packages
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=web
-          npm run bootstrap -- --scope=desktop
-
-      - name: Install sqlite-better-trigram for all arch
-        run: |
-          npm i --cpu arm64 sqlite-better-trigram
-          npm i --cpu x64 sqlite-better-trigram
-        working-directory: ./apps/desktop
-
-      - name: Generate desktop build (stable)
-        run: npm run tx @notesnook/web:build:desktop
-
-      - name: Build desktop bundle
-        working-directory: ./apps/desktop
-        run: npm run bundle
-
-      - name: Archive build artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: build
-          path: apps/web/build/**/*
-
-  build-macos:
-    name: Build for macOS
-    needs: build
-    runs-on: macos-14
-    outputs:
-      macos-artifact-url: ${{ steps.artifact-upload-step.outputs.artifact-url }}
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Install setuptools
-        run: brew install python-setuptools
-
-      - name: Setup notarization
-        run: |
-          mkdir -p ~/private_keys/
-          echo '${{ secrets.api_key }}' > ~/private_keys/AuthKey_${{ secrets.api_key_id }}.p8
-
-      - name: Collect app metadata
-        id: app_metadata
-        working-directory: ./apps/desktop
-        run: |
-          echo ::set-output name=apple_app_id::$(cat package.json | jq -r .appAppleId)
-          echo ::set-output name=app_bundle_id::$(cat package.json | jq -r .build.appId)
-          echo ::set-output name=app_version::$(cat package.json | jq -r .version)
-          echo ::set-output name=bundle_version::$(cat package.json | jq -r .build.mac.bundleVersion)
-
-      - name: Download build
-        uses: actions/download-artifact@v4
-        with:
-          name: build
-          path: ./apps/web/build
-
-      - name: Install packages
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=desktop
-
-      - name: Install sqlite-better-trigram for all arch
-        run: |
-          npm i --cpu arm64 sqlite-better-trigram
-          npm i --cpu x64 sqlite-better-trigram
-        working-directory: ./apps/desktop
-
-      - name: Install provisioning profile
-        run: echo "${{ secrets.MAC_PROVISIONING_PROFILE }}" | base64 --decode > embedded.provisionprofile
-        working-directory: ./apps/desktop
-
-      - name: Build dmg
-        env:
-          CSC_LINK: ${{ secrets.mac_certs }}
-          CSC_KEY_PASSWORD: ${{ secrets.mac_certs_password }}
-          APPLE_API_KEY: ~/private_keys/AuthKey_${{ secrets.api_key_id }}.p8
-          APPLE_API_KEY_ID: ${{ secrets.api_key_id }}
-          APPLE_API_ISSUER: ${{ secrets.api_key_issuer_id }}
-          CSC_FOR_PULL_REQUEST: true
-        run: |
-          npm run tx @notesnook/desktop:release
-          cd apps/desktop
-          yarn electron-builder --config=electron-builder.config.js --mac dmg --arm64 -p never
-
-      - name: Upload dmg artifact
-        id: artifact-upload-step
-        uses: actions/upload-artifact@v4
-        with:
-          name: macos-build
-          path: apps/desktop/output/*.dmg
-
-  build-linux-x64:
-    name: Build for Linux x64
-    needs: build
-    runs-on: ubuntu-22.04
-    outputs:
-      linux-x64-artifact-url: ${{ steps.artifact-upload-step.outputs.artifact-url }}
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Download build
-        uses: actions/download-artifact@v4
-        with:
-          name: build
-          path: ./apps/web/build
-
-      - name: Install packages
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=desktop
-
-      - name: Install sqlite-better-trigram for all arch
-        run: |
-          npm i --cpu x64 sqlite-better-trigram
-        working-directory: ./apps/desktop
-
-      - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
-
-      - name: Build AppImage
-        run: yarn electron-builder --config=electron-builder.config.js --linux AppImage:x64 -p never
-        working-directory: ./apps/desktop
-
-      - name: Upload AppImage artifact
-        id: artifact-upload-step
-        uses: actions/upload-artifact@v4
-        with:
-          name: linux-x64-build
-          path: apps/desktop/output/*.AppImage
-
-  build-linux-arm64:
-    name: Build for Linux arm64
-    needs: build
-    runs-on: ubuntu-22.04-arm
-    outputs:
-      linux-arm64-artifact-url: ${{ steps.artifact-upload-step.outputs.artifact-url }}
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Download build
-        uses: actions/download-artifact@v4
-        with:
-          name: build
-          path: ./apps/web/build
-
-      - name: Install packages
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=desktop
-
-      - name: Install sqlite-better-trigram for all arch
-        run: |
-          npm i --cpu arm64 sqlite-better-trigram
-        working-directory: ./apps/desktop
-
-      - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
-
-      - name: Build AppImage
-        run: yarn electron-builder --config=electron-builder.config.js --linux AppImage:arm64 -p never
-        working-directory: ./apps/desktop
-
-      - name: Upload AppImage artifact
-        id: artifact-upload-step
-        uses: actions/upload-artifact@v4
-        with:
-          name: linux-arm64-build
-          path: apps/desktop/output/*.AppImage
-
-  build-windows:
-    name: Build for Windows
-    needs: build
-    runs-on: windows-latest
-    outputs:
-      windows-artifact-url: ${{ steps.artifact-upload-step.outputs.artifact-url }}
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Download build
-        uses: actions/download-artifact@v4
-        with:
-          name: build
-          path: ./apps/web/build
-
-      - name: Install packages
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=desktop
-
-      - name: Install sqlite-better-trigram for all arch
-        run: |
-          npm i --cpu arm64 sqlite-better-trigram
-          npm i --cpu x64 sqlite-better-trigram
-
-          npm i --cpu arm64 sqlite3-fts5-html
-          npm i --cpu x64 sqlite3-fts5-html
-        working-directory: ./apps/desktop
-
-      - name: Build
-        run: node scripts/execute.mjs @notesnook/desktop:release
-
-      - name: Publish
-        env:
-          NOTESNOOK_STAGING: true
-        run: yarn electron-builder --config=electron-builder.config.js --win nsis:x64 --publish never
-        working-directory: ./apps/desktop
-
-      - name: Upload exe artifact
-        id: artifact-upload-step
-        uses: actions/upload-artifact@v4
-        with:
-          name: windows-build
-          path: apps/desktop/output/*.exe
-
-  post-pr-comment:
-    name: Post PR comment with preview URLs
-    needs:
-      [build, build-macos, build-linux-x64, build-linux-arm64, build-windows]
-    runs-on: ubuntu-latest
-    steps:
-      - name: Post or update PR comment
-        uses: actions/github-script@v6
-        env:
-          macos_artifact_url: ${{ needs.build-macos.outputs.macos-artifact-url }}
-          linux_x64_artifact_url: ${{ needs.build-linux-x64.outputs.linux-x64-artifact-url }}
-          linux_arm64_artifact_url: ${{ needs.build-linux-arm64.outputs.linux-arm64-artifact-url }}
-          windows_artifact_url: ${{ needs.build-windows.outputs.windows-artifact-url }}
-        with:
-          script: |
-            const marker = '<!-- desktop-preview-comment -->';
-            const prNumber = context.issue.number;
-            const previewUrl = [
-              { platform: 'macOS', url: process.env.macos_artifact_url },
-              { platform: 'Linux x64', url: process.env.linux_x64_artifact_url },
-              { platform: 'Linux arm64', url: process.env.linux_arm64_artifact_url },
-              { platform: 'Windows x64', url: process.env.windows_artifact_url },
-            ].filter(u => u.url).map(u => `- [${u.platform}](${u.url})`).join('\n');
-            const body = `${marker}\n**Desktop Previews**\n\n${previewUrl || 'Preview URL unavailable — check workflow logs.'}\n\nCommit: ${process.env.GITHUB_SHA}\n`;
-            const { data: comments } = await github.rest.issues.listComments({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              issue_number: prNumber,
-            });
-            const existing = comments.find(c => c.body && c.body.includes(marker));
-            if (existing) {
-              await github.rest.issues.updateComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                comment_id: existing.id,
-                body,
-              });
-            } else {
-              await github.rest.issues.createComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                issue_number: prNumber,
-                body,
-              });
-            }

.github/workflows/desktop.publish.yml

@@ -65,13 +65,17 @@ jobs:
           npm i --cpu x64 sqlite-better-trigram
         working-directory: ./apps/desktop
 
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
       - name: Generate desktop build (stable)
         if: ${{ inputs.release-track == 'stable' }}
-        run: npm run tx @notesnook/web:build:desktop
+        run: npx nx build:desktop @notesnook/web
 
       - name: Generate desktop build (beta)
         if: ${{ inputs.release-track == 'beta' }}
-        run: BETA=true npm run tx @notesnook/web:build:desktop
+        run: BETA=true npx nx build:desktop @notesnook/web
 
       - name: Build desktop bundle
         working-directory: ./apps/desktop
@@ -195,9 +199,9 @@ jobs:
           CSC_LINK: ${{ secrets.mac_certs }}
           CSC_KEY_PASSWORD: ${{ secrets.mac_certs_password }}
         run: |
-          npm run tx @notesnook/desktop:release -- --variant=mas
-          cd apps/desktop
+          npx nx run release --project @notesnook/desktop -- --variant=mas
           yarn electron-builder --config=electron-builder.config.js --mac mas --universal -p never
+        working-directory: ./apps/desktop
 
       - name: Build zip and dmg
         env:
@@ -208,13 +212,13 @@ jobs:
           APPLE_API_KEY_ID: ${{ secrets.api_key_id }}
           APPLE_API_ISSUER: ${{ secrets.api_key_issuer_id }}
         run: |
-          npm run tx @notesnook/desktop:release
-          cd apps/desktop
+          npx nx run release --project @notesnook/desktop
           if [ ${{ inputs.publish-github }} == true ]; then
             yarn electron-builder --config=electron-builder.config.js --mac zip dmg --arm64 --x64 -p always
           else
             yarn electron-builder --config=electron-builder.config.js --mac zip dmg --arm64 --x64 -p never
           fi
+        working-directory: ./apps/desktop
 
       - name: Deploy to Testflight
         if: inputs.publish-apple && steps.appstore.outputs.app-version-latest != steps.app_metadata.outputs.app_version
@@ -267,7 +271,8 @@ jobs:
         working-directory: ./apps/desktop
 
       - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       - name: Build snap
         if: inputs.publish-snap
@@ -334,7 +339,8 @@ jobs:
         working-directory: ./apps/desktop
 
       - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       # - name: Build snap
       #   if: inputs.publish-snap
@@ -396,13 +402,10 @@ jobs:
         run: |
           npm i --cpu arm64 sqlite-better-trigram
           npm i --cpu x64 sqlite-better-trigram
-
-          npm i --cpu arm64 sqlite3-fts5-html
-          npm i --cpu x64 sqlite3-fts5-html
         working-directory: ./apps/desktop
 
       - name: Build
-        run: node scripts/execute.mjs @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
 
       - name: Publish
         env:

.github/workflows/desktop.tests.yml

@@ -6,16 +6,10 @@ on:
     branches:
       - "master"
     paths:
-      - "apps/desktop/**"
+      - "app/desktop/**"
       # re-run workflow if workflow file changes
       - ".github/workflows/desktop.tests.yml"
   pull_request:
-    branches:
-      - "master"
-    paths:
-      - "apps/desktop/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/desktop.tests.yml"
 
 jobs:
   build:
@@ -33,8 +27,12 @@ jobs:
           npm ci --ignore-scripts --prefer-offline --no-audit
           npm run bootstrap -- --scope=web
 
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
       - name: Generate desktop build
-        run: npm run tx @notesnook/web:build:desktop
+        run: npx nx build:desktop @notesnook/web
 
       - name: Archive build artifact
         uses: actions/upload-artifact@v4
@@ -45,7 +43,7 @@ jobs:
   test-macos-x64:
     name: Test macOS x64
     needs: build
-    runs-on: macos-15-intel
+    runs-on: macos-13
 
     steps:
       - name: Check out Git repository
@@ -66,7 +64,8 @@ jobs:
           npm run bootstrap -- --scope=desktop
 
       - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       - name: Build app
         run: |
@@ -109,7 +108,8 @@ jobs:
           npm run bootstrap -- --scope=desktop
 
       - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       - name: Build app
         run: |
@@ -158,7 +158,8 @@ jobs:
         working-directory: ./apps/desktop
 
       - name: Build Electron wrapper
-        run: npm run tx @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       - name: Build app
         run: |
@@ -204,13 +205,11 @@ jobs:
         run: |
           npm i --cpu arm64 sqlite-better-trigram
           npm i --cpu x64 sqlite-better-trigram
-
-          npm i --cpu arm64 sqlite3-fts5-html
-          npm i --cpu x64 sqlite3-fts5-html
         working-directory: ./apps/desktop
 
       - name: Build Electron wrapper
-        run: node scripts/execute.mjs @notesnook/desktop:release
+        run: npx nx run release --project @notesnook/desktop
+        working-directory: ./apps/desktop
 
       - name: Build app
         run: |

.github/workflows/editor.tests.yml

@@ -10,12 +10,6 @@ on:
       # re-run workflow if workflow file changes
       - ".github/workflows/editor.tests.yml"
   pull_request:
-    branches:
-      - "master"
-    paths:
-      - "packages/editor/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/editor.tests.yml"
     types:
       - "ready_for_review"
       - "opened"
@@ -38,8 +32,12 @@ jobs:
           npm ci --ignore-scripts --prefer-offline --no-audit
           npm run bootstrap -- --scope=editor
 
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
       - name: Build editor
-        run: npm run tx @notesnook/editor:build
+        run: npx nx build @notesnook/editor
 
       - name: Run all @notesnook/editor tests
-        run: npm run tx @notesnook/editor:test
+        run: npx nx test @notesnook/editor

.github/workflows/ios.preview.firebase.yml

@@ -1,173 +0,0 @@
-name: Notesnook iOS Preview
-
-on:
-  pull_request_target:
-    types: [opened, reopened, synchronize]
-    branches: [master, beta]
-    paths:
-      - "apps/mobile/**"
-      - "packages/**"
-      - ".github/workflows/ios.preview.firebase.yml"
-
-jobs:
-  authorize:
-    environment: ${{ github.event_name == 'pull_request_target' &&
-      github.event.pull_request.head.repo.full_name != github.repository &&
-      'external' || 'internal' }}
-
-    runs-on: ubuntu-latest
-    steps:
-      - run: echo true
-
-  build:
-    needs: authorize
-    runs-on: macos-26
-    timeout-minutes: 60
-
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v3
-        with:
-          ref: ${{ github.event.pull_request.head.sha || github.ref }}
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Setup Xcode
-        uses: maxim-lobanov/setup-xcode@v1
-        with:
-          xcode-version: "26.1.1"
-
-      - name: Setup iOS Platform
-        run: |
-          xcodebuild -downloadPlatform iOS -exportPath ~/Downloads
-          xcodebuild -importPlatform ~/Downloads/iphonesimulator_26.1_23B86.dmg
-
-      - name: Install node modules
-        run: |
-          npm ci --ignore-scripts --prefer-offline --no-audit
-          npm run bootstrap -- --scope=mobile
-
-      - name: Build packages
-        run: npm run tx @notesnook/mobile:build
-
-      - name: Cache Pods
-        uses: actions/cache@v3
-        id: pods-cache
-        with:
-          path: apps/mobile/ios/Pods
-          key: ${{ runner.os }}-pods-${{ hashFiles('apps/mobile/ios/Podfile.lock') }}
-
-      - name: Install Pods
-        run: |
-          cd apps/mobile/ios
-          pod install
-
-      - name: Check for typescript errors
-        run: |
-          npm run tx mobile:build
-          cd apps/mobile
-          npx tsc --noEmit
-
-      - name: Get marketing version
-        id: marketing-version
-        run: echo "version=$(grep "IOS_MARKETING_VERSION" apps/mobile/ios/build-configs/ios-build.staging.xcconfig | awk -F'=' '{print $2}' | xargs)" >> $GITHUB_OUTPUT
-
-      - name: Get build number
-        id: build-number
-        run: echo "timestamp=$(($(date +%s) - 1774851180 ))" >> $GITHUB_OUTPUT
-
-      - name: Make staging xcconfig active
-        run: |
-          cd apps/mobile/ios/build-configs
-          ./use-ios-build-config.sh staging --marketing-version ${{steps.marketing-version.outputs.version}} --build-number ${{steps.build-number.outputs.timestamp}}
-
-      - name: Build iOS App
-        uses: ammarahm-ed/ios-build-action@master
-        with:
-          bundle-identifier: org.streetwriters.notesnook
-          scheme: Notesnook
-          configuration: "Release"
-          export-options: apps/mobile/ios/ExportOptionsStaging.plist
-          export-method: "ad-hoc"
-          project-path: apps/mobile/ios/Notesnook.xcodeproj
-          workspace-path: apps/mobile/ios/Notesnook.xcworkspace
-          update-targets: |
-            Notesnook
-            Make Note
-            NotesWidgetExtension
-          disable-targets: Notesnook-tvOS,Notesnook-tvOSTests,NotesnookTests
-          code-signing-identity: Apple Distribution
-          team-id: ${{ secrets.APPLE_TEAM_ID }}
-          p12-base64: ${{ secrets.APPLE_CERTIFICATE_P12 }}
-          certificate-password: ${{ secrets.APPLE_CERTIFICATE_P12_PASSWORD }}
-          app-store-connect-api-key-issuer-id: ${{ secrets.API_KEY_ISSUER_ID }}
-          app-store-connect-api-key-id: ${{ secrets.APPSTORE_KEY_ID }}
-          app-store-connect-api-key-base64: ${{ secrets.APPSTORE_CONNECT_API_KEY_BASE64 }}
-          output-path: Notesnook.ipa
-          mobileprovision-base64: |
-            ${{ secrets.APPLE_MOBILE_PROVISION_ADHOC_APP }}
-            ${{ secrets.APPLE_MOBILE_PROVISION_ADHOC_SHARE }}
-            ${{ secrets.APPLE_MOBILE_PROVISION_ADHOC_WIDGET }}
-
-      - name: Upload IPA artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: ios-preview-ipa
-          path: Notesnook.ipa
-          if-no-files-found: error
-          retention-days: 1
-
-  publish:
-    runs-on: ubuntu-latest
-    needs: build
-    timeout-minutes: 20
-
-    steps:
-      - name: Download IPA artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: ios-preview-ipa
-          path: .
-
-      - name: Publish to firebase CLI
-        id: firebase-output
-        uses: wzieba/Firebase-Distribution-Github-Action@v1
-        with:
-          appId: ${{secrets.FIREBASE_IOS_APP_ID}}
-          serviceCredentialsFileContent: ${{ secrets.QA_SERVICE_ACCOUNT }}
-          groups: testers
-          file: Notesnook.ipa
-          releaseNotes: Preview for https://github.com/streetwriters/notesnook/pull/${{github.event.number}}
-
-      - name: Post or update PR comment
-        uses: actions/github-script@v6
-        env:
-          preview_url: ${{ steps.firebase-output.outputs.TESTING_URI }}
-        with:
-          script: |
-            const marker = '<!-- ios-preview-comment -->';
-            const prNumber = context.issue.number;
-            const previewUrl = process.env.preview_url || '';
-            const body = `${marker}\n**iOS App Preview**\n\n${previewUrl || 'Preview URL unavailable — check workflow logs.'}\n\nCommit: ${process.env.GITHUB_SHA}\n`;
-            const { data: comments } = await github.rest.issues.listComments({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              issue_number: prNumber,
-            });
-            const existing = comments.find(c => c.body && c.body.includes(marker));
-            if (existing) {
-              await github.rest.issues.updateComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                comment_id: existing.id,
-                body,
-              });
-            } else {
-              await github.rest.issues.createComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                issue_number: prNumber,
-                body,
-              });
-            }

.github/workflows/ios.publish.yml

@@ -4,7 +4,7 @@ on: workflow_dispatch
 
 jobs:
   build:
-    runs-on: macos-26
+    runs-on: macos-14
     timeout-minutes: 60
 
     steps:
@@ -17,12 +17,7 @@ jobs:
       - name: Setup Xcode
         uses: maxim-lobanov/setup-xcode@v1
         with:
-          xcode-version: "26.1.1"
-
-      - name: Setup iOS Platform
-        run: |
-          xcodebuild -downloadPlatform iOS -exportPath ~/Downloads
-          xcodebuild -importPlatform ~/Downloads/iphonesimulator_26.1_23B86.dmg
+          xcode-version: "16.1"
 
       - name: Install node modules
         run: |
@@ -30,12 +25,12 @@ jobs:
           npm run bootstrap -- --scope=mobile
 
       - name: Build packages
-        run: npm run tx @notesnook/mobile:build
+        run: npx nx run @notesnook/mobile:build
 
       - name: ccache
         uses: hendrikmuhs/ccache-action@v1.2.11
         with:
-          key: ${{ runner.os }}-ccache-${{ hashFiles(format('apps/mobile/ios/Podfile.lock')) }}
+          key: ${{ runner.os }}-ccache-${{ hashFiles(format('apps/mobile/native/ios/Podfile.lock')) }}
           max-size: 1500M
           restore-keys: |
             ${{ runner.os }}-ccache-
@@ -60,19 +55,14 @@ jobs:
         uses: actions/cache@v3
         id: pods-cache
         with:
-          path: apps/mobile/ios/Pods
-          key: ${{ runner.os }}-pods-${{ hashFiles('apps/mobile/ios/Podfile.lock') }}
+          path: apps/mobile/native/ios/Pods
+          key: ${{ runner.os }}-pods-${{ hashFiles('apps/mobile/native/ios/Podfile.lock') }}
 
       - name: Install Pods
         run: |
-          cd apps/mobile/ios
-          pod install
-
-      - name: Check for typescript errors
-        run: |
-          npm run tx mobile:build
-          cd apps/mobile
-          npx tsc --noEmit
+          cd apps/mobile/native/ios
+          bundle install
+          RCT_NEW_ARCH_ENABLED=0 bundle exec pod install
 
       - name: CCache Stats Before Build
         run: ccache -sv
@@ -83,9 +73,9 @@ jobs:
           bundle-identifier: org.streetwriters.notesnook
           scheme: Notesnook
           configuration: "Release"
-          export-options: apps/mobile/ios/ExportOptions.plist
-          project-path: apps/mobile/ios/Notesnook.xcodeproj
-          workspace-path: apps/mobile/ios/Notesnook.xcworkspace
+          export-options: apps/mobile/native/ios/ExportOptions.plist
+          project-path: apps/mobile/native/ios/Notesnook.xcodeproj
+          workspace-path: apps/mobile/native/ios/Notesnook.xcworkspace
           update-targets: |
             Notesnook
             Make Note
@@ -116,11 +106,10 @@ jobs:
           api-private-key: ${{ secrets.API_KEY }}
 
       - name: Upload Notesnook.ipa to Github
-        continue-on-error: true
         uses: actions/upload-artifact@v4
         with:
           name: Notesnook.zip
           path: |
             Notesnook.ipa
-            apps/mobile/ios/**/*.map
+            apps/mobile/native/ios/**/*.map
             packages/editor-mobile/sourcemaps/*.map

.github/workflows/monograph.publish.yml

@@ -39,13 +39,13 @@ jobs:
           echo ::set-output name=app_version::$(cat package.json | jq -r .version)
 
       - name: Generate build
-        run: npm run tx @notesnook/monograph:build
+        run: npx nx build @notesnook/monograph
 
       # Setup Buildx
       - name: Docker Setup Buildx
         uses: docker/setup-buildx-action@v3
         with:
-          platforms: linux/amd64,linux/arm64
+          platforms: linux/amd64,linux/arm64,linux/arm/v7,linux/arm/v8
 
       - name: Log in to Docker Hub
         uses: docker/login-action@v3
@@ -77,7 +77,7 @@ jobs:
           context: apps/monograph
           file: apps/monograph/Dockerfile
           push: true
-          platforms: linux/amd64,linux/arm64
+          platforms: linux/amd64,linux/arm64,linux/arm/v7,linux/arm/v8
           tags: streetwriters/monograph:${{ steps.package_metadata.outputs.app_version }},streetwriters/monograph:latest
           cache-from: streetwriters/monograph:latest
 

.github/workflows/theme-builder.publish.yml

@@ -20,6 +20,7 @@ jobs:
 
       - name: Setup environment
         run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_ACCOUNT_ID=${{ secrets.CLOUDFLARE_ACCOUNT_ID }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_API_TOKEN=${{ secrets.CLOUDFLARE_API_TOKEN }}" >> $GITHUB_ENV
 

.github/workflows/themes.publish.yml

@@ -1,78 +0,0 @@
-# This workflow uses actions that are not certified by GitHub.
-# They are provided by a third-party and are governed by
-# separate terms of service, privacy policy, and support
-# documentation.
-
-# GitHub recommends pinning actions to a commit SHA.
-# To get a newer version, you will need to update the SHA.
-# You can also reference a tag or branch, but the action may change without warning.
-
-name: Publish @notesnook/themes-server
-
-on: workflow_dispatch
-
-jobs:
-  push_to_registry:
-    name: Push Docker image to Docker Hub
-    runs-on: ubuntu-22.04
-    permissions:
-      packages: write
-      contents: read
-      attestations: write
-      id-token: write
-    steps:
-      - name: Check out the repo
-        uses: actions/checkout@v4
-
-      - name: Collect package metadata
-        id: package_metadata
-        working-directory: ./servers/themes
-        run: |
-          echo ::set-output name=app_version::$(cat package.json | jq -r .version)
-
-      # Setup Buildx
-      - name: Docker Setup Buildx
-        uses: docker/setup-buildx-action@v3
-        with:
-          platforms: linux/amd64,linux/arm64
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKER_USERNAME }}
-          password: ${{ secrets.DOCKER_PASSWORD }}
-          ecr: auto
-          logout: true
-
-      # Pull previous image from docker hub to use it as cache to improve the image build time.
-      - name: docker pull cache image
-        continue-on-error: true
-        run: docker pull streetwriters/themes-server:latest
-
-      # Setup QEMU
-      # - name: Set up QEMU
-      #   uses: docker/setup-qemu-action@v2
-
-      - name: Extract metadata (tags, labels) for Docker
-        id: meta
-        uses: docker/metadata-action@v5
-        with:
-          images: streetwriters/themes-server
-
-      - name: Build and push Docker image
-        id: push
-        uses: docker/build-push-action@v6
-        with:
-          context: .
-          file: servers/themes/Dockerfile
-          push: true
-          platforms: linux/amd64,linux/arm64
-          tags: streetwriters/themes-server:${{ steps.package_metadata.outputs.app_version }},streetwriters/themes-server:latest
-          cache-from: streetwriters/themes-server:latest
-
-      - name: Generate artifact attestation
-        uses: actions/attest-build-provenance@v1
-        with:
-          subject-name: index.docker.io/streetwriters/themes-server
-          subject-digest: ${{ steps.push.outputs.digest }}
-          push-to-registry: true

.github/workflows/vericrypt.publish.yml

@@ -20,6 +20,7 @@ jobs:
 
       - name: Setup environment
         run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_ACCOUNT_ID=${{ secrets.CLOUDFLARE_ACCOUNT_ID }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_API_TOKEN=${{ secrets.CLOUDFLARE_API_TOKEN }}" >> $GITHUB_ENV
 

.github/workflows/web.benchmarks.yml

@@ -0,0 +1,44 @@
+name: Benchmark @notesnook/web
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - "master"
+    paths:
+      - "apps/web/**"
+      # re-run workflow if workflow file changes
+      - ".github/workflows/web.benchmarks.yml"
+  pull_request:
+
+jobs:
+  bench:
+    name: Bench
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: ./.github/actions/setup-node-with-cache
+
+      - name: Install packages
+        run: |
+          npm ci --ignore-scripts --prefer-offline --no-audit
+          npm run bootstrap -- --scope=web
+
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
+      - name: Build
+        run: npm run build:web
+
+      - name: Install Playwright Browsers
+        run: npx playwright install chromium --with-deps
+        working-directory: apps/web
+
+      - name: Run benchmarks
+        id: benchmark
+        run: node __bench__/app.bench.mjs
+        working-directory: apps/web

.github/workflows/web.preview.yml

@@ -1,80 +0,0 @@
-name: Notesnook Web PR Preview
-
-on:
-  pull_request:
-    types: [opened, reopened, synchronize]
-    branches: [master, beta]
-    paths:
-      - "apps/web/**"
-      - "packages/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/web.preview.yml"
-
-jobs:
-  build-and-deploy:
-    if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
-    runs-on: ubuntu-latest
-    env:
-      CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
-      CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Setup Node
-        uses: ./.github/actions/setup-node-with-cache
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Build web
-        run: npm run build:web
-
-      - name: Deploy to Cloudflare Pages
-        id: deploy
-        working-directory: ./apps/web
-        run: |
-          set -euo pipefail
-          BRANCH=pr-${{ github.event.number }}-$(echo "${{ github.sha }}" | cut -c1-7)
-          echo "Deploying branch: $BRANCH"
-          DEPLOY_OUT=$(npx --yes wrangler pages deploy --project-name=notesnook-app --branch="$BRANCH" ./build 2>&1) || { echo "$DEPLOY_OUT"; exit 1; }
-          echo "$DEPLOY_OUT"
-          PREVIEW_URL=$(printf "%s" "$DEPLOY_OUT" | grep -Eo 'https?://[^ ]+' | head -1 || true)
-          if [ -z "$PREVIEW_URL" ]; then
-            echo "WARNING: could not parse preview URL from wrangler output"
-          fi
-          echo "preview_url=$PREVIEW_URL" >> $GITHUB_ENV
-
-      - name: Post or update PR comment
-        uses: actions/github-script@v6
-        env:
-          preview_url: ${{ env.preview_url }}
-        with:
-          script: |
-            const marker = '<!-- pages-preview-comment -->';
-            const prNumber = context.issue.number;
-            const previewUrl = process.env.preview_url || '';
-            const body = `${marker}\n**Cloudflare Pages Preview**\n\n${previewUrl || 'Preview URL unavailable — check workflow logs.'}\n\nCommit: ${process.env.GITHUB_SHA}\n`;
-            const { data: comments } = await github.rest.issues.listComments({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              issue_number: prNumber,
-            });
-            const existing = comments.find(c => c.body && c.body.includes(marker));
-            if (existing) {
-              await github.rest.issues.updateComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                comment_id: existing.id,
-                body,
-              });
-            } else {
-              await github.rest.issues.createComment({
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                issue_number: prNumber,
-                body,
-              });
-            }

.github/workflows/web.publish.yml

@@ -30,6 +30,7 @@ jobs:
 
       - name: Setup environment
         run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_ACCOUNT_ID=${{ secrets.CLOUDFLARE_ACCOUNT_ID }}" >> $GITHUB_ENV
           echo "CLOUDFLARE_API_TOKEN=${{ secrets.CLOUDFLARE_API_TOKEN }}" >> $GITHUB_ENV
 

.github/workflows/web.tests.yml

@@ -9,13 +9,7 @@ on:
       - "apps/web/**"
       # re-run workflow if workflow file changes
       - ".github/workflows/web.tests.yml"
-  pull_request_target:
-    branches:
-      - "master"
-    paths:
-      - "apps/web/**"
-      # re-run workflow if workflow file changes
-      - ".github/workflows/web.tests.yml"
+  pull_request:
     types:
       - "ready_for_review"
       - "opened"
@@ -23,23 +17,12 @@ on:
       - "reopened"
 
 jobs:
-  authorize:
-    environment: ${{ github.event_name == 'pull_request_target' &&
-      github.event.pull_request.head.repo.full_name != github.repository &&
-      'external' || 'internal' }}
-    runs-on: ubuntu-latest
-    steps:
-      - run: echo true
-
   build:
-    needs: authorize
     name: Build
     runs-on: ubuntu-22.04
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-        with:
-          ref: ${{ github.event.pull_request.head.sha || github.ref }}
 
       - name: Setup Node
         uses: ./.github/actions/setup-node-with-cache
@@ -49,6 +32,10 @@ jobs:
           npm ci --ignore-scripts --prefer-offline --no-audit
           npm run bootstrap -- --scope=web
 
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
       - name: Generate test build
         run: npm run build:test:web
 
@@ -67,8 +54,6 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-        with:
-          ref: ${{ github.event.pull_request.head.sha || github.ref }}
 
       - name: Download build
         uses: actions/download-artifact@v4

.gitignore

@@ -12,4 +12,3 @@ site
 node_modules.backup
 .nx
 /*.patch
-.taskcache

.npmrc

@@ -1,2 +0,0 @@
-min-release-age=7 # days
-# ignore-scripts=true

.vscode/settings.json

@@ -11,5 +11,5 @@
     "cache": true,
     "cacheStrategy": "content"
   },
-  "git.rebaseWhenSync": false
+  "git.rebaseWhenSync": true
 }

README.md

@@ -27,6 +27,7 @@ Notesnook is built using the following technologies:
 3. React Native — For mobile apps we are using React Native
 4. Electron — For desktop app
 5. NPM — listed here because we **don't** use Yarn or PNPM or XYZ across any of our projects.
+6. Nx — maintaining monorepos is hard but Nx makes it easier.
 
 > **Note: Each project in the monorepo contains its own architecture details which you can refer to.**
 

apps/desktop/README.md

@@ -24,7 +24,7 @@ Requirements:
 
 Before you can do anything, you'll need to [install Node.js](https://nodejs.org/en/download/) v16 or later on your system.
 
-1. `clone` the monorepo:
+Once you have completed the setup, the first step is to `clone` the monorepo:
 
 ```bash
 git clone https://github.com/streetwriters/notesnook.git
@@ -33,28 +33,19 @@ git clone https://github.com/streetwriters/notesnook.git
 cd notesnook
 ```
 
-2. Install dependencies:
+Once you are inside the `./notesnook` directory, run the preparation step:
 
 ```bash
 # this might take a while to complete
 npm install
 ```
 
-3. Run the webapp for desktop environment:
-
-```bash
-cd apps/web
-npm run start:desktop
-```
-
-4. In a separate terminal session, run the desktop app from the root of the project:
+Now you can finally start the desktop app for development:
 
 ```bash
 npm run start:desktop
 ```
 
-### Release mode
-
 To run the app in release mode:
 
 ```bash

apps/desktop/__tests__/auto-updates.test.ts

@@ -17,226 +17,230 @@ 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 { testCleanup, test } from "./test-override.js";
+import { test } from "vitest";
+import { harness } from "./utils.js";
 import { writeFile } from "fs/promises";
 import { Page } from "playwright";
 import { gt, lt } from "semver";
-import { describe } from "vitest";
 
-test("update starts downloading if version is outdated", async ({
-  ctx: { page },
-  expect,
-  onTestFinished
-}) => {
-  onTestFinished(testCleanup);
+test("update starts downloading if version is outdated", async (t) => {
+  await harness(
+    t,
+    async ({ page }) => {
+      await page.waitForSelector("#authForm");
 
-  await page.waitForSelector("#authForm");
-  expect(
-    await page.getByRole("button", { name: "Create account" }).isVisible()
-  ).toBe(true);
+      t.expect(
+        await page.getByRole("button", { name: "Create account" }).isVisible()
+      ).toBe(true);
 
-  await page
-    .getByRole("button", { name: "Skip & go directly to the app" })
-    .click();
+      await page
+        .getByRole("button", { name: "Skip & go directly to the app" })
+        .click();
 
-  await skipDialog(page);
+      await skipDialog(page);
 
-  await page.waitForSelector(".ProseMirror");
+      await page.waitForSelector(".ProseMirror");
 
-  await page
-    .locator(".theme-scope-statusBar")
-    .getByRole("button", { name: /updating/i })
-    .waitFor({ state: "attached" });
-});
-
-test("update is only shown if version is outdated and auto updates are disabled", async ({
-  ctx,
-  expect,
-  onTestFinished
-}) => {
-  onTestFinished(testCleanup);
-
-  await ctx.app.close();
-  await writeFile(
-    ctx.configPath,
-    JSON.stringify({
-      automaticUpdates: false
-    })
+      await page
+        .locator(".theme-scope-statusBar")
+        .getByRole("button", { name: /updating/i })
+        .waitFor({ state: "attached" });
+    },
+    { version: "3.0.0" }
   );
-
-  await ctx.relaunch();
-
-  const { page } = ctx;
-
-  await page.waitForSelector("#authForm");
-
-  expect(
-    await page.getByRole("button", { name: "Create account" }).isVisible()
-  ).toBe(true);
-
-  await page
-    .getByRole("button", { name: "Skip & go directly to the app" })
-    .click();
-
-  await skipDialog(page);
-
-  await page.waitForSelector(".ProseMirror");
-
-  await page
-    .locator(".theme-scope-statusBar")
-    .getByRole("button", { name: /available/i })
-    .waitFor({ state: "attached" });
 });
 
-describe("update to stable if it is newer", () => {
-  test.scoped({ options: { version: "3.0.0-beta.0" } });
-  test("test", async ({ ctx, expect, onTestFinished }) => {
-    onTestFinished(testCleanup);
+test("update is only shown if version is outdated and auto updates are disabled", async (t) => {
+  await harness(
+    t,
+    async (ctx) => {
+      await ctx.app.close();
+      await writeFile(
+        ctx.configPath,
+        JSON.stringify({
+          automaticUpdates: false
+        })
+      );
 
-    await ctx.app.close();
-    await writeFile(
-      ctx.configPath,
-      JSON.stringify({
-        automaticUpdates: false,
-        releaseTrack: "beta"
-      })
-    );
+      await ctx.relaunch();
 
-    await ctx.relaunch();
+      const { page } = ctx;
 
-    const { page } = ctx;
+      await page.waitForSelector("#authForm");
 
-    await page.waitForSelector("#authForm");
+      t.expect(
+        await page.getByRole("button", { name: "Create account" }).isVisible()
+      ).toBe(true);
 
-    expect(
-      await page.getByRole("button", { name: "Create account" }).isVisible()
-    ).toBe(true);
+      await page
+        .getByRole("button", { name: "Skip & go directly to the app" })
+        .click();
 
-    await page
-      .getByRole("button", { name: "Skip & go directly to the app" })
-      .click();
+      await skipDialog(page);
 
-    await skipDialog(page);
+      await page.waitForSelector(".ProseMirror");
 
-    await page.waitForSelector(".ProseMirror");
-
-    const updateButton = page
-      .locator(".theme-scope-statusBar")
-      .getByRole("button", { name: /available/i });
-    await updateButton.waitFor({ state: "visible" });
-    const content = await updateButton.textContent();
-    const version = content?.split(" ")?.[0] || "";
-    expect(gt(version, "3.0.0-beta.0")).toBe(true);
-  });
-});
-
-describe("update is not available if it latest stable version is older", () => {
-  test.scoped({ options: { version: "99.0.0-beta.0" } });
-  test("test", async ({ ctx, expect, onTestFinished }) => {
-    onTestFinished(testCleanup);
-
-    await ctx.app.close();
-    await writeFile(
-      ctx.configPath,
-      JSON.stringify({
-        automaticUpdates: false,
-        releaseTrack: "beta"
-      })
-    );
-
-    await ctx.relaunch();
-
-    const { page } = ctx;
-
-    await page.waitForSelector("#authForm");
-
-    expect(
-      await page.getByRole("button", { name: "Create account" }).isVisible()
-    ).toBe(true);
-
-    await page
-      .getByRole("button", { name: "Skip & go directly to the app" })
-      .click();
-
-    await skipDialog(page);
-
-    await page.waitForSelector(".ProseMirror");
-
-    await page
-      .locator(".theme-scope-statusBar")
-      .getByRole("button", { name: /checking for updates/i })
-      .waitFor({ state: "hidden" });
-
-    expect(
       await page
         .locator(".theme-scope-statusBar")
         .getByRole("button", { name: /available/i })
-        .isHidden()
-    ).toBe(true);
-  });
+        .waitFor({ state: "attached" });
+    },
+    { version: "3.0.0" }
+  );
 });
 
-describe("downgrade to stable on switching to stable release track", () => {
-  test.scoped({ options: { version: "99.0.0-beta.0" } });
-  test("test", async ({ ctx, expect, onTestFinished }) => {
-    onTestFinished(testCleanup);
+test("update to stable if it is newer", async (t) => {
+  await harness(
+    t,
+    async (ctx) => {
+      await ctx.app.close();
+      await writeFile(
+        ctx.configPath,
+        JSON.stringify({
+          automaticUpdates: false,
+          releaseTrack: "beta"
+        })
+      );
 
-    await ctx.app.close();
-    await writeFile(
-      ctx.configPath,
-      JSON.stringify({
-        automaticUpdates: false,
-        releaseTrack: "stable"
-      })
-    );
+      await ctx.relaunch();
 
-    await ctx.relaunch();
+      const { page } = ctx;
 
-    const { page } = ctx;
+      await page.waitForSelector("#authForm");
 
-    await page.waitForSelector("#authForm");
+      t.expect(
+        await page.getByRole("button", { name: "Create account" }).isVisible()
+      ).toBe(true);
 
-    expect(
-      await page.getByRole("button", { name: "Create account" }).isVisible()
-    ).toBe(true);
+      await page
+        .getByRole("button", { name: "Skip & go directly to the app" })
+        .click();
 
-    await page
-      .getByRole("button", { name: "Skip & go directly to the app" })
-      .click();
+      await skipDialog(page);
 
-    await skipDialog(page);
+      await page.waitForSelector(".ProseMirror");
 
-    await page.waitForSelector(".ProseMirror");
+      const updateButton = page
+        .locator(".theme-scope-statusBar")
+        .getByRole("button", { name: /available/i });
+      await updateButton.waitFor({ state: "visible" });
+      const content = await updateButton.textContent();
+      const version = content?.split(" ")?.[0] || "";
+      t.expect(gt(version, "3.0.0-beta.0")).toBe(true);
+    },
+    { version: "3.0.0-beta.0" }
+  );
+});
 
-    await page
-      .locator(".theme-scope-statusBar")
-      .getByRole("button", { name: /checking for updates/i })
-      .waitFor({ state: "hidden" });
+test("update is not available if it latest stable version is older", async (t) => {
+  await harness(
+    t,
+    async (ctx) => {
+      await ctx.app.close();
+      await writeFile(
+        ctx.configPath,
+        JSON.stringify({
+          automaticUpdates: false,
+          releaseTrack: "beta"
+        })
+      );
 
-    const updateButton = page
-      .locator(".theme-scope-statusBar")
-      .getByRole("button", { name: /available/i });
-    await updateButton.waitFor({ state: "visible" });
-    const content = await updateButton.textContent();
-    const version = content?.split(" ")?.[0] || "";
-    expect(lt(version, "99.0.0-beta.0")).toBe(true);
-  });
+      await ctx.relaunch();
+
+      const { page } = ctx;
+
+      await page.waitForSelector("#authForm");
+
+      t.expect(
+        await page.getByRole("button", { name: "Create account" }).isVisible()
+      ).toBe(true);
+
+      await page
+        .getByRole("button", { name: "Skip & go directly to the app" })
+        .click();
+
+      await skipDialog(page);
+
+      await page.waitForSelector(".ProseMirror");
+
+      await page
+        .locator(".theme-scope-statusBar")
+        .getByRole("button", { name: /checking for updates/i })
+        .waitFor({ state: "hidden" });
+
+      t.expect(
+        await page
+          .locator(".theme-scope-statusBar")
+          .getByRole("button", { name: /available/i })
+          .isHidden()
+      ).toBe(true);
+    },
+    { version: "99.0.0-beta.0" }
+  );
+});
+
+test("downgrade to stable on switching to stable release track", async (t) => {
+  await harness(
+    t,
+    async (ctx) => {
+      await ctx.app.close();
+      await writeFile(
+        ctx.configPath,
+        JSON.stringify({
+          automaticUpdates: false,
+          releaseTrack: "stable"
+        })
+      );
+
+      await ctx.relaunch();
+
+      const { page } = ctx;
+
+      await page.waitForSelector("#authForm");
+
+      t.expect(
+        await page.getByRole("button", { name: "Create account" }).isVisible()
+      ).toBe(true);
+
+      await page
+        .getByRole("button", { name: "Skip & go directly to the app" })
+        .click();
+
+      await skipDialog(page);
+
+      await page.waitForSelector(".ProseMirror");
+
+      await page
+        .locator(".theme-scope-statusBar")
+        .getByRole("button", { name: /checking for updates/i })
+        .waitFor({ state: "hidden" });
+
+      const updateButton = page
+        .locator(".theme-scope-statusBar")
+        .getByRole("button", { name: /available/i });
+      await updateButton.waitFor({ state: "visible" });
+      const content = await updateButton.textContent();
+      const version = content?.split(" ")?.[0] || "";
+      t.expect(lt(version, "99.0.0-beta.0")).toBe(true);
+    },
+    { version: "99.0.0-beta.0" }
+  );
 });
 
 async function skipDialog(page: Page) {
-  try {
-    const dialog = page.locator(".ReactModal__Content");
-    const positiveButton = dialog.locator(
-      "button[data-role='positive-button']"
-    );
-    const negativeButton = dialog.locator(
-      "button[data-role='negative-button']"
-    );
-    if (await positiveButton.isVisible())
-      await positiveButton.click({ timeout: 1000 });
-    else if (await negativeButton.isVisible())
-      await negativeButton.click({ timeout: 1000 });
-  } catch (e) {
-    // ignore error
-  }
+  await page
+    .waitForSelector(".ReactModal__Content", {
+      timeout: 1000
+    })
+    .catch(() => {})
+    .then(async () => {
+      const positiveButton = page.locator(
+        "button[data-role='positive-button']"
+      );
+      const negativeButton = page.locator(
+        "button[data-role='negative-button']"
+      );
+      if (await positiveButton.isVisible()) await positiveButton.click();
+      else if (await negativeButton.isVisible()) await negativeButton.click();
+    });
 }

apps/desktop/__tests__/global-setup.ts

@@ -1,24 +0,0 @@
-/*
-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 { buildApp } from "./utils";
-
-export default async function setup() {
-  await buildApp();
-}

apps/desktop/__tests__/launch.test.ts

@@ -17,24 +17,22 @@ 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 { testCleanup, test } from "./test-override.js";
+import { test } from "vitest";
+import { harness } from "./utils.js";
+import assert from "assert";
 
-test("make sure app loads", async ({
-  ctx: { page },
-  expect,
-  onTestFinished
-}) => {
-  onTestFinished(testCleanup);
+test("make sure app loads", async (t) => {
+  await harness(t, async ({ page }) => {
+    await page.waitForSelector("#authForm");
 
-  await page.waitForSelector("#authForm");
+    assert.ok(
+      await page.getByRole("button", { name: "Create account" }).isVisible()
+    );
 
-  expect(
-    await page.getByRole("button", { name: "Create account" }).isVisible()
-  ).toBe(true);
+    await page
+      .getByRole("button", { name: "Skip & go directly to the app" })
+      .click();
 
-  await page
-    .getByRole("button", { name: "Skip & go directly to the app" })
-    .click();
-
-  await page.waitForSelector(".ProseMirror");
+    await page.waitForSelector(".ProseMirror");
+  });
 });

apps/desktop/__tests__/test-override.ts

@@ -1,64 +0,0 @@
-/*
-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 { test as vitestTest, TestContext } from "vitest";
-import { buildAndLaunchApp, Fixtures, TestOptions } from "./utils";
-import { mkdir, rm } from "fs/promises";
-import path from "path";
-import slugify from "slugify";
-
-export const test = vitestTest.extend<Fixtures>({
-  options: { version: "3.0.0" } as TestOptions,
-  ctx: async ({ options }, use) => {
-    const ctx = await buildAndLaunchApp(options);
-    await use(ctx);
-  }
-});
-
-export async function testCleanup(context: TestContext) {
-  const ctx = (context.task.context as unknown as Fixtures).ctx;
-  if (context.task.result?.state === "fail") {
-    await mkdir("test-results", { recursive: true });
-    await ctx.page.screenshot({
-      path: path.join(
-        "test-results",
-        `${slugify(context.task.name)}-${process.platform}-${
-          process.arch
-        }-error.png`
-      )
-    });
-  }
-  await ctx.app.close();
-  await rm(ctx.userDataDir, {
-    force: true,
-    recursive: true,
-    maxRetries: 3,
-    retryDelay: 5000
-  }).catch(() => {
-    /*ignore */
-  });
-  await rm(ctx.outputDir, {
-    force: true,
-    recursive: true,
-    maxRetries: 3,
-    retryDelay: 5000
-  }).catch(() => {
-    /*ignore */
-  });
-}

apps/desktop/__tests__/utils.ts

@@ -18,198 +18,144 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import { execSync } from "child_process";
-import { cp } from "fs/promises";
+import { mkdir } from "fs/promises";
 import { fileURLToPath } from "node:url";
-import path, { join, resolve } from "path";
+import path from "path";
 import { _electron as electron } from "playwright";
-import { existsSync } from "fs";
+import slugify from "slugify";
+import { TaskContext } from "vitest";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const IS_DEBUG = process.env.NN_DEBUG === "true" || process.env.CI === "true";
-const productName = `NotesnookTestHarness`;
-const SOURCE_DIR = resolve("output", productName);
 
-export interface AppContext {
+interface AppContext {
   app: import("playwright").ElectronApplication;
   page: import("playwright").Page;
   configPath: string;
-  userDataDir: string;
-  outputDir: string;
   relaunch: () => Promise<void>;
 }
 
-export interface TestOptions {
+interface TestOptions {
   version: string;
 }
 
-export interface Fixtures {
-  options: TestOptions;
-  ctx: AppContext;
+export async function harness(
+  t: TaskContext,
+  cb: (ctx: AppContext) => Promise<void>,
+  options?: TestOptions
+) {
+  const ctx = await buildAndLaunchApp(options);
+
+  t.onTestFinished(async (result) => {
+    if (result.state === "fail") {
+      await mkdir("test-results", { recursive: true });
+      await ctx.page.screenshot({
+        path: path.join(
+          "test-results",
+          `${slugify(t.task.name)}-${process.platform}-${
+            process.arch
+          }-error.png`
+        )
+      });
+    }
+    await ctx.app.close();
+  });
+
+  await cb(ctx);
 }
 
-export async function buildAndLaunchApp(
-  options?: TestOptions
-): Promise<AppContext> {
-  const productName = `notesnooktest${makeid(10)}`;
-  const outputDir = path.join("test-artifacts", `${productName}-output`);
-  const executablePath = await copyBuild({
-    ...options,
-    outputDir
-  });
-  const { app, page, configPath, userDataDir } = await launchApp(
-    executablePath,
-    productName,
-    options?.version
-  );
+async function buildAndLaunchApp(options?: TestOptions): Promise<AppContext> {
+  const productName = makeid(10);
+  const executablePath = await buildApp({ ...options, productName });
+  const { app, page, configPath } = await launchApp(executablePath);
   const ctx: AppContext = {
     app,
     page,
     configPath,
-    userDataDir,
-    outputDir,
     relaunch: async () => {
-      const { app, page, configPath, userDataDir } = await launchApp(
-        executablePath,
-        productName,
-        options?.version
-      );
+      const { app, page, configPath } = await launchApp(executablePath);
       ctx.app = app;
       ctx.page = page;
-      ctx.userDataDir = userDataDir;
       ctx.configPath = configPath;
     }
   };
   return ctx;
 }
 
-async function launchApp(
-  executablePath: string,
-  packageName: string,
-  version?: string
-) {
-  const userDataDir = resolve(
-    __dirname,
-    "..",
-    "test-artifacts",
-    "user_data_dirs",
-    packageName
-  );
+async function launchApp(executablePath: string) {
   const app = await electron.launch({
     executablePath,
     args: IS_DEBUG ? [] : ["--hidden"],
-    env: {
-      ...(process.platform === "linux"
+    env:
+      process.platform === "linux"
         ? {
             ...(process.env as Record<string, string>),
             APPIMAGE: "true"
           }
-        : (process.env as Record<string, string>)),
-      CUSTOM_USER_DATA_DIR: userDataDir,
-      ...(version
-        ? {
-            CUSTOM_APP_VERSION: version
-          }
-        : {})
-    }
+        : (process.env as Record<string, string>)
   });
 
   const page = await app.firstWindow();
 
-  const configPath = path.join(userDataDir, "UserData", "config.json");
+  const userDataDirectory = await app.evaluate((a) => {
+    return a.app.getPath("userData");
+  });
+  const configPath = path.join(userDataDirectory, "config.json");
   return {
     app,
     page,
-    configPath,
-    userDataDir
+    configPath
   };
 }
 
-let MAX_RETRIES = 3;
-export async function buildApp(version?: string) {
-  if (!existsSync(SOURCE_DIR)) {
-    const args = [
-      "electron-builder",
-      "--dir",
-      `--${process.arch}`,
-      `--config electron-builder.config.js`,
-      `--c.extraMetadata.productName=${productName}`,
-      `--c.compression=store`,
-      "--publish=never"
-    ];
-    if (version) args.push(`--c.extraMetadata.version=${version}`);
-    try {
-      execSync(`npx ${args.join(" ")}`, {
-        stdio: IS_DEBUG ? "inherit" : "ignore",
-        env: {
-          ...process.env,
-          NOTESNOOK_STAGING: "true",
-          NN_PRODUCT_NAME: productName,
-          NN_APP_ID: `com.notesnook.test.${productName}`,
-          NN_OUTPUT_DIR: SOURCE_DIR
-        }
-      });
-    } catch (e) {
-      if (--MAX_RETRIES) {
-        console.log("retrying...");
-        return await buildApp(version);
-      } else throw e;
-    }
-  }
-}
-
-async function copyBuild({ outputDir }: { outputDir: string }) {
-  return process.platform === "win32"
-    ? await makeBuildCopyWindows(outputDir, productName)
-    : process.platform === "darwin"
-    ? await makeBuildCopyMacOS(outputDir, productName)
-    : await makeBuildCopyLinux(outputDir, productName);
-}
-
-async function makeBuildCopyLinux(outputDir: string, productName: string) {
-  const platformDir =
-    process.arch === "arm64" ? "linux-arm64-unpacked" : "linux-unpacked";
-  const appDir = await makeBuildCopy(outputDir, platformDir);
-  return resolve(
-    __dirname,
-    "..",
-    appDir,
-    productName.toLowerCase().replace(/\s+/g, "-")
-  );
-}
-
-async function makeBuildCopyWindows(outputDir: string, productName: string) {
-  const platformDir =
-    process.arch === "arm64" ? "win-arm64-unpacked" : "win-unpacked";
-  const appDir = await makeBuildCopy(outputDir, platformDir);
-  return resolve(__dirname, "..", appDir, `${productName}.exe`);
-}
-
-async function makeBuildCopyMacOS(outputDir: string, productName: string) {
-  const platformDir = process.arch === "arm64" ? "mac-arm64" : "mac";
-  const appDir = await makeBuildCopy(outputDir, platformDir);
-  return resolve(
-    __dirname,
-    "..",
-    appDir,
-    `${productName}.app`,
-    "Contents",
-    "MacOS",
-    productName
-  );
-}
-
-async function makeBuildCopy(outputDir: string, platformDir: string) {
-  const appDir = outputDir;
-  await cp(join(SOURCE_DIR, platformDir), outputDir, {
-    recursive: true,
-    preserveTimestamps: true,
-    verbatimSymlinks: true,
-    dereference: false,
-    force: true
+async function buildApp({
+  version,
+  productName
+}: {
+  version?: string;
+  productName: string;
+}) {
+  const buildRoot = path.join("test-artifacts", `${productName}-build`);
+  const output = path.join("test-artifacts", `${productName}-output`);
+  execSync(`npm run release -- --root ${buildRoot} --skip-tsc-build`, {
+    stdio: IS_DEBUG ? "inherit" : "ignore"
   });
 
-  return appDir;
+  const args = [
+    `--config electron-builder.config.js`,
+    `--c.extraMetadata.productName=${productName}`,
+    "--publish=never"
+  ];
+  if (version) args.push(`--c.extraMetadata.version=${version}`);
+
+  execSync(`npx electron-builder --dir --${process.arch} ${args.join(" ")}`, {
+    stdio: IS_DEBUG ? "inherit" : "ignore",
+    env: {
+      ...process.env,
+      NOTESNOOK_STAGING: "true",
+      NN_BUILD_ROOT: buildRoot,
+      NN_PRODUCT_NAME: productName,
+      NN_APP_ID: `com.notesnook.test.${productName}`,
+      NN_OUTPUT_DIR: output
+    }
+  });
+
+  return path.join(
+    __dirname,
+    "..",
+    output,
+    process.platform === "linux"
+      ? process.arch === "arm64"
+        ? "linux-arm64-unpacked"
+        : "linux-unpacked"
+      : process.platform === "darwin"
+      ? process.arch === "arm64"
+        ? `mac-arm64/${productName}.app/Contents/MacOS/`
+        : `mac/${productName}.app/Contents/MacOS/`
+      : "win-unpacked",
+    process.platform === "win32" ? `${productName}.exe` : productName
+  );
 }
 
 function makeid(length: number) {

apps/desktop/electron-builder.config.js

@@ -47,11 +47,7 @@ module.exports = {
   copyright: `Copyright © ${year} Streetwriters (Private) Limited`,
   artifactName: "notesnook_${os}_${arch}.${ext}",
   generateUpdatesFilesForAllChannels: true,
-  asar: true,
-  asarUnpack: [
-    "node_modules/sqlite-better-trigram-@(linux|darwin|windows)-${arch}/**/*",
-    "node_modules/sqlite3-fts5-html-@(linux|darwin|windows)-${arch}/**/*"
-  ],
+  asar: false,
   files: [
     "!*.chunk.js.map",
     "!*.chunk.js.LICENSE.txt",
@@ -198,9 +194,6 @@ module.exports = {
       }
     }
   },
-  toolsets: {
-    appimage: "1.0.2"
-  },
   snap: {
     autoStart: false,
     confinement: "strict",

apps/desktop/package.json

@@ -2,15 +2,13 @@
   "name": "@notesnook/desktop",
   "productName": "Notesnook",
   "description": "Your private note taking space",
-  "version": "3.3.22",
+  "version": "3.2.2",
   "appAppleId": "1544027013",
   "private": true,
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
   "types": "./dist/types/index.d.ts",
-  "sideEffects": [
-    "src/overrides.ts"
-  ],
+  "sideEffects": false,
   "exports": {
     ".": {
       "require": {
@@ -32,12 +30,12 @@
     "@notesnook/ui": "file:../../packages/ui",
     "@trpc/client": "10.45.2",
     "@trpc/server": "10.45.2",
-    "better-sqlite3-multiple-ciphers": "^12.4.1",
+    "better-sqlite3-multiple-ciphers": "^11.10.0",
     "electron-trpc": "0.7.1",
     "electron-updater": "^6.6.2",
     "icojs": "^0.19.5",
-    "sqlite-better-trigram": "0.0.5",
-    "sqlite3-fts5-html": "^0.0.6",
+    "sqlite-better-trigram": "0.0.3",
+    "sqlite3-fts5-html": "^0.0.3",
     "typed-emitter": "^2.1.0",
     "yargs": "^17.7.2",
     "zod": "3.24.3"
@@ -47,8 +45,8 @@
     "@types/node": "22.15.3",
     "@types/yargs": "^17.0.33",
     "chokidar": "^4.0.3",
-    "electron": "^37.0.0",
-    "electron-builder": "^26.8.1",
+    "electron": "^34.0.0",
+    "electron-builder": "^26.0.12",
     "esbuild": "0.21.5",
     "node-abi": "^4.5.0",
     "node-gyp-build": "^4.8.4",
@@ -57,7 +55,7 @@
     "slugify": "1.6.6",
     "tree-kill": "^1.2.2",
     "undici": "^7.8.0",
-    "vitest": "^3.2.4"
+    "vitest": "2.1.8"
   },
   "optionalDependencies": {
     "dmg-license": "^1.0.11"

apps/desktop/scripts/build.mjs

@@ -17,7 +17,6 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-console.log("starting build...");
 import path from "path";
 import fs from "fs/promises";
 import { existsSync } from "fs";
@@ -27,7 +26,6 @@ import * as childProcess from "child_process";
 import { fileURLToPath } from "url";
 import { patchBetterSQLite3 } from "./patch-better-sqlite3.mjs";
 
-console.log("imports done...");
 const args = yargs(process.argv);
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -36,22 +34,11 @@ const skipTscBuild = args.skipTscBuild || false;
 
 const webAppPath = path.resolve(path.join(__dirname, "..", "..", "web"));
 
-console.log("loaded args", {
-  args,
-  __filename,
-  __dirname,
-  root,
-  skipTscBuild,
-  webAppPath
-});
 await fs.rm(path.join(root, "build"), { force: true, recursive: true });
 
-console.log("removed build folder");
-
 if (args.rebuild || !existsSync(path.join(webAppPath, "build"))) {
-  console.log("rebuilding...");
   await exec(
-    "node scripts/execute.mjs @notesnook/web:build:desktop",
+    "npx nx build:desktop @notesnook/web",
     path.join(__dirname, "..", "..", "..")
   );
 }

apps/desktop/scripts/dev.mjs

@@ -27,7 +27,6 @@ import crypto from "crypto";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
-const root = path.join(__dirname, "..");
 const RUNNING_PROCESSES = [];
 const RESTARTABLE_PROCESSES = [];
 let lastBundleHash = null;
@@ -37,7 +36,7 @@ const ENV = {
   FORCE_COLOR: "false",
   COLOR: "0"
 };
-process.chdir(root);
+process.chdir(path.join(__dirname, ".."));
 
 await onChange(true);
 
@@ -56,16 +55,13 @@ async function onChange(first) {
   if (first) {
     await fs.rm("./build/", { force: true, recursive: true });
 
-    await exec(
-      "npm run postinstall --verbose",
-      path.join(root, "node_modules", "electron")
-    );
+    await exec("npm rebuild electron --verbose --foreground-scripts");
 
-    await exec("yarn electron-builder install-app-deps", root);
+    await exec("yarn electron-builder install-app-deps");
   }
 
-  await exec(`yarn run bundle`, root);
-  await exec(`yarn run build`, root);
+  await exec(`yarn run bundle`);
+  await exec(`yarn run build`);
 
   if (await isBundleSame()) {
     console.log("Bundle is same. Doing nothing.");
@@ -115,7 +111,7 @@ function spawnAndWaitUntil(cmd, cwd, predicate) {
 
 async function exec(cmd, cwd) {
   try {
-    console.log(">", cmd, cwd);
+    console.log(">", cmd);
 
     return execSync(cmd, {
       env: ENV,

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

@@ -33,17 +33,16 @@ import { AutoLaunch } from "../utils/autolaunch";
 import { config, DesktopIntegration } from "../utils/config";
 import { bringToFront } from "../utils/bring-to-front";
 import { getTheme, setTheme, Theme } from "../utils/theme";
-import { existsSync, mkdirSync, writeFileSync } from "fs";
+import { mkdirSync, writeFileSync } from "fs";
 import { dirname } from "path";
 import { resolvePath } from "../utils/resolve-path";
 import { observable } from "@trpc/server/observable";
 import { AssetManager } from "../utils/asset-manager";
-import { isFlatpak, isPortable, isSnap } from "../utils";
+import { isFlatpak, isSnap } from "../utils";
 import { setupDesktopIntegration } from "../utils/desktop-integration";
 import { rm } from "fs/promises";
 import { disableCustomDns, enableCustomDns } from "../utils/custom-dns";
 import type { MenuItem as NNMenuItem } from "@notesnook/ui";
-import { platform } from "os";
 
 const t = initTRPC.create();
 
@@ -61,7 +60,6 @@ const NotificationOptions = z.object({
 export const osIntegrationRouter = t.router({
   isFlatpak: t.procedure.query(() => isFlatpak()),
   isSnap: t.procedure.query(() => isSnap()),
-  isPortable: t.procedure.query(() => isPortable()),
 
   zoomFactor: t.procedure.query(() => config.zoomFactor),
   setZoomFactor: t.procedure.input(z.number()).mutation(({ input: factor }) => {
@@ -180,9 +178,7 @@ export const osIntegrationRouter = t.router({
         })
       });
       notification.show();
-      if (input.urgency === "critical" && process.platform !== "linux") {
-        // due to an Electron bug in versions below 40.x, shell.beep() causes a segfault on Linux.
-        // TODO: Remove when migrating to Electron 40.x or newer.
+      if (input.urgency === "critical") {
         shell.beep();
       }
 
@@ -193,28 +189,9 @@ export const osIntegrationRouter = t.router({
     }),
   openPath: t.procedure
     .input(z.object({ type: z.literal("path"), link: z.string() }))
-    .query(async ({ input }) => {
-      if (isFlatpak()) return;
-
+    .query(({ input }) => {
       const { type, link } = input;
-      if (type !== "path") return;
-
-      const resolvedPath = resolvePath(
-        // remove leading slash from path on windows
-        platform() === "win32" ? link.slice(1) : link
-      );
-      if (!existsSync(resolvedPath)) {
-        if (globalThis.window) {
-          await dialog.showMessageBox(globalThis.window, {
-            type: "error",
-            title: "Path not found",
-            message: `The path does not exist:\n${wrapPath(resolvedPath)}`
-          });
-        }
-        return;
-      }
-
-      await shell.openPath(resolvedPath);
+      if (type === "path") return shell.openPath(resolvePath(link));
     }),
   bringToFront: t.procedure.query(() => bringToFront()),
   changeTheme: t.procedure
@@ -275,7 +252,6 @@ export const osIntegrationRouter = t.router({
           if (menuItem) menu.append(menuItem);
         }
         if (menu.items.length > 0) menu.popup();
-        menu.on("menu-will-close", () => emit.next([]));
         return () => {
           menu.removeAllListeners();
           menu.closePopup();
@@ -319,7 +295,3 @@ function toMenuItem(
     }
   }
 }
-
-function wrapPath(path: string, maxLineLength = 100): string {
-  return path.replace(new RegExp(`(.{${maxLineLength}})`, "g"), "$1\n");
-}

apps/desktop/src/api/spell-checker.ts

@@ -84,55 +84,35 @@ const LANGUAGES: Record<string, string> = {
 
 type Language = { code: string; name: string };
 
-const LANGUAGE_REDIRECT_MAP: Record<string, string> = {
-  es: "es-MX",
-  "es-419": "es-MX",
-  "es-ES": "es-AR"
-};
-
 export const spellCheckerRouter = t.router({
   isEnabled: t.procedure.query(() => config.isSpellCheckerEnabled),
-  languages: t.procedure.query(() => {
-    const available =
-      globalThis.window?.webContents.session.availableSpellCheckerLanguages ||
-      [];
-
-    return <Language[]>available
-      .map((code) => ({
-        code,
-        name: LANGUAGES[code] || code
-      }))
-      .sort((a, b) => a.name.localeCompare(b.name));
-  }),
-
-  enabledLanguages: t.procedure.query(() => {
-    const enabled =
-      globalThis.window?.webContents.session.getSpellCheckerLanguages() || [];
-    const available =
-      globalThis.window?.webContents.session.availableSpellCheckerLanguages ||
-      [];
-
-    const resolved = enabled
-      .map((code) => resolveLanguage(code, available))
-      .filter(Boolean) as string[];
-
-    return <Language[]>resolved.map((code) => ({
-      code,
-      name: LANGUAGES[code] || code
-    }));
-  }),
-
-  setLanguages: t.procedure.input(z.array(z.string())).mutation(({ input }) => {
-    const available =
-      globalThis.window?.webContents.session.availableSpellCheckerLanguages ||
-      [];
-
-    const resolved = input
-      .map((code) => resolveLanguage(code, available))
-      .filter(Boolean) as string[];
-
-    globalThis.window?.webContents.session.setSpellCheckerLanguages(resolved);
-  }),
+  languages: t.procedure.query(
+    () =>
+      <Language[]>(
+        globalThis.window?.webContents.session.availableSpellCheckerLanguages.map(
+          (code) => ({
+            code,
+            name: LANGUAGES[code]
+          })
+        )
+      )
+  ),
+  enabledLanguages: t.procedure.query(
+    () =>
+      <Language[]>(
+        globalThis.window?.webContents.session
+          .getSpellCheckerLanguages()
+          .map((code) => ({
+            code,
+            name: LANGUAGES[code]
+          }))
+      )
+  ),
+  setLanguages: t.procedure
+    .input(z.array(z.string()))
+    .mutation(({ input: languages }) =>
+      globalThis.window?.webContents.session.setSpellCheckerLanguages(languages)
+    ),
   toggle: t.procedure
     .input(z.object({ enabled: z.boolean() }))
     .mutation(({ input: { enabled } }) => {
@@ -148,16 +128,3 @@ export const spellCheckerRouter = t.router({
     );
   })
 });
-
-function resolveLanguage(code: string, available: string[]) {
-  if (LANGUAGE_REDIRECT_MAP[code]) {
-    const working = LANGUAGE_REDIRECT_MAP[code];
-    return available.includes(working) ? working : code;
-  }
-  const fallback = code.split("-")[0];
-  return available.includes(code)
-    ? code
-    : available.includes(fallback)
-    ? fallback
-    : undefined;
-}

apps/desktop/src/api/sqlite-kysely.ts

@@ -113,8 +113,7 @@ export class SQLite {
         };
       }
     } catch (e) {
-      if (e instanceof Error)
-        throw rewriteError(e, `${e.message} (query: ${sql})`);
+      if (e instanceof Error) e.message += ` (query: ${sql})`;
       throw e;
     } finally {
       // Since SQLite 3.48.0 (SQLite3MC v2.0.2) it's not possible to load fts5
@@ -124,21 +123,15 @@ export class SQLite {
       // fts5 API, we must wait decrypt the database before we can load
       // the extensions.
       if (!this.extensionsLoaded && (await this.isDatabaseReady())) {
-        this.loadExtensions();
+        const betterTrigram = require("sqlite-better-trigram");
+        const fts5Html = require("sqlite3-fts5-html");
+        betterTrigram.load(this.sqlite);
+        fts5Html.load(this.sqlite);
+        this.extensionsLoaded = true;
       }
     }
   }
 
-  private loadExtensions() {
-    this.sqlite?.loadExtension(
-      getExtensionPath("sqlite-better-trigram", "better-trigram")
-    );
-    this.sqlite?.loadExtension(
-      getExtensionPath("sqlite3-fts5-html", "fts5-html")
-    );
-    this.extensionsLoaded = true;
-  }
-
   async run<R>(
     sql: string,
     parameters?: SQLiteCompatibleType[]
@@ -182,42 +175,3 @@ export class SQLite {
     }
   }
 }
-
-function getExtensionPath(extensionName: string, entryPoint: string) {
-  const path = require("path");
-  const { statSync } = require("fs");
-
-  const os = process.platform === "win32" ? "windows" : process.platform;
-  const packageName = `${extensionName}-${os}-${process.arch}`;
-  const extensionSuffix =
-    process.platform === "win32"
-      ? "dll"
-      : process.platform === "darwin"
-      ? "dylib"
-      : "so";
-  let loadablePath = path.join(
-    require.resolve(extensionName),
-    "..",
-    "..",
-    packageName,
-    `${entryPoint}.${extensionSuffix}`
-  );
-
-  if (loadablePath.includes(".asar"))
-    loadablePath = loadablePath
-      .replace("electron.asar", "app.asar")
-      .replace(".asar", ".asar.unpacked");
-
-  if (!statSync(loadablePath, { throwIfNoEntry: false })) {
-    throw new Error(`${extensionName} not found at ${loadablePath}.`);
-  }
-  return loadablePath;
-}
-
-function rewriteError(e: Error, message: string) {
-  const error = new Error(message);
-  error.stack = e.stack;
-  error.name = e.name;
-  error.cause = e.cause;
-  return error;
-}

apps/desktop/src/api/updater.ts

@@ -24,7 +24,6 @@ import type { AppUpdaterEvents } from "electron-updater/out/AppUpdater";
 import { z } from "zod";
 import { config } from "../utils/config";
 import { app } from "electron";
-import { isFlatpak, isPortable, isSnap } from "../utils";
 
 type UpdateInfo = { version: string };
 type Progress = { percent: number };
@@ -32,15 +31,13 @@ type Progress = { percent: number };
 const t = initTRPC.create();
 let cancellationToken: CancellationToken | undefined = undefined;
 let downloadTimeout: NodeJS.Timeout | undefined = undefined;
-const updatesSupported = !isFlatpak() && !isSnap() && !isPortable();
+
 export const updaterRouter = t.router({
-  autoUpdates: t.procedure.query(
-    () => updatesSupported && config.automaticUpdates
-  ),
+  autoUpdates: t.procedure.query(() => config.automaticUpdates),
   releaseTrack: t.procedure.query(() => config.releaseTrack),
   install: t.procedure.query(() => autoUpdater.quitAndInstall()),
   download: t.procedure.query(async () => {
-    if (!updatesSupported || cancellationToken) return;
+    if (cancellationToken) return;
     clearTimeout(downloadTimeout);
     await new Promise<string[]>((resolve, reject) => {
       downloadTimeout = setTimeout(async () => {
@@ -55,7 +52,7 @@ export const updaterRouter = t.router({
     });
   }),
   check: t.procedure.query(async () => {
-    if (!updatesSupported || cancellationToken) return;
+    if (cancellationToken) return;
     clearTimeout(downloadTimeout);
     await new Promise<void>((resolve) => {
       downloadTimeout = setTimeout(async () => {

apps/desktop/src/api/window.ts

@@ -34,17 +34,6 @@ export const windowRouter = t.router({
   }),
   maximized: t.procedure.query(() => globalThis.window?.isMaximized()),
   fullscreen: t.procedure.query(() => globalThis.window?.isFullScreen()),
-  onClose: t.procedure.subscription(() => {
-    return observable<void>((emit) => {
-      function listener() {
-        emit.next();
-      }
-      globalThis.window?.addListener("close", listener);
-      return () => {
-        globalThis.window?.removeListener("close", listener);
-      };
-    });
-  }),
   onWindowStateChanged: t.procedure.subscription(() => {
     return observable<{ maximized: boolean; fullscreen: boolean }>((emit) => {
       function listener() {

apps/desktop/src/main.ts

@@ -17,8 +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 "./overrides";
-import { app, BrowserWindow, nativeTheme, shell, dialog } from "electron";
+import { app, BrowserWindow, nativeTheme, shell } from "electron";
 import { isDevelopment } from "./utils";
 import { registerProtocol, PROTOCOL_URL } from "./utils/protocol";
 import { configureAutoUpdater } from "./utils/autoupdater";
@@ -52,9 +51,6 @@ locale.then(({ default: locale }) => {
 });
 setI18nGlobal(i18n);
 
-const appHostnames = isDevelopment()
-  ? ["localhost", "127.0.0.1"]
-  : ["app.notesnook.com"];
 // only run a single instance
 if (!MAC_APP_STORE && !app.requestSingleInstanceLock()) {
   console.log("Another instance is already running!");
@@ -176,19 +172,6 @@ async function createWindow() {
     return { action: "deny" };
   });
 
-  mainWindow.webContents.on("will-navigate", (event, url) => {
-    try {
-      const parsedUrl = new URL(url);
-      if (!appHostnames.includes(parsedUrl.hostname)) {
-        event.preventDefault();
-        shell.openExternal(url);
-      }
-    } catch (e) {
-      console.error("will-navigate: failed to parse URL", url, e);
-      event.preventDefault();
-    }
-  });
-
   nativeTheme.on("updated", () => {
     setupTray();
     setupJumplist();
@@ -198,17 +181,6 @@ async function createWindow() {
 app.once("ready", async () => {
   console.info("App ready. Opening window.");
 
-  if (app.runningUnderARM64Translation) {
-    console.log("App is running under ARM64 translation");
-    dialog.showMessageBoxSync({
-      message:
-        "Notesnook detected that it is running under ARM64 translation. For the best performance, please download the ARM64 build of Notesnook from our website.",
-      type: "warning",
-      buttons: ["Okay"],
-      title: "Degraded Performance Warning"
-    });
-  }
-
   if (config.customDns) enableCustomDns();
   else disableCustomDns();
 

apps/desktop/src/overrides.ts

@@ -1,41 +0,0 @@
-/*
-This file is part of the Notesnook project (https://notesnook.com/)
-
-Copyright (C) 2023 Streetwriters (Private) Limited
-
-This program is free software: you can redistribute it and/or modify
-it under the terms of the GNU General Public License as published by
-the Free Software Foundation, either version 3 of the License, or
-(at your option) any later version.
-
-This program is distributed in the hope that it will be useful,
-but WITHOUT ANY WARRANTY; without even the implied warranty of
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-GNU General Public License for more details.
-
-You should have received a copy of the GNU General Public License
-along with this program.  If not, see <http://www.gnu.org/licenses/>.
-*/
-import { app } from "electron";
-import path from "path";
-
-const customVersion = process.env.CUSTOM_APP_VERSION;
-if (customVersion) {
-  app.getVersion = () => customVersion;
-  console.log("setting custom version:", customVersion);
-}
-
-if (process.env.CUSTOM_USER_DATA_DIR) {
-  app.setPath(
-    "appData",
-    path.join(process.env.CUSTOM_USER_DATA_DIR, "AppData")
-  );
-  app.setPath(
-    "userData",
-    path.join(process.env.CUSTOM_USER_DATA_DIR, "UserData")
-  );
-  app.setPath(
-    "documents",
-    path.join(process.env.CUSTOM_USER_DATA_DIR, "Documents")
-  );
-}

apps/desktop/src/utils/autolaunch.ts

@@ -39,7 +39,7 @@ const LINUX_AUTOSTART_DIRECTORY_PATH = path.join(
   "autostart"
 );
 
-const HIDDEN_ARG = "--hidden";
+const STARTUP_ARGS = ["--hidden"];
 
 export class AutoLaunch {
   static enable(hidden: boolean) {
@@ -54,13 +54,13 @@ export class AutoLaunch {
       );
     } else {
       const loginItemSettings = app.getLoginItemSettings({
-        args: hidden ? [HIDDEN_ARG] : undefined
+        args: STARTUP_ARGS
       });
       if (loginItemSettings.openAtLogin) return;
       app.setLoginItemSettings({
         openAtLogin: true,
         openAsHidden: hidden,
-        args: hidden ? [HIDDEN_ARG] : undefined
+        args: STARTUP_ARGS
       });
     }
   }

apps/desktop/src/utils/autoupdater.ts

@@ -37,11 +37,7 @@ async function configureAutoUpdater() {
     config.releaseTrack === "stable" &&
     autoUpdater.currentVersion.prerelease.length > 0;
   autoUpdater.allowPrerelease = false;
-  // Do NOT auto-install on quit. On Windows, if the system shuts down while
-  // the NSIS installer is running, it first removes all old files and then
-  // gets killed before copying new ones — leaving an empty install directory.
-  // Updates should only be installed when the user explicitly triggers it.
-  autoUpdater.autoInstallOnAppQuit = false;
+  autoUpdater.autoInstallOnAppQuit = true;
   autoUpdater.disableWebInstaller = true;
 }
 

apps/desktop/src/utils/index.ts

@@ -33,7 +33,3 @@ export function isFlatpak() {
 export function isSnap() {
   return process.env.SNAP !== undefined;
 }
-
-export function isPortable() {
-  return process.env.PORTABLE_EXECUTABLE_DIR !== undefined;
-}

apps/desktop/src/utils/protocol.ts

@@ -62,17 +62,7 @@ function registerProtocol() {
         headers: { "Content-Type": extensionToMimeType[fileExtension] }
       });
     } else {
-      const requestHeaders = new Headers(request.headers);
-      if (!requestHeaders.has("referer"))
-        requestHeaders.set("referer", PROTOCOL_URL);
-      return await net.fetch(
-        new Request(request, {
-          headers: requestHeaders
-        }),
-        {
-          bypassCustomProtocolHandlers: true
-        }
-      );
+      return net.fetch(request, { bypassCustomProtocolHandlers: true });
     }
   });
   console.info(`${SCHEME} protocol inteception "successful"`);

apps/desktop/vitest.config.ts

@@ -21,13 +21,11 @@ import { defineConfig } from "vitest/config";
 
 export default defineConfig({
   test: {
-    testTimeout: 120 * 1000,
-    hookTimeout: 120 * 1000,
+    testTimeout: process.env.CI ? 120 * 1000 : 120 * 1000,
     sequence: {
       concurrent: true,
       shuffle: true
     },
-    globalSetup: "./__tests__/global-setup.ts",
     dir: "./__tests__/",
     exclude: [
       "**/node_modules/**",

apps/mobile/.detoxrc.js

@@ -1,92 +0,0 @@
-/** @type {Detox.DetoxConfig} */
-module.exports = {
-  testRunner: {
-    args: {
-      $0: "jest",
-      config: "e2e/jest.config.js"
-    },
-    jest: {
-      setupTimeout: 120000
-    }
-  },
-  apps: {
-    "ios.debug": {
-      type: "ios.app",
-      binaryPath:
-        "ios/build/Build/Products/Debug-iphonesimulator/Notesnook.app",
-      build:
-        "xcodebuild -workspace ios/Notesnook.xcworkspace -scheme YOUR_APP -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build"
-    },
-    "ios.release": {
-      type: "ios.app",
-      binaryPath:
-        "ios/build/Build/Products/Release-iphonesimulator/Notesnook.app",
-      build:
-        "xcodebuild -workspace ios/Notesnook.xcworkspace -scheme YOUR_APP -configuration Release -sdk iphonesimulator -derivedDataPath ios/build"
-    },
-    "android.debug": {
-      type: "android.apk",
-      binaryPath: "android/app/build/outputs/apk/debug/app-arm64-v8a-debug.apk",
-      testBinaryPath:
-        "android/app/build/outputs/apk/androidTest/debug/app-debug-androidTest.apk",
-      build:
-        "cd android ; ENVFILE=.env.test ./gradlew assembleDebug assembleAndroidTest -DtestBuildType=debug && cd ..",
-      reversePorts: [8081]
-    },
-    "android.release": {
-      type: "android.apk",
-      binaryPath:
-        "android/app/build/outputs/apk/release/app-arm64-v8a-release.apk",
-      testBinaryPath:
-        "android/app/build/outputs/apk/androidTest/release/app-release-androidTest.apk",
-      build:
-        "cd android ; ENVFILE=.env.test ./gradlew assembleRelease assembleAndroidTest -DtestBuildType=release ; cd .."
-    }
-  },
-  devices: {
-    simulator: {
-      type: "ios.simulator",
-      device: {
-        type: "iPhone 17 Pro Max"
-      }
-    },
-    attached: {
-      type: "android.attached",
-      device: {
-        adbName: ".*"
-      }
-    },
-    emulator: {
-      type: "android.emulator",
-      device: {
-        avdName: "Pixel_5_API_36"
-      }
-    }
-  },
-  configurations: {
-    "ios.sim.debug": {
-      device: "simulator",
-      app: "ios.debug"
-    },
-    "ios.sim.release": {
-      device: "simulator",
-      app: "ios.release"
-    },
-    "android.att.debug": {
-      device: "attached",
-      app: "android.debug"
-    },
-    "android.att.release": {
-      device: "attached",
-      app: "android.release"
-    },
-    "android.emu.debug": {
-      device: "emulator",
-      app: "android.debug"
-    },
-    "android.emu.release": {
-      device: "emulator",
-      app: "android.release"
-    }
-  }
-};

apps/mobile/.gitignore

@@ -4,7 +4,7 @@ artifacts/
 #
 .DS_Store
 
-android/app/src/main/assets/
+native/android/app/src/main/assets/
 *Issues.md
 build_cache/
 #
@@ -16,12 +16,11 @@ build_cache/
 .cxx/
 *.keystore
 !debug.keystore
-.kotlin/
 
 # Xcode
 #
-ios/Pods
-ios/DerivedData
+native/ios/Pods
+native/ios/DerivedData
 build/
 *.pbxuser
 !default.pbxuser
@@ -40,7 +39,7 @@ DerivedData
 *.xcuserstate
 *.hprof
 **/.xcode.env.local
-cache
+native/cache
 # Android/IntelliJ
 #
 rn-build-deps/
@@ -58,7 +57,7 @@ yarn-error.log
 # BUCK
 buck-out/
 \.buckd/
-
+*.keystore
 
 # fastlane
 #
@@ -70,7 +69,7 @@ buck-out/
 */fastlane/report.xml
 */fastlane/Preview.html
 */fastlane/screenshots
-vendor
+native/vendor
 
 # Bundle artifact
 *.jsbundle

apps/mobile/README.md

@@ -3,8 +3,10 @@
 </p>
 
 <h1 align="center">Notesnook Mobile</h1>
-<h3 align="center">The mobile app is built with React Native for both iOS and Android.</h3>
-<p align="center"><a href="#build-instructions">Build instructions</a> | <a href="#developer-guide">Developer guide</a> | <a href="#running-e2e-tests-detox">E2E tests</a></p>
+<h3 align="center">The mobile app is built using React Native, Typescript & Javascript for both iOS & Android.</h3>
+<p align="center">
+<a href="#developer-guide">Developer guide</a> | <a href="#build-instructions">How to build?</a>
+</p>
 
 <p align="center">
     <a href="https://play.google.com/store/apps/details?id=com.streetwriters.notesnook">
@@ -23,21 +25,21 @@
 
 Requirements:
 
-1. [Node.js](https://nodejs.org/en/download/) 20+ (the repo is pinned to Node `22.20.0` via Volta)
+1. [Node.js](https://nodejs.org/en/download/)
 2. [git](https://git-scm.com/downloads)
-3. `npm`
-4. [React Native environment setup](https://reactnative.dev/docs/set-up-your-environment)
+3. NPM (not yarn or pnpm)
+4. [React Native](https://reactnative.dev/docs/environment-setup)
 
-To run the app locally, first complete React Native native tooling setup:
+To run the app locally, you will need to setup React Native on your system:
 
-1. Open [React Native environment setup](https://reactnative.dev/docs/set-up-your-environment)
+1. Open the official [environment setup guide here](https://reactnative.dev/docs/environment-setup)
 2. Select `React Native CLI Quickstart`
-3. Select your OS and target platform(s): iOS and/or Android
+3. Select your OS & the platform to run the app on (iOS or Android)
 4. Follow the steps listed.
 
-> Expo is not used in this project.
+> Please keep in mind that **Expo is not supported**.
 
-Clone the monorepo:
+Once you have completed the setup, the first step is to `clone` the monorepo:
 
 ```bash
 git clone https://github.com/streetwriters/notesnook.git
@@ -46,27 +48,26 @@ git clone https://github.com/streetwriters/notesnook.git
 cd notesnook
 ```
 
-Install dependencies and bootstrap the mobile workspace:
+Once you are inside the `./notesnook` directory, run the preparation step:
 
 ```bash
 # this might take a while to complete
 npm install
-npm run bootstrap -- --scope=mobile
 ```
 
 ### Running the app on Android
 
-[Set up an Android emulator from Android Studio](https://developer.android.com/studio/run/managing-avds) (or connect a physical device), then run:
+[Setup an Android emulator from Android Studio](https://developer.android.com/studio/run/managing-avds) if you haven't already, and then run the following command to start the app in the Emulator:
 
 ```bash
 npm run start:android
 ```
 
-If you are using a physical device, enable [USB debugging](https://developer.android.com/studio/debug/dev-options).
+If you want to run the app on your phone, make sure to [enable USB debugging](https://developer.android.com/studio/debug/dev-options).
 
 ### Running the app on iOS
 
-Install CocoaPods dependencies first, then run the iOS app:
+To run the app on iOS:
 
 ```bash
 # this might take a while to complete
@@ -75,87 +76,90 @@ npm run prepare:ios
 npm run start:ios
 ```
 
-### Useful development commands
-
-```bash
-# start Metro only
-npm run start:metro
-
-# start Re.Pack bundler
-npm run start:repack
-```
-
 ## Developer guide
 
-> The mobile app is a mixed TypeScript/JavaScript codebase.
+> This project is in a transition state between Javascript & Typescript. We are gradually porting everything over to Typescript, so if you can help with that, it'd be great!
 
 ### The tech stack
 
 We try to keep the stack as lean as possible:
 
-1. React Native `0.82`
-2. React `19`
-3. TypeScript + JavaScript
-4. Zustand (state management)
-5. Detox (end-to-end testing)
-6. libsodium (encryption)
+1. React Native
+2. Typescript/Javascript
+3. Zustand: State management
+4. Detox: Runs all our e2e tests
+5. React Native MMKV: Database & persistence
+6. libsodium: Encryption
 
 ### Project structure
 
-Top-level directories in `apps/mobile/`:
+The app codebase is distributed over two primary directories. `native/` and `app/`.
 
-- `app/`: Main React Native app source (`components`, `common`, `hooks`, `navigation`, `screens`, `services`, `stores`, `utils`, etc.)
-- `android/`: Android native project
-- `ios/`: iOS native project
-- `e2e/`: Detox test suite and config
-- `patches/`: `patch-package` patches
-- `scripts/`: Mobile-specific scripts
+- `native/`: Includes `android/` and `ios/` folders and everything related to react native core functionality like bundling, development, and packaging. Any react-native dependency with native code, i.e., android & ios folders, is installed here.
 
-## Running E2E tests (Detox)
+- `app/`: Includes all the app code other than the native part. All JS-only dependencies are installed here.
+  - `components/`: Each component serves a specific purpose in the app UI. For example, the `Paragraph` component is used to render paragraphs in the app, and a `Header` component is used to render a `header` on all screens.
+  - `common/`: Features that are integral to the app's functionality. For example, the notesnook core is initialized here.
+  - `hooks/`: Hooks for different app logic
+  - `navigation/`: Includes app navigation-specific code. Here the app navigation, editor & side menu are rendered side by side in fluid tabs.
+  - `screens`: Navigator screens.
+  - `services`: Parts of code that do a specific function. For example, the `sync` service runs Sync from anywhere in the app.
+  - `stores`: We use `zustand` for global state management in the app. Multiple stores provide the state for different parts of the app.
+  - `utils`: General purpose stuff such as constant values, utility functions, etc.
 
-Detox device defaults in this repo:
+There are several other folders at the root:
 
-- Android emulator: `Pixel_5_API_36`
-- iOS simulator: `iPhone 17 Pro Max`
+- `share/`: Code for the iOS Share Extension and Android widget.
+- `e2e/`: Detox End to end tests
+- `patches/`: Patches for various react native dependencies.
+
+### Running the tests
+
+When you are done making the required changes, you must run the tests to ensure you didn't break anything. We use Detox as the testing framework & the tests can be started as follows:
 
 ### Android
 
-Build and run Android Detox tests:
+To run the tests on Android, you will need to create an emulator device on your system:
 
-```bash
-npm run build:android
-npm run test:android
+```
+$ANDROID_HOME/tools/bin/avdmanager create avd -n Pixel_5_API_31 -d pixel --package "system-images;android-31;default;x86_64"
 ```
 
-For debug configuration:
+If you face problems, follow the detailed guide in [Detox documentation](https://wix.github.io/Detox/docs/introduction/android-dev-env). Keep the emulator name set to `Pixel_5_API_31`.
 
-```bash
-npm run build:android:debug
-npm run start:metro
-npm run test:android:debug
+Once you have created an emulator device, build the Android apks:
+
+```
+npm run build:android
+```
+
+Finally, run the tests:
+
+```
+npm run test:android
 ```
 
 ### iOS
 
-Build and run iOS Detox tests:
+To run e2e tests on the iOS simulator, you must be on a Mac with XCode installed.
+
+First, install [AppleSimulatorUtils](https://github.com/wix/AppleSimulatorUtils):
 
-```bash
-npm run build:ios
-npm run test:ios
 ```
-
-If simulator tooling is missing, install [AppleSimulatorUtils](https://github.com/wix/AppleSimulatorUtils):
-
-```bash
 brew tap wix/brew
 brew install applesimutils
 ```
 
-## Release commands
+Now build the iOS app for testing:
 
-Android release helpers:
-
-```bash
-npm run release:android
-npm run release:android:bundle
 ```
+npm run build:ios
+```
+
+Finally, run the tests:
+
+```
+npm run test:ios
+```
+
+All tests on iOS are configured to run on `iPhone 8` simulator.

apps/mobile/android/app/src/main/java/com/streetwriters/notesnook/MainApplication.kt

@@ -1,28 +0,0 @@
-package com.streetwriters.notesnook
- 
-import android.app.Application
-import com.facebook.react.PackageList
-import com.facebook.react.ReactApplication
-import com.facebook.react.ReactHost
-import com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost
-import com.facebook.react.ReactNativeApplicationEntryPoint.loadReactNative
-import org.wonday.orientation.OrientationActivityLifecycle;
-class MainApplication : Application(), ReactApplication {
-    override val reactHost: ReactHost by lazy {
-    getDefaultReactHost(
-      context = applicationContext,
-      packageList =
-        PackageList(this).packages.apply {
-          // Packages that cannot be autolinked yet can be added manually here, for example:
-          // add(MyReactNativePackage())
-          add(NNativeModulePackage());
-        },
-    )
-  }
- 
-  override fun onCreate() {
-    super.onCreate()
-      registerActivityLifecycleCallbacks(OrientationActivityLifecycle.getInstance());
-    loadReactNative(this)
-  }
-}

apps/mobile/android/app/src/main/java/com/streetwriters/notesnook/RCTNNativeModule.java

@@ -1,450 +0,0 @@
-package com.streetwriters.notesnook;
-
-import android.app.Activity;
-import android.appwidget.AppWidgetManager;
-import android.content.ComponentName;
-import android.content.Context;
-import android.content.Intent;
-import android.content.SharedPreferences;
-import android.content.pm.ShortcutInfo;
-import android.content.pm.ShortcutManager;
-import android.graphics.Bitmap;
-import android.graphics.Canvas;
-import android.graphics.Color;
-import android.graphics.Paint;
-import android.graphics.RectF;
-import android.graphics.drawable.Icon;
-import android.os.Build;
-import android.os.Bundle;
-import android.provider.Settings;
-import android.util.Log;
-import android.view.WindowManager;
-import android.widget.RemoteViews;
-
-import com.facebook.react.bridge.Arguments;
-import com.facebook.react.bridge.Promise;
-import com.facebook.react.bridge.ReactContext;
-import com.facebook.react.bridge.ReactContextBaseJavaModule;
-import com.facebook.react.bridge.ReactApplicationContext;
-import com.facebook.react.bridge.ReactMethod;
-import com.facebook.react.bridge.WritableArray;
-import com.facebook.react.bridge.WritableMap;
-import com.google.gson.Gson;
-import com.streetwriters.notesnook.datatypes.Note;
-
-import java.util.ArrayList;
-import java.util.List;
-import java.util.Map;
-import java.util.Objects;
-import java.util.Set;
-
-
-public class RCTNNativeModule extends ReactContextBaseJavaModule {
-    Intent lastIntent;
-    ReactContext mContext;
-    static String IntentType = "com.streetwriters.notesnook.IntentType";
-
-    public RCTNNativeModule(ReactApplicationContext reactContext) {
-        super(reactContext);
-        mContext = reactContext;
-    }
-
-    @Override
-    public String getName() {
-        return "NNativeModule";
-    }
-
-
-    @ReactMethod
-    public void setBackgroundColor(final String color) {
-        try {
-           getCurrentActivity().getWindow().getDecorView().setBackgroundColor(Color.parseColor(color));
-        } catch (Exception e) {
-
-        }
-    }
-
-    @ReactMethod
-    public void getActivityName(Promise promise) {
-        try {
-            promise.resolve(getCurrentActivity().getClass().getSimpleName());
-        } catch (Exception e) {
-            promise.resolve(null);
-        }
-    }
-
-    @ReactMethod
-    public void setSecureMode(final boolean mode) {
-        try {
-
-            getCurrentActivity().runOnUiThread(() -> {
-
-                try {
-                    if (mode)
-                        getCurrentActivity().getWindow().addFlags(WindowManager.LayoutParams.FLAG_SECURE);
-                    else
-                        getCurrentActivity().getWindow().clearFlags(WindowManager.LayoutParams.FLAG_SECURE);
-                } catch (Exception e) {
-                }
-
-            });
-        } catch (Exception e) {
-
-        }
-    }
-
-    @ReactMethod(isBlockingSynchronousMethod = true)
-    public int getWidgetId() {
-        return NotePreviewConfigureActivity.appWidgetId;
-    }
-
-    @ReactMethod
-    public void setString(final String storeName, final String key, final String value) {
-        SharedPreferences details = getReactApplicationContext().getSharedPreferences(storeName, Context.MODE_PRIVATE);
-        SharedPreferences.Editor edit = details.edit();
-        edit.putString(key, value);
-        edit.apply();
-    }
-
-    @ReactMethod
-    public void removeString(final String storeName, final String key) {
-        SharedPreferences details = getReactApplicationContext().getSharedPreferences(storeName, Context.MODE_PRIVATE);
-        SharedPreferences.Editor edit = details.edit();
-        edit.remove(key);
-        edit.apply();
-    }
-
-    @ReactMethod
-    public void getString(final String storeName, final String key, Promise promise) {
-        SharedPreferences details = getReactApplicationContext().getSharedPreferences(storeName, Context.MODE_PRIVATE);
-        String value = details.getString(key, "");
-        promise.resolve(value.isEmpty() ? null : value);
-    }
-
-    @ReactMethod
-    public void saveAndFinish() {
-        NotePreviewConfigureActivity.saveAndFinish(mContext);
-    }
-
-    @ReactMethod(isBlockingSynchronousMethod = true)
-    public WritableMap getIntent() {
-        WritableMap map = Arguments.createMap();
-        if (getCurrentActivity() != null) {
-            Intent intent = getCurrentActivity().getIntent();
-            Bundle extras = getCurrentActivity().getIntent().getExtras();
-
-            if (extras != null && intent != lastIntent) {
-                lastIntent = intent;
-                if (Objects.equals(extras.getString(IntentType), "NewReminder")) {
-                    map.putString(ReminderWidgetProvider.NewReminder, extras.getString(ReminderWidgetProvider.NewReminder));
-                } else if (Objects.equals(extras.getString(IntentType), "OpenReminder")) {
-                    map.putString(ReminderViewsService.OpenReminderId, extras.getString(ReminderViewsService.OpenReminderId));
-                } else if (Objects.equals(extras.getString(IntentType), "OpenNote")) {
-                    map.putString(NotePreviewWidget.OpenNoteId, extras.getString(NotePreviewWidget.OpenNoteId));
-                }
-
-            }
-        }
-        return map;
-    }
-
-    @ReactMethod
-    public void cancelAndFinish() {
-        NotePreviewConfigureActivity.activity.setResult(Activity.RESULT_CANCELED);
-        NotePreviewConfigureActivity.activity.finish();
-    }
-
-    @ReactMethod
-    public void getWidgetNotes(Promise promise) {
-        SharedPreferences pref = getReactApplicationContext().getSharedPreferences("appPreview", Context.MODE_PRIVATE);
-        Map<String, ?> map = pref.getAll();
-        WritableArray arr = Arguments.createArray();
-        for(Map.Entry<String,?> entry : map.entrySet()){
-            if (entry.getKey().equals("remindersList")) continue;
-            String value = (String) entry.getValue();
-            Gson gson = new Gson();
-            Note note = gson.fromJson(value, Note.class);
-            arr.pushString(note.getId());
-        }
-        promise.resolve(arr);
-    }
-
-    @ReactMethod
-    public void hasWidgetNote(final String noteId, Promise promise) {
-        SharedPreferences pref = getReactApplicationContext().getSharedPreferences("appPreview", Context.MODE_PRIVATE);
-        Map<String, ?> map = pref.getAll();
-        boolean found = false;
-        for(Map.Entry<String,?> entry : map.entrySet()){
-            String value = (String) entry.getValue();
-            if (value.contains(noteId)) {
-                found = true;
-            }
-        }
-        promise.resolve(found);
-    }
-    @ReactMethod
-    public void updateWidgetNote(final String noteId, final String data) {
-        SharedPreferences pref = getReactApplicationContext().getSharedPreferences("appPreview", Context.MODE_PRIVATE);
-        Map<String, ?> map = pref.getAll();
-        SharedPreferences.Editor edit = pref.edit();
-        ArrayList<String> ids = new ArrayList<>();
-        for(Map.Entry<String,?> entry : map.entrySet()) {
-            String value = (String) entry.getValue();
-            if (value.contains(noteId)) {
-                edit.putString(entry.getKey(), data);
-                ids.add(entry.getKey());
-            }
-        }
-        edit.apply();
-        for (String id: ids) {
-            NotePreviewWidget.updateAppWidget(mContext, AppWidgetManager.getInstance(mContext), Integer.parseInt(id));
-        }
-    }
-
-    @ReactMethod
-    public void updateReminderWidget() {
-        AppWidgetManager wm = AppWidgetManager.getInstance(mContext);
-        int[] ids = wm.getAppWidgetIds(ComponentName.createRelative(mContext.getPackageName(), ReminderWidgetProvider.class.getName()));
-        for (int id: ids) {
-            Log.d("Reminders", "Updating" + id);
-            RemoteViews views = new RemoteViews(mContext.getPackageName(), R.layout.widget_reminders);
-            ReminderWidgetProvider.updateAppWidget(mContext, wm, id, views);
-            wm.notifyAppWidgetViewDataChanged(id, R.id.widget_list_view);
-        }
-    }
-
-    @ReactMethod(isBlockingSynchronousMethod = true)
-    public boolean isGestureNavigationEnabled() {
-        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
-            try {
-                String navBarMode = Settings.Secure.getString(
-                        mContext.getContentResolver(),
-                        "navigation_mode"
-                );
-                return "2".equals(navBarMode);
-            } catch (Exception e) {
-                return false;
-            }
-        } else {
-            return false;
-        }
-    }
-
-    @ReactMethod
-    public void addShortcut(final String id, final String type, final String title, final String description, final String color, Promise promise) {
-        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
-            promise.reject("UNSUPPORTED", "Pinned launcher shortcuts require Android 8.0 or higher");
-            return;
-        }
-
-        try {
-            ShortcutManager shortcutManager = mContext.getSystemService(ShortcutManager.class);
-            if (shortcutManager == null) {
-                promise.reject("ERROR", "ShortcutManager not available");
-                return;
-            }
-
-            String uri = "https://app.notesnook.com/open_" + type + "?id=" + id;
-            Intent intent = new Intent(Intent.ACTION_VIEW, android.net.Uri.parse(uri));
-            intent.setPackage(mContext.getPackageName());
-
-            Icon icon = createLetterIcon(type, title, color);
-            ShortcutInfo shortcut = new ShortcutInfo.Builder(mContext, id)
-                    .setShortLabel(title)
-                    .setLongLabel(description != null && !description.isEmpty() ? description : title)
-                    .setIcon(icon)
-                    .setCategories(Set.of(type))
-                    .setIntent(intent)
-                    .build();
-
-            shortcutManager.requestPinShortcut(shortcut, null);
-            promise.resolve(true);
-        } catch (Exception e) {
-            promise.reject("ERROR", e.getMessage());
-        }
-    }
-
-    @ReactMethod
-    public void removeShortcut(final String id, Promise promise) {
-        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
-            promise.reject("UNSUPPORTED", "Pinned launcher shortcuts require Android 8.0 or higher");
-            return;
-        }
-
-        try {
-            ShortcutManager shortcutManager = mContext.getSystemService(ShortcutManager.class);
-            if (shortcutManager == null) {
-                promise.reject("ERROR", "ShortcutManager not available");
-                return;
-            }
-
-            shortcutManager.disableShortcuts(java.util.Collections.singletonList(id));
-            promise.resolve(true);
-        } catch (Exception e) {
-            promise.reject("ERROR", e.getMessage());
-        }
-    }
-
-    @ReactMethod
-    public void updateShortcut(final String id, final String type, final String title, final String description,final String color, Promise promise) {
-        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
-            promise.reject("UNSUPPORTED", "Pinned launcher shortcuts require Android 8.0 or higher");
-            return;
-        }
-
-        try {
-            ShortcutManager shortcutManager = mContext.getSystemService(ShortcutManager.class);
-            if (shortcutManager == null) {
-                promise.reject("ERROR", "ShortcutManager not available");
-                return;
-            }
-
-            // Get existing shortcut to preserve icon and intent
-            List<ShortcutInfo> shortcuts = shortcutManager.getPinnedShortcuts();
-            ShortcutInfo existingShortcut = null;
-            for (ShortcutInfo s : shortcuts) {
-                if (s.getId().equals(id)) {
-                    existingShortcut = s;
-                    break;
-                }
-            }
-
-            if (existingShortcut == null) {
-                return;
-            }
-            Icon icon = createLetterIcon(type, title, color);
-            ShortcutInfo updatedShortcut = new ShortcutInfo.Builder(mContext, id)
-                    .setShortLabel(title)
-                    .setIcon(icon)
-                    .setLongLabel(description != null && !description.isEmpty() ? description : title)
-                    .setIntent(existingShortcut.getIntent())
-                    .build();
-
-            shortcutManager.updateShortcuts(java.util.Collections.singletonList(updatedShortcut));
-            promise.resolve(true);
-        } catch (Exception e) {
-            promise.reject("ERROR", e.getMessage());
-        }
-    }
-
-    @ReactMethod
-    public void removeAllShortcuts(Promise promise) {
-        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
-            promise.reject("UNSUPPORTED", "Pinned launcher shortcuts require Android 8.0 or higher");
-            return;
-        }
-
-        try {
-            ShortcutManager shortcutManager = mContext.getSystemService(ShortcutManager.class);
-            if (shortcutManager == null) {
-                promise.reject("ERROR", "ShortcutManager not available");
-                return;
-            }
-
-            List<ShortcutInfo> pinnedShortcuts = shortcutManager.getPinnedShortcuts();
-            if (!pinnedShortcuts.isEmpty()) {
-                List<String> ids = new ArrayList<>();
-                for (ShortcutInfo shortcut : pinnedShortcuts) {
-                    ids.add(shortcut.getId());
-                }
-                shortcutManager.disableShortcuts(ids);
-            }
-            promise.resolve(true);
-        } catch (Exception e) {
-            promise.reject("ERROR", e.getMessage());
-        }
-    }
-
-    @ReactMethod
-    public void getAllShortcuts(Promise promise) {
-        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
-            return;
-        }
-        ShortcutManager shortcutManager = mContext.getSystemService(ShortcutManager.class);
-        WritableArray shortcuts = Arguments.createArray();
-        List<ShortcutInfo> infos = shortcutManager.getPinnedShortcuts();
-
-        for (ShortcutInfo info: infos) {
-            WritableMap data = Arguments.createMap();
-            data.putString("id", info.getId());
-            if (info.getShortLabel() != null) {
-                data.putString("title", info.getShortLabel().toString());
-            }
-
-            if (info.getLongLabel() != null) {
-                data.putString("description", info.getLongLabel().toString());
-            }
-
-
-            if (!Objects.requireNonNull(info.getCategories()).isEmpty()) {
-                if (info.getCategories().contains("note")) {
-                    data.putString("type", "note");
-                } else if (info.getCategories().contains("notebook")) {
-                    data.putString("type", "notebook");
-                } else if (info.getCategories().contains("tag")) {
-                    data.putString("type", "tag");
-                } else if (info.getCategories().contains("color")) {
-                    data.putString("type", "color");
-                }
-            }
-            shortcuts.pushMap(data);
-        }
-        promise.resolve(shortcuts);
-    }
-
-    private Icon createLetterIcon(String type, String title, String colorCode) {
-
-        String letter = type.contains("tag") ? "#" : title != null && !title.isEmpty()
-                ? title.substring(0, 1).toUpperCase()
-                : "?";
-        int color = type.equals("color") ? Color.parseColor(colorCode) : getColorForLetter(letter);
-        
-        if (type.equals("notebook")) return Icon.createWithResource(mContext, R.drawable.ic_notebook);
-        // Use a larger canvas and fill it completely to avoid white borders from launcher masking.
-        int iconSize = 256;
-        Bitmap bitmap = Bitmap.createBitmap(iconSize, iconSize, Bitmap.Config.ARGB_8888);
-        Canvas canvas = new Canvas(bitmap);
-
-        if (type.equals("color")) {
-            Paint backgroundPaint = new Paint();
-            backgroundPaint.setColor(color);
-            backgroundPaint.setAntiAlias(true);
-            canvas.drawCircle(iconSize / 2, iconSize / 2, iconSize/2, backgroundPaint);
-        } else {
-            Paint textPaint = new Paint();
-            textPaint.setColor(color);
-            textPaint.setTextSize(130);
-            textPaint.setAntiAlias(true);
-            textPaint.setTextAlign(Paint.Align.CENTER);
-            textPaint.setTypeface(android.graphics.Typeface.create(android.graphics.Typeface.DEFAULT, android.graphics.Typeface.BOLD));
-
-            float x = iconSize / 2f;
-            float y = (iconSize / 2f) - ((textPaint.descent() + textPaint.ascent()) / 2f);
-
-            canvas.drawText(letter, x, y, textPaint);
-        }
-
-        return Icon.createWithBitmap(bitmap);
-    }
-
-    private int getColorForLetter(String letter) {
-        int[] colors = {
-            0xFF1976D2, // Blue
-            0xFFD32F2F, // Red
-            0xFF388E3C, // Green
-            0xFFF57C00, // Orange
-            0xFF7B1FA2, // Purple
-            0xFF0097A7, // Cyan
-            0xFFC2185B, // Pink
-            0xFF455A64, // Blue Grey
-            0xFF6A1B9A, // Deep Purple
-            0xFF00796B, // Teal
-            0xFF512DA8, // Indigo
-            0xFF1565C0  // Dark Blue
-        };
-        
-        int hash = Math.abs(letter.hashCode());
-        return colors[hash % colors.length];
-    }
-
-}

apps/mobile/android/app/src/main/res/drawable-anydpi/ic_notebook.xml

@@ -1,11 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="960"
-    android:viewportHeight="960"
-    android:tint="#008837"
-    android:alpha="1">
-  <path
-      android:fillColor="@android:color/white"
-      android:pathData="M240,880Q207,880 183.5,856.5Q160,833 160,800L160,160Q160,127 183.5,103.5Q207,80 240,80L720,80Q753,80 776.5,103.5Q800,127 800,160L800,800Q800,833 776.5,856.5Q753,880 720,880L240,880ZM240,800L720,800Q720,800 720,800Q720,800 720,800L720,160Q720,160 720,160Q720,160 720,160L640,160L640,440L540,380L440,440L440,160L240,160Q240,160 240,160Q240,160 240,160L240,800Q240,800 240,800Q240,800 240,800ZM240,800Q240,800 240,800Q240,800 240,800L240,160Q240,160 240,160Q240,160 240,160L240,160Q240,160 240,160Q240,160 240,160L240,800Q240,800 240,800Q240,800 240,800ZM440,440L540,380L640,440L640,440L540,380L440,440Z"/>
-</vector>

apps/mobile/android/app/src/release/AndroidManifest.xml

@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools">
-
-    <application android:networkSecurityConfig="@xml/network_security_config">
-    </application>
-</manifest>

apps/mobile/android/releasenotes/whatsnew-en-US

@@ -1,3 +0,0 @@
-- Bug fixes and improvements
-
-Thank you for using Notesnook!

apps/mobile/android/settings.gradle

@@ -1,11 +0,0 @@
-pluginManagement { includeBuild("../node_modules/@react-native/gradle-plugin") }
-plugins { id("com.facebook.react.settings") }
-extensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }
-rootProject.name = 'Notesnook'
-include ':app'
-includeBuild('../node_modules/@react-native/gradle-plugin')
-
-include ":react-native-config"
-project(':react-native-config').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-config/android')
-include ":lazysodium-android"
-project(':lazysodium-android').projectDir = new File(rootProject.projectDir, '../node_modules/@ammarahmed/react-native-sodium/android/lazysodium-android/app')

apps/mobile/app/app.tsx

@@ -23,8 +23,8 @@ import {
   THEME_COMPATIBILITY_VERSION,
   useThemeEngineStore
 } from "@notesnook/theme";
-import React, { PropsWithChildren, useEffect } from "react";
-import { Appearance, I18nManager, Linking, StatusBar } from "react-native";
+import React, { useEffect } from "react";
+import { Appearance, I18nManager, StatusBar } from "react-native";
 import "react-native-gesture-handler";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { SafeAreaProvider } from "react-native-safe-area-context";
@@ -43,7 +43,7 @@ import { changeSystemBarColors, useThemeStore } from "./stores/use-theme-store";
 import { useUserStore } from "./stores/use-user-store";
 import RNBootSplash from "react-native-bootsplash";
 import AppLocked from "./components/app-lock";
-import { useSettingStore } from "./stores/use-setting-store";
+
 I18nManager.allowRTL(false);
 I18nManager.forceRTL(false);
 I18nManager.swapLeftAndRightInRTL(false);
@@ -51,28 +51,19 @@ const { appLockEnabled, appLockMode } = SettingsService.get();
 if (appLockEnabled || appLockMode !== "none") {
   useUserStore.getState().lockApp(true);
 }
-RNBootSplash.hide({
-  fade: true
-});
-Linking.getInitialURL().then((url) => {
-  useSettingStore.setState({
-    initialUrl: url
-  });
-});
+
+RNBootSplash.hide();
 const App = (props: { configureMode: "note-preview" }) => {
   useAppEvents();
   //@ts-ignore
   globalThis["IS_MAIN_APP_RUNNING"] = true;
   useEffect(() => {
-    SettingsService.onFirstLaunch();
     changeSystemBarColors();
-    SettingsService.setPrivacyScreen(
-      SettingsService.getProperty("privacyScreen")
-    );
+    SettingsService.onFirstLaunch();
     setTimeout(async () => {
       await Notifications.get();
       if (SettingsService.get().notifNotes) {
-        Notifications.pinQuickNote();
+        Notifications.pinQuickNote(true);
       }
       TipManager.init();
     }, 100);
@@ -109,10 +100,8 @@ let currTheme =
     : SettingsService.getProperty("lighTheme");
 useThemeEngineStore.getState().setTheme(currTheme);
 
-export const withTheme = (
-  Element: (props: PropsWithChildren) => JSX.Element
-) => {
-  return function AppWithThemeProvider(props: PropsWithChildren) {
+export const withTheme = (Element: (props: any) => JSX.Element) => {
+  return function AppWithThemeProvider(props: any) {
     const [colorScheme, darkTheme, lightTheme] = useThemeStore((state) => [
       state.colorScheme,
       state.darkTheme,
@@ -132,12 +121,8 @@ export const withTheme = (
           .then((theme) => {
             if (theme) {
               theme.colorScheme === "dark"
-                ? useThemeStore.setState({
-                    darkTheme: theme
-                  })
-                : useThemeStore.setState({
-                    lightTheme: theme
-                  });
+                ? useThemeStore.getState().setDarkTheme(theme)
+                : useThemeStore.getState().setLightTheme(theme);
             }
           })
           .catch(() => {
@@ -147,9 +132,7 @@ export const withTheme = (
 
       const listener = Appearance.addChangeListener(({ colorScheme }) => {
         if (colorScheme && SettingsService.getProperty("useSystemTheme")) {
-          useThemeStore.setState({
-            colorScheme: colorScheme as "light" | "dark"
-          });
+          useThemeStore.getState().setColorScheme(colorScheme);
         }
       });
       return () => {

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

@@ -25,6 +25,7 @@ import * as Keychain from "react-native-keychain";
 import { MMKVLoader, ProcessingModes } from "react-native-mmkv-storage";
 import { generateSecureRandom } from "react-native-securerandom";
 import { DatabaseLogger } from ".";
+import { ToastManager } from "../../services/event-manager";
 import { MMKV } from "./mmkv";
 
 // Database key cipher is persisted across different user sessions hence it has
@@ -93,7 +94,7 @@ export async function encryptDatabaseKeyWithPassword(appLockPassword: string) {
 }
 
 export async function restoreDatabaseKeyToKeyChain(appLockPassword: string) {
-  const databaseKeyCipher = CipherStorage.getMap(DB_KEY_CIPHER) as Cipher;
+  const databaseKeyCipher: Cipher = CipherStorage.getMap(DB_KEY_CIPHER);
   const databaseKey = (await decrypt(
     {
       password: appLockPassword
@@ -134,9 +135,7 @@ export async function clearAppLockVerificationCipher() {
 
 export async function validateAppLockPassword(appLockPassword: string) {
   try {
-    const appLockCipher: Cipher = CipherStorage.getMap(
-      APPLOCK_CIPHER
-    ) as Cipher;
+    const appLockCipher: Cipher = CipherStorage.getMap(APPLOCK_CIPHER);
     if (!appLockCipher) return true;
     const key = await Sodium.deriveKey(appLockPassword, appLockCipher.salt);
     const decrypted = await decrypt(key, appLockCipher);
@@ -160,9 +159,7 @@ export function clearDatabaseKey() {
 export async function getDatabaseKey(appLockPassword?: string) {
   if (DB_KEY) return DB_KEY;
   if (appLockPassword) {
-    const databaseKeyCipher: Cipher = CipherStorage.getMap(
-      "databaseKeyCipher"
-    ) as Cipher;
+    const databaseKeyCipher: Cipher = CipherStorage.getMap("databaseKeyCipher");
     const databaseKey = await decrypt(
       {
         password: appLockPassword
@@ -204,8 +201,9 @@ export async function getDatabaseKey(appLockPassword?: string) {
   }
 
   if (await Keychain.hasInternetCredentials("notesnook")) {
-    const userKeyCredentials =
-      await Keychain.getInternetCredentials("notesnook");
+    const userKeyCredentials = await Keychain.getInternetCredentials(
+      "notesnook"
+    );
 
     if (userKeyCredentials) {
       const userKeyCipher: Cipher = (await encrypt(
@@ -295,7 +293,7 @@ export async function deriveCryptoKey(data: SerializedKey) {
 
 export async function getCryptoKey() {
   try {
-    const keyCipher: Cipher = MMKV.getMap(USER_KEY_CIPHER) as Cipher;
+    const keyCipher: Cipher = MMKV.getMap(USER_KEY_CIPHER);
     if (!keyCipher) {
       DatabaseLogger.info("User key cipher is null");
       return undefined;

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

@@ -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 { database, getFeature, getFeatureLimit } from "@notesnook/common";
+import { database } from "@notesnook/common";
 import { logger as dbLogger, ICompressor } from "@notesnook/core";
 import { strings } from "@notesnook/intl";
 import {
@@ -26,6 +26,7 @@ import {
 } from "@streetwriters/kysely";
 import { Platform } from "react-native";
 import * as Gzip from "react-native-gzip";
+import SettingsService from "../../services/settings";
 import EventSource from "../../utils/sse/even-source-ios";
 import AndroidEventSource from "../../utils/sse/event-source";
 import { FileStorage } from "../filesystem";
@@ -33,24 +34,11 @@ import { getDatabaseKey } from "./encryption";
 import "./logger";
 import { RNSqliteDriver } from "./sqlite.kysely";
 import { Storage } from "./storage";
-import SettingsService from "../../services/settings";
 
 export async function setupDatabase(password?: string) {
   const key = await getDatabaseKey(password);
   if (!key) throw new Error(strings.databaseSetupFailed());
 
-  // const base = `http://192.168.100.92`;
-
-  // database.host({
-  //   API_HOST: `${base}:5264`,
-  //   AUTH_HOST: `${base}:8264`,
-  //   SSE_HOST: `${base}:7264`,
-  //   ISSUES_HOST: `${base}:2624`,
-  //   SUBSCRIPTIONS_HOST: `${base}:9264`,
-  //   MONOGRAPH_HOST: `${base}:6264`,
-  //   NOTESNOOK_HOST: `${base}:8788`
-  // });
-
   database.host({
     API_HOST: "https://api.notesnook.com",
     AUTH_HOST: "https://auth.streetwriters.co",
@@ -58,7 +46,6 @@ export async function setupDatabase(password?: string) {
     SUBSCRIPTIONS_HOST: "https://subscriptions.streetwriters.co",
     ISSUES_HOST: "https://issues.streetwriters.co",
     MONOGRAPH_HOST: "https://monogr.ph",
-    NOTESNOOK_HOST: "https://notesnook.com",
     ...(SettingsService.getProperty("serverUrls") || {})
   });
 
@@ -72,8 +59,8 @@ export async function setupDatabase(password?: string) {
       ({
         compress: Gzip.deflate,
         decompress: Gzip.inflate
-      }) as ICompressor,
-    batchSize: 50,
+      } as ICompressor),
+    batchSize: 100,
     sqliteOptions: {
       dialect: (name) => ({
         createDriver: () => {
@@ -86,10 +73,6 @@ export async function setupDatabase(password?: string) {
       tempStore: "memory",
       journalMode: Platform.OS === "ios" ? "DELETE" : "WAL",
       password: key
-    },
-    maxNoteVersions: async () => {
-      const limit = await getFeatureLimit(getFeature("maxNoteVersions"));
-      return typeof limit.caption === "number" ? limit.caption : undefined;
     }
   });
 }

apps/mobile/app/common/database/sqlite.kysely.ts

@@ -109,8 +109,8 @@ class RNSqliteConnection implements DatabaseConnection {
       query.kind === "SelectQueryNode"
         ? "query"
         : query.kind === "RawNode"
-          ? "raw"
-          : "exec";
+        ? "raw"
+        : "exec";
 
     const result = await this.db.executeAsync(sql, parameters as any[]);
 

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

@@ -136,12 +136,6 @@ export const Storage: IStorage = {
   clear(): Promise<void> {
     return DefaultStorage.clear();
   },
-  generateCryptoKeyPair() {
-    throw new Error("Not implemented");
-  },
-  decryptAsymmetric() {
-    throw new Error("Not implemented");
-  },
   getAllKeys(): Promise<string[]> {
     return DefaultStorage.getAllKeys();
   },

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

@@ -70,7 +70,7 @@ export async function downloadFile(
       throw new Error(error);
     }
 
-    const totalChunks = Math.ceil(size / (chunkSize + ABYTES));
+    const totalChunks = Math.ceil(size / chunkSize);
     const decryptedLength = size - totalChunks * ABYTES;
 
     if (attachment && attachment.size !== decryptedLength) {
@@ -115,13 +115,7 @@ export async function downloadFile(
       .progress(async (recieved, total) => {
         useAttachmentStore
           .getState()
-          .setProgress(
-            0,
-            parseInt(total),
-            filename,
-            parseInt(recieved),
-            "download"
-          );
+          .setProgress(0, total, filename, recieved, "download");
 
         DatabaseLogger.log(`Downloading: ${filename}, ${recieved}/${total}`);
       });

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

@@ -30,8 +30,7 @@ import {
   getCacheSize,
   hashBase64,
   readEncrypted,
-  writeEncryptedBase64,
-  bulkDeleteFiles
+  writeEncryptedBase64
 } from "./io";
 import { uploadFile } from "./upload";
 import {
@@ -62,6 +61,5 @@ export const FileStorage: IFileStorage = {
   exists,
   clearFileStorage,
   getUploadedFileSize,
-  bulkExists,
-  bulkDeleteFiles
+  bulkExists
 };

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

@@ -30,14 +30,7 @@ import RNFetchBlob from "react-native-blob-util";
 import { eSendEvent } from "../../services/event-manager";
 import { IOS_APPGROUPID } from "../../utils/constants";
 import { DatabaseLogger, db } from "../database";
-import {
-  ABYTES,
-  cacheDir,
-  cacheDirOld,
-  getRandomId,
-  isSuccessStatusCode,
-  parseS3Error
-} from "./utils";
+import { ABYTES, cacheDir, cacheDirOld, getRandomId } from "./utils";
 
 export async function readEncrypted<TOutputFormat extends DataFormat>(
   filename: string,
@@ -109,41 +102,16 @@ export async function writeEncryptedBase64(
   };
 }
 
-async function deleteLocalFile(filename: string) {
-  try {
-    await createCacheDir();
-    const path = cacheDir + `/${filename}`;
-    const exists = await RNFetchBlob.fs.exists(path);
-    if (Platform.OS === "ios" && !exists) {
-      const iosAppGroup =
-        Platform.OS === "ios"
-          ? await (RNFetchBlob.fs as any).pathForAppGroup(IOS_APPGROUPID)
-          : null;
-      const appGroupPath = `${iosAppGroup}/${filename}`;
-      if (await RNFetchBlob.fs.exists(appGroupPath)) {
-        RNFetchBlob.fs.unlink(appGroupPath).catch(() => {
-          /* empty */
-        });
-        return;
-      }
-    }
-    if (exists) {
-      RNFetchBlob.fs.unlink(path).catch(() => {
-        /* empty */
-      });
-    }
-  } catch (e) {
-    DatabaseLogger.error(e as Error, "deleteLocalFile");
-  }
-}
-
 export async function deleteFile(
   filename: string,
   requestOptions?: RequestOptions
 ): Promise<boolean> {
   await createCacheDir();
+  const localFilePath = cacheDir + `/${filename}`;
   if (!requestOptions) {
-    deleteLocalFile(filename);
+    RNFetchBlob.fs.unlink(localFilePath).catch(() => {
+      /* empty */
+    });
     return true;
   }
 
@@ -154,7 +122,9 @@ export async function deleteFile(
     const status = response.info().status;
     const ok = status >= 200 && status < 300;
     if (ok) {
-      deleteLocalFile(filename);
+      RNFetchBlob.fs.unlink(localFilePath).catch(() => {
+        /* empty */
+      });
     }
     return ok;
   } catch (e) {
@@ -165,52 +135,8 @@ export async function deleteFile(
   }
 }
 
-export async function bulkDeleteFiles(
-  filenames: string[],
-  requestOptions?: RequestOptions
-) {
-  await createCacheDir();
-  if (!requestOptions) {
-    filenames.forEach((filename) => {
-      deleteLocalFile(filename);
-    });
-    return true;
-  }
-
-  try {
-    const { url, headers } = requestOptions;
-    const response = await fetch(url, {
-      method: "POST",
-      headers: {
-        ...headers,
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify({
-        names: filenames
-      })
-    });
-
-    const result = isSuccessStatusCode(response.status);
-    if (result) {
-      filenames.forEach((filename) => {
-        deleteLocalFile(filename);
-      });
-    } else {
-      throw await response.text();
-    }
-    return result;
-  } catch (e) {
-    DatabaseLogger.error(
-      typeof e === "string" ? parseS3Error(e as string) : (e as Error),
-      "Could not bulk delete files"
-    );
-    return false;
-  }
-}
-
 export async function clearFileStorage() {
   try {
-    await createCacheDir();
     const files = await RNFetchBlob.fs.ls(cacheDir);
     const oldCache = await RNFetchBlob.fs.ls(cacheDirOld);
 
@@ -295,22 +221,13 @@ export async function deleteCacheFileByName(name: string) {
 }
 
 export async function deleteDCacheFiles() {
-  try {
-    await createCacheDir();
-    const files = await RNFetchBlob.fs.ls(cacheDir);
-    for (const file of files) {
-      if (
-        file.includes("_dcache") ||
-        file.startsWith("NN_") ||
-        file.endsWith(".pdf")
-      ) {
-        await RNFetchBlob.fs.unlink(file).catch(() => {
-          /* empty */
-        });
-      }
+  const files = await RNFetchBlob.fs.ls(cacheDir);
+  for (const file of files) {
+    if (file.includes("_dcache") || file.startsWith("NN_")) {
+      await RNFetchBlob.fs.unlink(file).catch(() => {
+        /* empty */
+      });
     }
-  } catch (e) {
-    /** Empty */
   }
 }
 

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

@@ -17,8 +17,8 @@ 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 { isImage, RequestOptions, hosts } from "@notesnook/core";
-import { PermissionsAndroid, Platform } from "react-native";
+import { RequestOptions } from "@notesnook/core";
+import { Platform } from "react-native";
 import RNFetchBlob from "react-native-blob-util";
 import { ToastManager } from "../../services/event-manager";
 import { useAttachmentStore } from "../../stores/use-attachment-store";
@@ -31,138 +31,6 @@ import {
   FileSizeResult,
   getUploadedFileSize
 } from "./utils";
-import Upload from "@ammarahmed/react-native-upload";
-import { CloudUploader } from "react-native-nitro-cloud-uploader";
-import { useUserStore } from "../../stores/use-user-store";
-import { sleep } from "../../utils/time";
-import { isFeatureAvailable } from "@notesnook/common";
-import { strings } from "@notesnook/intl";
-
-// Upload constants
-const CHUNK_SIZE = 10 * 1024 * 1024; // 10 MB
-const MINIMUM_MULTIPART_FILE_SIZE = 25 * 1024 * 1024; // 25MB
-
-interface InitiateMultipartResponse {
-  uploadId: string;
-  parts: string[];
-  error?: string;
-}
-
-async function initiateMultipartUpload(
-  filename: string,
-  fileSize: number,
-  headers: Record<string, string>
-): Promise<InitiateMultipartResponse> {
-  const totalParts = Math.ceil(fileSize / CHUNK_SIZE);
-
-  const url = `${hosts.API_HOST}/s3/multipart?name=${filename}&parts=${totalParts}&uploadId=`;
-  const response = await fetch(url, { headers });
-
-  if (!response.ok) {
-    throw new Error(
-      `Failed to initiate multipart upload: ${response.statusText}`
-    );
-  }
-
-  const data = await response.json();
-
-  if (data.error) {
-    throw new Error(data.error);
-  }
-
-  if (!data.uploadId || !data.parts) {
-    throw new Error("Failed to initiate multipart upload: invalid response.");
-  }
-
-  DatabaseLogger.info(
-    `Initiated multipart upload for ${filename} with upload ID: ${data.uploadId}`
-  );
-
-  return data;
-}
-
-async function multipartUploadFile(
-  filename: string,
-  filePath: string,
-  fileSize: number,
-  requestOptions: RequestOptions,
-  cancelToken: { cancel: (reason?: string) => Promise<void> }
-): Promise<Response> {
-  const { headers } = requestOptions;
-
-  try {
-    const uploadData = await initiateMultipartUpload(
-      filename,
-      fileSize,
-      headers
-    );
-    const { uploadId, parts } = uploadData;
-
-    DatabaseLogger.info(
-      `Starting upload for ${filename} with ${parts.length} parts`
-    );
-
-    cancelToken.cancel = async () => {
-      useAttachmentStore.getState().remove(filename);
-      await CloudUploader.cancelUpload(uploadId);
-    };
-
-    CloudUploader.addListener("upload-progress", (event) => {
-      useAttachmentStore
-        .getState()
-        .setProgress(
-          event.bytesUploaded || 0,
-          event.totalBytes || fileSize,
-          filename,
-          0,
-          "upload"
-        );
-      DatabaseLogger.info(
-        `File upload progress: ${filename}, ${event.bytesUploaded}/${
-          event.totalBytes || fileSize
-        }, chunk: ${event.chunkIndex}, progress: ${event.progress}`
-      );
-    });
-    // CloudUploader handles chunking and uploading all parts internally
-    const result = await CloudUploader.startUpload(
-      filename,
-      filePath,
-      parts,
-      3, // maxParallel
-      true // showNotification
-    );
-
-    CloudUploader.removeListener("upload-progress");
-
-    if (!result.success) {
-      throw new Error("Failed to upload multipart file");
-    }
-
-    DatabaseLogger.info(
-      `Multipart upload completed for ${filename} with upload ID: ${uploadId}`
-    );
-
-    const response = await fetch(`${hosts.API_HOST}/s3/multipart`, {
-      method: "POST",
-      body: JSON.stringify({
-        Key: filename,
-        UploadId: uploadId,
-        PartETags: result.etags.map((etag, index) => ({
-          partNumber: index + 1,
-          etag: etag
-        }))
-      }),
-      headers: { ...headers, "Content-Type": "application/json" }
-    });
-
-    return response;
-  } catch (error) {
-    DatabaseLogger.error(error, "Multipart upload failed", { filename });
-    CloudUploader.removeListener("upload-progress");
-    useAttachmentStore.getState().remove(filename);
-    throw error;
-  }
-}
 
 export async function uploadFile(
   filename: string,
@@ -196,163 +64,77 @@ export async function uploadFile(
       );
     }
 
-    const fileInfo = await RNFetchBlob.fs.stat(filePath);
+    const fileSize = (await RNFetchBlob.fs.stat(filePath)).size;
 
     const remoteFileSize = await getUploadedFileSize(filename);
     if (remoteFileSize === FileSizeResult.Error) return false;
 
-    const featureResult = await isFeatureAvailable(
-      "fileSize",
-      fileInfo.size || 0
-    );
-
-    if (!featureResult.isAllowed) {
-      ToastManager.show({
-        heading: strings.fileTooLarge(),
-        message: featureResult.error,
-        type: "error"
-      });
-      return false;
-    }
-
-    if (
-      remoteFileSize > FileSizeResult.Empty &&
-      remoteFileSize === fileInfo.size
-    ) {
+    if (remoteFileSize > FileSizeResult.Empty && remoteFileSize === fileSize) {
       DatabaseLogger.log(`File ${filename} is already uploaded.`);
       return true;
     }
 
-    let attachmentInfo = await db.attachments.attachment(filename);
+    const uploadUrlResponse = await fetch(url, {
+      method: "PUT",
+      headers
+    });
 
-    DatabaseLogger.info(
-      `Starting upload of ${filename} at path: ${fileInfo.path} ${fileInfo.size}`
-    );
+    const uploadUrl = uploadUrlResponse.ok
+      ? await uploadUrlResponse.text()
+      : await uploadUrlResponse.json();
 
-    if (Platform.OS === "android") {
-      useUserStore.setState({
-        disableAppLockRequests: true
-      });
-      const status = await PermissionsAndroid.request(
-        "android.permission.POST_NOTIFICATIONS"
+    if (typeof uploadUrl !== "string") {
+      throw new Error(
+        uploadUrl.error || "Unable to resolve attachment upload url."
       );
-      if (status !== "granted") {
-        ToastManager.show({
-          message: `The permission to show file upload notification was disallowed by the user.`,
-          type: "info"
-        });
-      }
-      await sleep(500);
-      useUserStore.setState({
-        disableAppLockRequests: false
-      });
     }
 
-    let uploaded = false;
+    DatabaseLogger.info(`Starting upload: ${filename}`);
 
-    // Use multipart upload for files larger than MINIMUM_MULTIPART_FILE_SIZE
-    if (fileInfo.size >= MINIMUM_MULTIPART_FILE_SIZE) {
-      DatabaseLogger.info(
-        `Using multipart upload for large file: ${filename} (${fileInfo.size} bytes)`
-      );
-      const result = await multipartUploadFile(
-        filename,
-        filePath,
-        fileInfo.size,
-        requestOptions,
-        cancelToken
-      );
-      const status = result.status || 0;
-      uploaded = status >= 200 && status < 300;
-
-      if (!uploaded) {
-        const fileInfo = await RNFetchBlob.fs.stat(filePath);
-        throw new Error(
-          `${status}, name: ${fileInfo.filename}, length: ${
-            fileInfo.size
-          }, info: ${JSON.stringify(await result.text())}`
-        );
-      }
-    } else {
-      // Use single-part upload for smaller files
-      DatabaseLogger.info(
-        `Using single-part upload for file: ${filename} (${fileInfo.size} bytes)`
-      );
-      const upload = Upload.create({
-        customUploadId: filename,
-        path: Platform.OS === "ios" ? "file://" + fileInfo.path : fileInfo.path,
-        url: url,
-        method: "PUT",
-        headers: {
-          ...headers,
-          "content-type": "application/octet-stream"
+    const uploadRequest = RNFetchBlob.config({
+      //@ts-ignore
+      IOSBackgroundTask: !globalThis["IS_SHARE_EXTENSION"]
+    })
+      .fetch(
+        "PUT",
+        uploadUrl,
+        {
+          "content-type": ""
         },
-        appGroup: IOS_APPGROUPID,
-        notification: {
-          filename:
-            attachmentInfo && isImage(attachmentInfo?.mimeType)
-              ? "image"
-              : attachmentInfo?.filename || "file",
-          enabled: true,
-          enableRingTone: true,
-          autoClear: true
-        }
-      }).onChange((event) => {
-        switch (event.status) {
-          case "running":
-          case "pending":
-            useAttachmentStore
-              .getState()
-              .setProgress(
-                event.uploadedBytes || 0,
-                event.totalBytes || fileInfo.size,
-                filename,
-                0,
-                "upload"
-              );
-            DatabaseLogger.info(
-              `File upload progress: ${filename}, ${event.uploadedBytes}/${
-                event.totalBytes || fileInfo.size
-              }`
-            );
-            break;
-          case "completed":
-            DatabaseLogger.info("Upload completed");
-            break;
-        }
-      });
-      const result = await upload.start();
-      cancelToken.cancel = async () => {
-        useAttachmentStore.getState().remove(filename);
-        upload.cancel();
-      };
-
-      const status = result.responseCode || 0;
-      uploaded = status >= 200 && status < 300;
-
-      if (!uploaded) {
-        const fileInfo = await RNFetchBlob.fs.stat(filePath);
-        throw new Error(
-          `${status}, name: ${fileInfo.filename}, length: ${
-            fileInfo.size
-          }, info: ${JSON.stringify(result.error)}`
+        RNFetchBlob.wrap(filePath)
+      )
+      .uploadProgress((sent, total) => {
+        useAttachmentStore
+          .getState()
+          .setProgress(sent, total, filename, 0, "upload");
+        DatabaseLogger.info(
+          `File upload progress: ${filename}, ${sent}/${total}`
         );
-      }
-    }
+      });
+
+    cancelToken.cancel = async () => {
+      useAttachmentStore.getState().remove(filename);
+      uploadRequest.cancel();
+    };
+
+    const uploadResponse = await uploadRequest;
+    const status = uploadResponse.info().status;
+    const uploaded = status >= 200 && status < 300;
 
     useAttachmentStore.getState().remove(filename);
 
-    if (uploaded) {
-      attachmentInfo = await db.attachments.attachment(filename);
-      if (!attachmentInfo) return false;
-      await checkUpload(
-        filename,
-        requestOptions.chunkSize,
-        attachmentInfo.size
+    if (!uploaded) {
+      const fileInfo = await RNFetchBlob.fs.stat(filePath);
+      throw new Error(
+        `${status}, name: ${fileInfo.filename}, length: ${
+          fileInfo.size
+        }, info: ${JSON.stringify(uploadResponse.info())}`
       );
-      DatabaseLogger.info(`File upload status: ${filename}, success`);
     }
-
+    const attachment = await db.attachments.attachment(filename);
+    if (!attachment) return false;
+    await checkUpload(filename, requestOptions.chunkSize, attachment.size);
+    DatabaseLogger.info(`File upload status: ${filename}, ${status}`);
     return uploaded;
   } catch (e) {
     useAttachmentStore.getState().remove(filename);

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

@@ -115,10 +115,6 @@ export const FileSizeResult = {
   Error: -1
 };
 
-function getFileSizeFromHeaders(headers: Headers) {
-  return headers.get("x-object-size") || headers.get("content-length");
-}
-
 export async function getUploadedFileSize(hash: string, retry = 0) {
   try {
     const url = `${hosts.API_HOST}/s3?name=${hash}`;
@@ -128,21 +124,24 @@ export async function getUploadedFileSize(hash: string, retry = 0) {
       headers: { Authorization: `Bearer ${token}` }
     });
 
-    const fileSize = getFileSizeFromHeaders(attachmentInfo.headers);
-
-    if (!attachmentInfo.ok || fileSize === null) {
+    if (
+      !attachmentInfo.ok ||
+      attachmentInfo.headers?.get("content-length") === null
+    ) {
       if (retry < 3) {
         DatabaseLogger.log(`Retrying file size check: ${hash}, ${retry}`);
         return getUploadedFileSize(hash, retry + 1);
       }
       throw new Error(
-        `File size check failed: ${hash}, ${attachmentInfo.status}, ${fileSize}`
+        `File size check failed: ${hash}, ${
+          attachmentInfo.status
+        }, ${attachmentInfo.headers?.get("content-length")}`
       );
     }
 
-    console.log(attachmentInfo.headers);
-
-    const contentLength = parseInt(fileSize as string);
+    const contentLength = parseInt(
+      attachmentInfo.headers?.get("content-length") as string
+    );
     return isNaN(contentLength) ? FileSizeResult.Empty : contentLength;
   } catch (e) {
     DatabaseLogger.error(e);
@@ -156,16 +155,16 @@ export async function checkUpload(
   expectedSize: number
 ) {
   const size = await getUploadedFileSize(filename);
-  const totalChunks = Math.ceil(size / (chunkSize + ABYTES));
+  const totalChunks = Math.ceil(size / chunkSize);
   const decryptedLength = size - totalChunks * ABYTES;
   const error =
     size === 0
       ? `File size is 0.`
       : size === -1
-        ? `File verification check failed.`
-        : expectedSize !== decryptedLength
-          ? `File size mismatch. Expected ${size} bytes but got ${decryptedLength} bytes.`
-          : undefined;
+      ? `File verification check failed.`
+      : expectedSize !== decryptedLength
+      ? `File size mismatch. Expected ${size} bytes but got ${decryptedLength} bytes.`
+      : undefined;
   if (error) throw new Error(error);
 }
 
@@ -190,12 +189,3 @@ export async function checkAndCreateDir(path: string) {
   }
   return dir;
 }
-
-export const santizeUri = (uri: string) => {
-  const decoded = decodeURI(uri);
-  return Platform.OS === "ios" ? decoded.replace("file:///", "/") : decoded;
-};
-
-export function isSuccessStatusCode(statusCode: number) {
-  return statusCode >= 200 && statusCode <= 299;
-}

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

@@ -25,18 +25,11 @@ import { useSelectionStore } from "../../stores/use-selection-store";
 import { allowedOnPlatform, renderItem } from "./functions";
 import { getContainerBorder } from "../../utils/colors";
 import { DefaultAppStyles } from "../../utils/styles";
-import Heading from "../ui/typography/heading";
-import { AppFontSize } from "../../utils/size";
-import { Button } from "../ui/button";
-import { strings } from "@notesnook/intl";
 
-export const Announcement = () => {
+export const Announcement = ({ color }) => {
   const { colors } = useThemeColors();
-  const [announcements, remove] = useMessageStore((state) => [
-    state.announcements,
-    state.remove
-  ]);
-  const announcement = announcements.length > 0 ? announcements[0] : null;
+  const announcements = useMessageStore((state) => state.announcements);
+  let announcement = announcements.length > 0 ? announcements[0] : null;
   const selectionMode = useSelectionStore((state) => state.selectionMode);
 
   return !announcement || selectionMode ? null : (
@@ -64,43 +57,13 @@ export const Announcement = () => {
             marginTop: DefaultAppStyles.GAP_VERTICAL
           }}
         >
-          <View
-            style={{
-              flexDirection: "row",
-              justifyContent: "space-between",
-              alignItems: "center",
-              paddingHorizontal: DefaultAppStyles.GAP,
-              borderBottomWidth: 1,
-              borderBottomColor: colors.primary.border,
-              paddingBottom: DefaultAppStyles.GAP_VERTICAL_SMALL
-            }}
-          >
-            <Heading color={colors.secondary.heading} size={AppFontSize.xxs}>
-              {strings.announcement()}
-            </Heading>
-
-            <Button
-              type="plain"
-              icon="close"
-              onPress={() => {
-                remove(announcement.id);
-              }}
-              iconSize={20}
-              fontSize={AppFontSize.xs}
-              style={{
-                paddingVertical: 0,
-                paddingHorizontal: 0,
-                zIndex: 10
-              }}
-            />
-          </View>
-
           {announcement?.body
             .filter((item) => allowedOnPlatform(item.platforms))
             .map((item, index) =>
               renderItem({
                 item: item,
                 index: index,
+                color: colors[color],
                 inline: true
               })
             )}

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

@@ -19,18 +19,18 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
 import Paragraph from "../ui/typography/paragraph";
-import { BodyItemProps, getStyle } from "./functions";
+import { getStyle } from "./functions";
 import { DefaultAppStyles } from "../../utils/styles";
 
-export const Body = (props: BodyItemProps) => {
+export const Body = ({ text, style = {} }) => {
   return (
     <Paragraph
       style={{
         paddingHorizontal: DefaultAppStyles.GAP,
-        ...getStyle(props.item.style)
+        ...getStyle(style)
       }}
     >
-      {props.item.text}
+      {text}
     </Paragraph>
   );
 };

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

@@ -19,25 +19,25 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
 import { Linking, View } from "react-native";
+//import SettingsBackupAndRestore from '../../screens/settings/backup-restore';
 import { useThemeColors } from "@notesnook/theme";
-import { eSendEvent } from "../../services/event-manager";
+import { eSendEvent, presentSheet } from "../../services/event-manager";
 import { eCloseAnnouncementDialog } from "../../utils/events";
 import { AppFontSize } from "../../utils/size";
 import { sleep } from "../../utils/time";
+import { PricingPlans } from "../premium/pricing-plans";
 import SheetProvider from "../sheet-provider";
 import { Button } from "../ui/button";
-import { allowedOnPlatform, BodyItemProps, getStyle } from "./functions";
+import { allowedOnPlatform, getStyle } from "./functions";
 import { DefaultAppStyles } from "../../utils/styles";
-import { Action } from "../../stores/use-message-store";
 
-export const Cta = (props: BodyItemProps) => {
+export const Cta = ({ actions, style = {}, color, inline }) => {
   const { colors } = useThemeColors();
-  const buttons =
-    props.item.actions.filter((item) => allowedOnPlatform(item.platforms)) ||
-    [];
+  let buttons =
+    actions.filter((item) => allowedOnPlatform(item.platforms)) || [];
 
-  const onPress = async (item: Action) => {
-    if (!props.inline) {
+  const onPress = async (item) => {
+    if (!inline) {
       eSendEvent(eCloseAnnouncementDialog);
       await sleep(500);
     }
@@ -45,20 +45,31 @@ export const Cta = (props: BodyItemProps) => {
       Linking.openURL(item.data).catch(() => {
         /* empty */
       });
+    } else if (item.type === "promo") {
+      presentSheet({
+        component: (
+          <PricingPlans
+            marginTop={1}
+            promo={{
+              promoCode: item.data,
+              text: item.title
+            }}
+          />
+        )
+      });
     }
   };
   return (
     <View
       style={{
         paddingHorizontal: DefaultAppStyles.GAP,
-        ...getStyle(props.item.style),
-        flexDirection: props.inline ? "row" : "column",
-        gap: DefaultAppStyles.GAP_SMALL
+        ...getStyle(style),
+        flexDirection: inline ? "row" : "column"
       }}
     >
       <SheetProvider context="premium_cta" />
 
-      {props.inline ? (
+      {inline ? (
         <>
           {buttons.length > 0 &&
             buttons.slice(0, 1).map((item) => (
@@ -88,10 +99,12 @@ export const Cta = (props: BodyItemProps) => {
                 fontSize={AppFontSize.sm}
                 type="plain"
                 onPress={() => onPress(item)}
+                width={null}
+                height={30}
                 style={{
-                  paddingVertical: DefaultAppStyles.GAP_VERTICAL_SMALL,
                   alignSelf: "flex-start",
-                  paddingHorizontal: 0
+                  paddingHorizontal: 0,
+                  marginLeft: 12
                 }}
                 textStyle={{
                   textDecorationLine: "underline"
@@ -106,15 +119,20 @@ export const Cta = (props: BodyItemProps) => {
               <Button
                 key={item.title}
                 title={item.title}
+                fontSize={AppFontSize.md}
                 buttonType={{
-                  color: colors.primary.accent,
-                  text: colors.primary.accentForeground,
-                  selected: colors.primary.accent,
+                  color: color ? color : colors.primary.accent,
+                  text: color
+                    ? colors.static.white
+                    : colors.primary.accentForeground,
+                  selected: color ? color : colors.primary.accent,
                   opacity: 1
                 }}
                 onPress={() => onPress(item)}
+                width={250}
                 style={{
-                  width: "100%"
+                  marginBottom: DefaultAppStyles.GAP_VERTICAL,
+                  borderRadius: 100
                 }}
               />
             ))}
@@ -131,7 +149,7 @@ export const Cta = (props: BodyItemProps) => {
                 height={30}
                 style={{
                   minWidth: "50%",
-                  width: "100%"
+                  marginTop: DefaultAppStyles.GAP_VERTICAL_SMALL
                 }}
                 textStyle={{
                   textDecorationLine: "underline"

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

@@ -20,20 +20,19 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React from "react";
 import { AppFontSize } from "../../utils/size";
 import Paragraph from "../ui/typography/paragraph";
-import { BodyItemProps, getStyle } from "./functions";
-import { DefaultAppStyles } from "../../utils/styles";
+import { getStyle } from "./functions";
 
-export const Description = (props: BodyItemProps) => {
+export const Description = ({ text, style = {}, inline }) => {
   return (
     <Paragraph
       style={{
-        paddingHorizontal: DefaultAppStyles.GAP,
-        ...getStyle(props.item.style),
-        textAlign: props.inline ? "left" : props.item.style?.textAlign
+        marginHorizontal: 12,
+        ...getStyle(style),
+        textAlign: inline ? "left" : style?.textAlign
       }}
-      size={AppFontSize.sm}
+      size={inline ? AppFontSize.sm : AppFontSize.md}
     >
-      {props.item.text}
+      {text}
     </Paragraph>
   );
 };

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

@@ -19,8 +19,8 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Fragment } from "react";
 import { View } from "react-native";
-import { allowedPlatforms, BodyItem } from "../../stores/use-message-store";
-import { DefaultAppStyles } from "../../utils/styles";
+import { allowedPlatforms } from "../../stores/use-message-store";
+import { ProFeatures } from "../dialogs/result/pro-features";
 import { Body } from "./body";
 import { Cta } from "./cta";
 import { Description } from "./description";
@@ -28,8 +28,9 @@ import { List } from "./list";
 import { Photo } from "./photo";
 import { SubHeading } from "./subheading";
 import { Title } from "./title";
+import { DefaultAppStyles } from "../../utils/styles";
 
-export function allowedOnPlatform(platforms: string[]) {
+export function allowedOnPlatform(platforms) {
   if (!platforms) return true;
   return platforms.some((platform) => allowedPlatforms.indexOf(platform) > -1);
 }
@@ -40,15 +41,11 @@ export const margins = {
   2: 20
 };
 
-export const getStyle = (style: BodyItem["style"]) => {
+export const getStyle = (style) => {
   if (!style) return {};
   return {
-    marginTop: style.marginTop
-      ? margins[style.marginTop as keyof typeof margins] || 0
-      : 0,
-    marginBottom: style.marginBottom
-      ? margins[style.marginBottom as keyof typeof margins] || 0
-      : 0,
+    marginTop: margins[style.marginTop] || 0,
+    marginBottom: margins[style.marginBottom] || 0,
     textAlign: style.textAlign || "left"
   };
 };
@@ -61,7 +58,9 @@ const Features = () => {
         alignItems: "center",
         width: "100%"
       }}
-    ></View>
+    >
+      <ProFeatures />
+    </View>
   );
 };
 
@@ -77,25 +76,16 @@ const renderItems = {
   callToActions: Cta
 };
 
-export const renderItem = ({
-  item,
-  index,
-  inline
-}: {
-  item: BodyItem;
-  index: number;
-  inline?: boolean;
-}) => {
-  const Item = renderItems[item.type as keyof typeof renderItems] || Fragment;
+export const renderItem = ({ item, index, color, inline }) => {
+  const Item = renderItems[item.type] || Fragment;
 
   return (
     <Item
       key={item.text || item.src || item.type}
-      item={item}
+      {...item}
       index={index}
+      color={color}
       inline={inline}
     />
   );
 };
-
-export type BodyItemProps = { item: BodyItem; index: number; inline?: boolean };

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

@@ -24,7 +24,7 @@ import {
   eSubscribeEvent,
   eUnSubscribeEvent
 } from "../../services/event-manager";
-import { Announcement, useMessageStore } from "../../stores/use-message-store";
+import { useMessageStore } from "../../stores/use-message-store";
 import { useThemeColors } from "@notesnook/theme";
 import {
   eCloseAnnouncementDialog,
@@ -33,7 +33,6 @@ import {
 import BaseDialog from "../dialog/base-dialog";
 import { allowedOnPlatform, renderItem } from "./functions";
 import { useCallback } from "react";
-import { DefaultAppStyles } from "../../utils/styles";
 
 /**
  * Test announcement
@@ -97,24 +96,9 @@ import { DefaultAppStyles } from "../../utils/styles";
 export const AnnouncementDialog = () => {
   const { colors } = useThemeColors();
   const [visible, setVisible] = useState(false);
-  const [info, setInfo] = useState<Announcement | undefined>(undefined);
+  const [info, setInfo] = useState();
   const remove = useMessageStore((state) => state.remove);
 
-  const open = (data: Announcement) => {
-    setInfo(data);
-    setImmediate(() => {
-      setVisible(true);
-    });
-  };
-
-  const close = useCallback(() => {
-    if (visible) {
-      if (info?.id) remove(info?.id);
-      setInfo(undefined);
-      setVisible(false);
-    }
-  }, [info?.id, remove, visible]);
-
   useEffect(() => {
     eSubscribeEvent(eOpenAnnouncementDialog, open);
     eSubscribeEvent(eCloseAnnouncementDialog, close);
@@ -124,6 +108,21 @@ export const AnnouncementDialog = () => {
     };
   }, [close, visible]);
 
+  const open = (data) => {
+    setInfo(data);
+    setImmediate(() => {
+      setVisible(true);
+    });
+  };
+
+  const close = useCallback(() => {
+    if (visible) {
+      remove(info?.id);
+      setInfo(null);
+      setVisible(false);
+    }
+  }, [info?.id, remove, visible]);
+
   return (
     <BaseDialog
       animated={false}
@@ -139,9 +138,9 @@ export const AnnouncementDialog = () => {
           maxHeight: DDS.isTab ? "90%" : "100%",
           borderRadius: DDS.isTab ? 10 : 0,
           overflow: "hidden",
-          paddingVertical: DefaultAppStyles.GAP,
-          borderTopRightRadius: 15,
-          borderTopLeftRadius: 15
+          marginBottom: DDS.isTab ? 20 : 0,
+          borderTopRightRadius: 10,
+          borderTopLeftRadius: 10
         }}
       >
         <FlatList

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

@@ -21,19 +21,19 @@ import React from "react";
 import { View } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import Paragraph from "../ui/typography/paragraph";
-import { BodyItemProps, getStyle } from "./functions";
+import { getStyle } from "./functions";
 import { DefaultAppStyles } from "../../utils/styles";
 
-export const List = (props: BodyItemProps) => {
+export const List = ({ items, listType, style = {} }) => {
   return (
     <View
       style={{
         paddingHorizontal: DefaultAppStyles.GAP,
-        paddingLeft: props.item.listType === "ordered" ? 25 : 25,
-        ...getStyle(props.item.style)
+        paddingLeft: listType === "ordered" ? 25 : 25,
+        ...getStyle(style)
       }}
     >
-      {props.item.items?.map((item, index) => (
+      {items.map((item, index) => (
         <View
           key={item.text}
           style={{
@@ -41,7 +41,7 @@ export const List = (props: BodyItemProps) => {
             flexDirection: "row"
           }}
         >
-          {props.item.listType === "ordered" ? (
+          {listType === "ordered" ? (
             <Paragraph
               style={{
                 marginRight: 5

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

@@ -19,18 +19,18 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
 import { Image } from "react-native";
-import { BodyItemProps, getStyle } from "./functions";
+import { getStyle } from "./functions";
 
-export const Photo = (props: BodyItemProps) => {
-  return props.item.src ? (
+export const Photo = ({ src, style = {} }) => {
+  return src ? (
     <Image
-      source={{ uri: props.item.src }}
+      source={{ uri: src }}
       resizeMode="cover"
       style={{
         width: "100%",
         height: 200,
         alignSelf: "center",
-        ...getStyle(props.item.style)
+        ...getStyle(style)
       }}
     />
   ) : null;

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

@@ -20,19 +20,20 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React from "react";
 import { AppFontSize } from "../../utils/size";
 import Heading from "../ui/typography/heading";
-import { BodyItemProps, getStyle } from "./functions";
+import { getStyle } from "./functions";
 import { DefaultAppStyles } from "../../utils/styles";
 
-export const SubHeading = (props: BodyItemProps) => {
+export const SubHeading = ({ text, style = {} }) => {
   return (
     <Heading
       size={AppFontSize.md + 2}
       style={{
         marginHorizontal: DefaultAppStyles.GAP,
-        ...getStyle(props.item.style)
+        marginTop: DefaultAppStyles.GAP_VERTICAL,
+        ...getStyle(style)
       }}
     >
-      {props.item.text}
+      {text}
     </Heading>
   );
 };

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

@@ -0,0 +1,92 @@
+/*
+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 { useMessageStore } from "../../stores/use-message-store";
+import { AppFontSize } from "../../utils/size";
+import { Button } from "../ui/button";
+import Heading from "../ui/typography/heading";
+import { getStyle } from "./functions";
+import { DefaultAppStyles } from "../../utils/styles";
+
+export const Title = ({ text, style = {}, inline }) => {
+  const announcements = useMessageStore((state) => state.announcements);
+  let announcement = announcements.length > 0 ? announcements[0] : null;
+  const remove = useMessageStore((state) => state.remove);
+
+  return inline ? (
+    <View
+      style={{
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+        marginBottom: inline ? DefaultAppStyles.GAP_VERTICAL_SMALL : 0
+      }}
+    >
+      <Heading
+        style={{
+          marginHorizontal: DefaultAppStyles.GAP,
+          marginTop: DefaultAppStyles.GAP_VERTICAL,
+          ...getStyle(style),
+          textAlign: inline ? "left" : style?.textAlign,
+          flexShrink: 1
+        }}
+        numberOfLines={1}
+        size={inline ? AppFontSize.md : AppFontSize.xl}
+      >
+        {inline ? text?.toUpperCase() : text}
+      </Heading>
+
+      <Button
+        type="plain"
+        icon="close"
+        height={null}
+        onPress={() => {
+          remove(announcement.id);
+        }}
+        hitSlop={{
+          left: 15,
+          top: 10,
+          bottom: 10,
+          right: 0
+        }}
+        iconSize={24}
+        fontSize={AppFontSize.xs}
+        style={{
+          borderRadius: 100,
+          paddingVertical: 0,
+          paddingHorizontal: 0,
+          marginRight: 12,
+          zIndex: 10
+        }}
+      />
+    </View>
+  ) : (
+    <Heading
+      style={{
+        marginHorizontal: DefaultAppStyles.GAP,
+        ...getStyle(style),
+        marginTop: style?.marginTop || DefaultAppStyles.GAP_VERTICAL
+      }}
+    >
+      {text}
+    </Heading>
+  );
+};

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

@@ -53,6 +53,7 @@ import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
 import { strings } from "@notesnook/intl";
+import { AppFontSize } from "../../utils/size";
 import { editorController } from "../../screens/editor/tiptap/utils";
 import { useTabStore } from "../../screens/editor/tiptap/use-tab-store";
 
@@ -91,7 +92,7 @@ const AppLocked = () => {
   const lockApp = useUserStore((state) => state.lockApp);
   const deviceMode = useSettingStore((state) => state.deviceMode);
   const passwordInputRef = useRef<TextInput>(null);
-  const password = useRef<string>(undefined);
+  const password = useRef<string>();
   const appState = useAppState();
   const lastAppState = useRef<AppStateStatus>(appState);
   const biometricUnlockAwaitingUserInput = useRef(false);
@@ -238,8 +239,8 @@ const AppLocked = () => {
             deviceMode !== "mobile"
               ? "50%"
               : Platform.OS == "ios"
-                ? "95%"
-                : "100%",
+              ? "95%"
+              : "100%",
           paddingHorizontal: 12,
           marginBottom: 30,
           marginTop: 15,
@@ -335,6 +336,7 @@ const AppLocked = () => {
                     borderRadius: 150,
                     marginBottom: 10
                   }}
+                  fontSize={AppFontSize.md}
                 />
               </>
             ) : null}

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

@@ -22,7 +22,7 @@ import { Attachment, Note, VirtualizedGrouping } from "@notesnook/core";
 import { useThemeColors } from "@notesnook/theme";
 import Clipboard from "@react-native-clipboard/clipboard";
 import React, { RefObject, useEffect, useState } from "react";
-import { TextInput, View } from "react-native";
+import { View } from "react-native";
 import { ActionSheetRef } from "react-native-actions-sheet";
 import { ScrollView } from "react-native-gesture-handler";
 import { db } from "../../common/database";
@@ -46,6 +46,7 @@ import {
   eOnLoadNote
 } from "../../utils/events";
 import { AppFontSize } from "../../utils/size";
+import { sleep } from "../../utils/time";
 import { Dialog } from "../dialog";
 import { presentDialog } from "../dialog/functions";
 import { openNote } from "../list-items/note/wrapper";
@@ -58,8 +59,6 @@ import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { strings } from "@notesnook/intl";
 import { DefaultAppStyles } from "../../utils/styles";
-import Navigation from "../../services/navigation";
-import { createFormRef, validators } from "../ui/input/form-input";
 
 const Actions = ({
   attachment,
@@ -154,100 +153,50 @@ const Actions = ({
     {
       name: strings.rename(),
       onPress: () => {
-        close?.();
-        setTimeout(() => {
-          presentDialog({
-            title: strings.renameFile(),
-            form: {
-              formRef: createFormRef({
-                name: attachment.filename
-              }),
-              items: [
-                {
-                  name: "name",
-                  defaultValue: attachment.filename,
-                  placeholder: strings.enterTitle(),
-                  ref: React.createRef<TextInput | null>(),
-                  validators: [validators.required(strings.nameIsRequired())]
-                }
-              ],
-              onFormSubmit: async (form) => {
-                try {
-                  const value = form.getValue("name");
-                  await db.attachments.add({
-                    hash: attachment.hash,
-                    filename: value
-                  });
-                  setFilename(value);
-                  setAttachments();
-                  eSendEvent(eDBItemUpdate, attachment.id);
-                  ToastManager.show({
-                    message: `Attachment renamed to ${value}`,
-                    type: "success"
-                  });
-
-                  return true;
-                } catch (e) {
-                  form.setError("name", (e as Error).message);
-                  return false;
-                }
-              }
-            },
-            positiveText: strings.rename()
-          });
-        }, 500);
+        presentDialog({
+          input: true,
+          title: strings.renameFile(),
+          defaultValue: attachment.filename,
+          positivePress: async (value) => {
+            if (value && value.length > 0) {
+              await db.attachments.add({
+                hash: attachment.hash,
+                filename: value
+              });
+              setFilename(value);
+              setAttachments();
+              eSendEvent(eDBItemUpdate, attachment.id);
+            }
+            return true;
+          },
+          positiveText: strings.rename()
+        });
       },
       icon: "form-textbox"
     },
     {
       name: strings.delete(),
       onPress: async () => {
-        close?.();
-        setTimeout(() => {
-          presentDialog({
-            title: strings.deleteAttachment(),
-            paragraph: strings.deleteAttachmentConfirm(),
-            positiveText: strings.yes(),
-            negativeText: strings.no(),
-            positiveType: "errorShade",
-            positivePress: async () => {
-              try {
-                const relations = await db.relations
-                  .to(attachment, "note")
-                  .get();
-                await db.attachments.remove(attachment.hash, false);
-                ToastManager.show({
-                  type: "success",
-                  message: strings.attachmentDeleted()
+        const relations = await db.relations.to(attachment, "note").get();
+        await db.attachments.remove(attachment.hash, false);
+        setAttachments();
+        eSendEvent(eDBItemUpdate, attachment.id);
+        relations
+          .map((relation) => relation.fromId)
+          .forEach(async (id) => {
+            useTabStore.getState().forEachNoteTab(id, async (tab) => {
+              const isFocused = useTabStore.getState().currentTab === tab.id;
+              if (isFocused) {
+                eSendEvent(eOnLoadNote, {
+                  item: await db.notes.note(id),
+                  forced: true
                 });
-                setAttachments();
-                eSendEvent(eDBItemUpdate, attachment.id);
-                relations
-                  .map((relation) => relation.fromId)
-                  .forEach(async (id) => {
-                    useTabStore.getState().forEachNoteTab(id, async (tab) => {
-                      const isFocused =
-                        useTabStore.getState().currentTab === tab.id;
-                      if (isFocused) {
-                        eSendEvent(eOnLoadNote, {
-                          item: await db.notes.note(id),
-                          forced: true
-                        });
-                      } else {
-                        editorController.current.commands.setLoading(
-                          true,
-                          tab.id
-                        );
-                      }
-                    });
-                  });
-                return true;
-              } catch (e) {
-                return false;
+              } else {
+                editorController.current.commands.setLoading(true, tab.id);
               }
-            }
+            });
           });
-        }, 500);
+        close?.();
       },
       icon: "delete-outline"
     }
@@ -355,9 +304,9 @@ const Actions = ({
               <Pressable
                 onPress={async () => {
                   eSendEvent(eCloseSheet, contextId);
-                  close?.();
+                  await sleep(150);
                   eSendEvent(eCloseAttachmentDialog);
-                  Navigation.navigate("FluidPanelsView");
+                  await sleep(300);
                   openNote(item, (item as any).type === "trash");
                 }}
                 style={{

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

@@ -27,10 +27,11 @@ import {
 import { strings } from "@notesnook/intl";
 import { useThemeColors } from "@notesnook/theme";
 import React, { useEffect, useRef, useState } from "react";
-import { ActivityIndicator, FlatList, View } from "react-native";
-import { ScrollView } from "react-native-actions-sheet";
+import { ActivityIndicator, View } from "react-native";
+import { FlashList } from "react-native-actions-sheet/dist/src/views/FlashList";
+import { ScrollView } from "react-native-gesture-handler";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
-import create from "zustand";
+import create, { State } from "zustand";
 import { db } from "../../common/database";
 import filesystem from "../../common/filesystem";
 import { downloadAttachments } from "../../common/filesystem/download-attachment";
@@ -38,7 +39,6 @@ import { AttachmentGroupProgress } from "../../screens/settings/attachment-group
 import { presentSheet, ToastManager } from "../../services/event-manager";
 import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { AppFontSize } from "../../utils/size";
-import { DefaultAppStyles } from "../../utils/styles";
 import { Dialog } from "../dialog";
 import { presentDialog } from "../dialog/functions";
 import { Header } from "../header";
@@ -50,6 +50,7 @@ import Seperator from "../ui/seperator";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { AttachmentItem } from "./attachment-item";
+import { DefaultAppStyles } from "../../utils/styles";
 
 const DEFAULT_SORTING: SortOptions = {
   sortBy: "dateEdited",
@@ -64,7 +65,7 @@ type RecheckerProgress = {
   filter: string;
 };
 
-interface RecheckerState {
+interface RecheckerState extends State {
   progress: {
     [key: string]: RecheckerProgress;
   };
@@ -134,9 +135,9 @@ export const AttachmentDialog = ({
   const { colors } = useThemeColors();
   const [attachments, setAttachments] =
     useState<VirtualizedGrouping<Attachment>>();
-  const attachmentSearchValue = useRef<string>(undefined);
+  const attachmentSearchValue = useRef<string>();
   const [loading, setLoading] = useState(true);
-  const searchTimer = useRef<NodeJS.Timeout>(undefined);
+  const searchTimer = useRef<NodeJS.Timeout>();
   const [currentFilter, setCurrentFilter] = useState("all");
   const rechecker = useRechecker((state) =>
     note ? state.progress[note.id] || {} : state.progress.all
@@ -198,7 +199,7 @@ export const AttachmentDialog = ({
     }, 300);
   };
 
-  const renderItem = ({ index }: { item: boolean | number; index: number }) => (
+  const renderItem = ({ index }: { item: boolean; index: number }) => (
     <AttachmentItem
       setAttachments={async () => {
         setAttachments(await filterAttachments(currentFilter));
@@ -312,10 +313,6 @@ export const AttachmentDialog = ({
     });
   };
 
-  db.attachments.orphaned.items().then((r) => {
-    console.log(r);
-  });
-
   return (
     <>
       {isSheet ? (
@@ -329,6 +326,31 @@ export const AttachmentDialog = ({
           title={strings.manageAttachments()}
           renderedInRoute="SettingsGroup"
           canGoBack
+          // TODO: Add headerRightButtons
+          // headerRightButtons={[
+          //   {
+          //     onPress() {
+          //       onCheck();
+          //     },
+          //     title: strings.recheckAll()
+          //   },
+          //   {
+          //     onPress() {
+          //       if (!attachments) return;
+          //       presentDialog({
+          //         title: strings.doActions.download.attachment(
+          //           attachments.placeholders.length
+          //         ),
+          //         positiveText: strings.network.download(),
+          //         positivePress: async () => {
+          //           downloadAttachments(await attachments.ids());
+          //         },
+          //         negativeText: strings.cancel()
+          //       });
+          //     },
+          //     title: strings.downloadAllAttachments()
+          //   }
+          // ]}
         />
       ) : (
         <View
@@ -512,8 +534,7 @@ export const AttachmentDialog = ({
           </ScrollView>
         </View>
 
-        <FlatList
-          renderScrollComponent={(props) => <ScrollView {...props} />}
+        <FlashList
           keyboardDismissMode="none"
           keyboardShouldPersistTaps="always"
           ListEmptyComponent={
@@ -546,8 +567,8 @@ export const AttachmentDialog = ({
               }}
             />
           }
-          data={loading ? [] : attachments?.placeholders || []}
-          extraData={attachments}
+          estimatedItemSize={50}
+          data={loading ? [] : attachments?.placeholders}
           renderItem={renderItem}
         />
       </View>

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

@@ -0,0 +1,183 @@
+/*
+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 { useThemeColors } from "@notesnook/theme";
+import React, { useEffect, useRef, useState } from "react";
+import { Platform, View } from "react-native";
+import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
+import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
+import {
+  eSubscribeEvent,
+  eUnSubscribeEvent
+} from "../../services/event-manager";
+import { useUserStore } from "../../stores/use-user-store";
+import { eCloseLoginDialog, eOpenLoginDialog } from "../../utils/events";
+import { sleep } from "../../utils/time";
+import BaseDialog from "../dialog/base-dialog";
+import { Toast } from "../toast";
+import { Button } from "../ui/button";
+import { IconButton } from "../ui/icon-button";
+import { hideAuth, initialAuthMode } from "./common";
+import { Login } from "./login";
+import { Signup } from "./signup";
+import { strings } from "@notesnook/intl";
+import { DefaultAppStyles } from "../../utils/styles";
+
+export const AuthMode = {
+  login: 0,
+  signup: 1,
+  welcomeSignup: 2,
+  trialSignup: 3
+};
+
+const AuthModal = () => {
+  const { colors } = useThemeColors();
+  const [visible, setVisible] = useState(false);
+  const [currentAuthMode, setCurrentAuthMode] = useState(AuthMode.login);
+  const actionSheetRef = useRef();
+  const insets = useGlobalSafeAreaInsets();
+
+  useEffect(() => {
+    eSubscribeEvent(eOpenLoginDialog, open);
+    eSubscribeEvent(eCloseLoginDialog, close);
+    return () => {
+      eUnSubscribeEvent(eOpenLoginDialog, open);
+      eUnSubscribeEvent(eCloseLoginDialog, close);
+    };
+  }, []);
+
+  async function open(mode) {
+    setCurrentAuthMode(mode ? mode : AuthMode.login);
+    initialAuthMode.current = mode ? mode : AuthMode.login;
+    setVisible(true);
+    await sleep(10);
+    actionSheetRef.current?.show();
+  }
+
+  const close = () => {
+    useUserStore.setState({
+      disableAppLockRequests: false
+    });
+    actionSheetRef.current?.hide();
+    setCurrentAuthMode(AuthMode.login);
+    setVisible(false);
+  };
+
+  return !visible ? null : (
+    <BaseDialog
+      overlayOpacity={0}
+      statusBarTranslucent={false}
+      onShow={() => {
+        useUserStore.setState({
+          disableAppLockRequests: true
+        });
+      }}
+      onRequestClose={currentAuthMode !== AuthMode.welcomeSignup && close}
+      visible={true}
+      onClose={close}
+      useSafeArea={false}
+      bounce={false}
+      background={colors.primary.background}
+      transparent={false}
+      animated={false}
+      centered={false}
+      enableSheetKeyboardHandler
+    >
+      <KeyboardAwareScrollView
+        style={{
+          width: "100%"
+        }}
+        enableAutomaticScroll={false}
+        keyboardShouldPersistTaps="handled"
+      >
+        {currentAuthMode !== AuthMode.login ? (
+          <Signup
+            changeMode={(mode) => setCurrentAuthMode(mode)}
+            trial={AuthMode.trialSignup === currentAuthMode}
+            welcome={initialAuthMode.current === AuthMode.welcomeSignup}
+          />
+        ) : (
+          <Login
+            welcome={initialAuthMode.current === AuthMode.welcomeSignup}
+            changeMode={(mode) => setCurrentAuthMode(mode)}
+          />
+        )}
+      </KeyboardAwareScrollView>
+
+      <View
+        style={{
+          position: "absolute",
+          paddingTop: Platform.OS === "android" ? 0 : insets.top,
+          top: 0,
+          zIndex: 999,
+          backgroundColor: colors.secondary.background,
+          width: "100%"
+        }}
+      >
+        <View
+          style={{
+            flexDirection: "row",
+            alignItems: "center",
+            paddingHorizontal: DefaultAppStyles.GAP,
+            width: "100%",
+            height: 50,
+            justifyContent:
+              initialAuthMode.current !== AuthMode.welcomeSignup
+                ? "space-between"
+                : "flex-end"
+          }}
+        >
+          {initialAuthMode.current === AuthMode.welcomeSignup ? null : (
+            <IconButton
+              name="arrow-left"
+              onPress={() => {
+                hideAuth();
+              }}
+              color={colors.primary.paragraph}
+            />
+          )}
+
+          {initialAuthMode.current !== AuthMode.welcomeSignup ? null : (
+            <Button
+              title={strings.skip()}
+              onPress={() => {
+                hideAuth();
+              }}
+              iconSize={16}
+              type="plain"
+              iconPosition="right"
+              icon="chevron-right"
+              height={25}
+              iconStyle={{
+                marginTop: 2
+              }}
+              style={{
+                paddingHorizontal: DefaultAppStyles.GAP_SMALL
+              }}
+            />
+          )}
+        </View>
+      </View>
+
+      <Toast context="local" />
+    </BaseDialog>
+  );
+};
+
+export default AuthModal;

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

@@ -0,0 +1,21 @@
+/*
+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/>.
+*/
+
+export const SVG = (color) =>
+  `<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="1920" height="1080" preserveAspectRatio="none" viewBox="0 0 1920 1080"><g fill="none"><path d="M684.78-215.3C516.78-49.87 619.54 659.12 349.29 666.13 79.03 673.14-116.04 204.76-321.7 180.13" stroke="${color}" stroke-width="2"></path><path d="M1337.71-20.29C1105.2 122.03 1140.53 887.64 809.58 933.71 478.63 979.78 545.52 798.71 281.45 798.71 17.39 798.71-110.41 932.65-246.68 933.71" stroke="${color}" stroke-width="2"></path><path d="M1631.89-52.3C1379.35-21.93 1283.05 511.66 808.42 545.28 333.79 578.9 209.15 894.14-15.05 901.68" stroke="${color}" stroke-width="2"></path><path d="M1523.21-71.7C1244.4-46.38 1056.2 532.95 581.02 533.49 105.84 534.03-109.4 182.98-361.17 177.09" stroke="${color}" stroke-width="2"></path><path d="M1333.35-39.1C1041.86 57 974.42 893.52 550.36 906.48 126.3 919.44-23.8 619.56-232.63 614.88" stroke="${color}" stroke-width="2"></path></g><defs><mask id="SvgjsMask1032"><rect width="1920" height="1080" fill="#ffffff"></rect></mask></defs></svg>`;

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

@@ -18,7 +18,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import { strings } from "@notesnook/intl";
-import { useThemeColors } from "@notesnook/theme";
 import React, { useRef, useState } from "react";
 import { View } from "react-native";
 import { db } from "../../common/database";
@@ -27,44 +26,41 @@ import { eSendEvent, ToastManager } from "../../services/event-manager";
 import Navigation from "../../services/navigation";
 import { useUserStore } from "../../stores/use-user-store";
 import { eOpenRecoveryKeyDialog } from "../../utils/events";
-import { AppFontSize } from "../../utils/size";
 import { DefaultAppStyles } from "../../utils/styles";
 import { Dialog } from "../dialog";
-import AppIcon from "../ui/AppIcon";
 import { Button } from "../ui/button";
-import FormInput, { createFormRef, validators } from "../ui/input/form-input";
+import Input from "../ui/input";
 import { Notice } from "../ui/notice";
-import Paragraph from "../ui/typography/paragraph";
-import { TextInput } from "react-native-gesture-handler";
 
 export const ChangePassword = () => {
-  const { colors } = useThemeColors();
-  const formRef = useRef(
-    createFormRef({
-      oldPassword: "",
-      password: ""
-    })
-  );
-  const oldPasswordInputRef = useRef<TextInput>(null);
-  const passwordInputRef = useRef<TextInput>(null);
+  const passwordInputRef = useRef();
+  const password = useRef();
+  const oldPasswordInputRef = useRef();
+  const oldPassword = useRef();
+
+  const [error, setError] = useState(false);
   const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string>();
   const user = useUserStore((state) => state.user);
 
   const changePassword = async () => {
-    setError(undefined);
-    formRef.current.clearErrors();
-
     if (!user?.isEmailConfirmed) {
-      setError(strings.emailNotConfirmedDesc());
+      ToastManager.show({
+        heading: strings.emailNotConfirmed(),
+        message: strings.emailNotConfirmedDesc(),
+        type: "error",
+        context: "local"
+      });
       return;
     }
-    if (!formRef.current.validate()) {
+    if (error || !oldPassword.current || !password.current) {
+      ToastManager.show({
+        heading: strings.allFieldsRequired(),
+        message: strings.allFieldsRequiredDesc(),
+        type: "error",
+        context: "local"
+      });
       return;
     }
-
-    const values = formRef.current.getValues();
-
     setLoading(true);
     try {
       const result = await BackupService.run(
@@ -76,15 +72,7 @@ export const ChangePassword = () => {
         throw new Error(strings.backupFailed() + `: ${result.error}`);
       }
 
-      const passwordChanged = await db.user.changePassword(
-        values.oldPassword,
-        values.password
-      );
-
-      if (!passwordChanged) {
-        throw new Error("Could not change user account password.");
-      }
-
+      await db.user.changePassword(oldPassword.current, password.current);
       ToastManager.show({
         heading: strings.passwordChangedSuccessfully(),
         type: "success",
@@ -94,15 +82,15 @@ export const ChangePassword = () => {
       Navigation.goBack();
       eSendEvent(eOpenRecoveryKeyDialog);
     } catch (e) {
-      const message = (e as Error).message;
       setLoading(false);
-
-      if (/old password/i.test(message)) {
-        formRef.current.setError("oldPassword", message);
-      } else {
-        setError(message);
-      }
+      ToastManager.show({
+        heading: strings.passwordChangeFailed(),
+        message: e.message,
+        type: "error",
+        context: "local"
+      });
     }
+    setLoading(false);
   };
 
   return (
@@ -113,61 +101,36 @@ export const ChangePassword = () => {
       }}
     >
       <Dialog context="change-password-dialog" />
-      <FormInput
-        name="oldPassword"
-        formRef={formRef}
+      <Input
         fwdRef={oldPasswordInputRef}
-        loading={loading}
-        validators={[validators.required(strings.currentPasswordRequired())]}
+        onChangeText={(value) => {
+          oldPassword.current = value;
+        }}
         returnKeyLabel="Next"
         returnKeyType="next"
         secureTextEntry
         autoComplete="password"
         autoCapitalize="none"
         autoCorrect={false}
-        placeholder={strings.currentPassword()}
-        onSubmitEditing={() => {
-          passwordInputRef.current?.focus();
-        }}
+        placeholder={strings.oldPassword()}
       />
 
-      <FormInput
-        name="password"
-        formRef={formRef}
+      <Input
         fwdRef={passwordInputRef}
-        loading={loading}
-        validators={[validators.required(strings.passwordRequired())]}
+        onChangeText={(value) => {
+          password.current = value;
+        }}
+        onErrorCheck={(e) => setError(e)}
         returnKeyLabel={strings.next()}
         returnKeyType="next"
         secureTextEntry
+        validationType="password"
         autoComplete="password"
         autoCapitalize="none"
         autoCorrect={false}
         placeholder={strings.newPassword()}
-        onSubmitEditing={() => {
-          changePassword();
-        }}
       />
 
-      {error ? (
-        <Paragraph
-          numberOfLines={4}
-          onPress={() => {}}
-          color={colors.error.accent}
-          style={{
-            textAlign: "center",
-            marginTop: DefaultAppStyles.GAP_VERTICAL
-          }}
-        >
-          <AppIcon
-            color={colors.error.accent}
-            name="alert-circle-outline"
-            size={AppFontSize.sm - 1}
-          />{" "}
-          {error}
-        </Paragraph>
-      ) : null}
-
       <Notice text={strings.changePasswordNotice()} type="alert" />
 
       <View style={{ height: 10 }} />

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

@@ -21,25 +21,18 @@ import { createRef } from "react";
 import { eSendEvent } from "../../services/event-manager";
 import { eCloseLoginDialog } from "../../utils/events";
 import Navigation from "../../services/navigation";
-import { AuthParams } from "../../stores/use-navigation-store";
 export const AuthMode = {
   login: 0,
   signup: 1,
   welcomeSignup: 2,
-  welcomeLogin: 3,
-  trialSignup: 4
+  trialSignup: 3
 };
 
-export const initialAuthMode = createRef<number>();
-initialAuthMode.current = AuthMode.login;
-export function hideAuth(context?: AuthParams["context"]) {
+export const initialAuthMode = createRef(0);
+export function hideAuth() {
   eSendEvent(eCloseLoginDialog);
-  if (
-    initialAuthMode.current === AuthMode.welcomeSignup ||
-    initialAuthMode.current === AuthMode.welcomeLogin ||
-    context === "intro"
-  ) {
-    Navigation.navigate("FluidPanelsView", {});
+  if (initialAuthMode.current === AuthMode.welcomeSignup) {
+    Navigation.replace("FluidPanelsView");
   } else {
     Navigation.goBack();
   }

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

@@ -0,0 +1,181 @@
+/*
+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, { useRef, useState } from "react";
+import { View } from "react-native";
+import ActionSheet from "react-native-actions-sheet";
+import { db } from "../../common/database";
+import { DDS } from "../../services/device-detection";
+import { ToastManager } from "../../services/event-manager";
+import SettingsService from "../../services/settings";
+import { useThemeColors } from "@notesnook/theme";
+import DialogHeader from "../dialog/dialog-header";
+import { Button } from "../ui/button";
+import { IconButton } from "../ui/icon-button";
+import Input from "../ui/input";
+import Seperator from "../ui/seperator";
+import Heading from "../ui/typography/heading";
+import Paragraph from "../ui/typography/paragraph";
+import { strings } from "@notesnook/intl";
+import { DefaultAppStyles } from "../../utils/styles";
+
+export const ForgotPassword = () => {
+  const { colors } = useThemeColors("sheet");
+  const email = useRef();
+  const emailInputRef = useRef();
+  const [error, setError] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [sent, setSent] = useState(false);
+
+  const sendRecoveryEmail = async () => {
+    if (!email.current || error) {
+      ToastManager.show({
+        heading: strings.emailRequired(),
+        type: "error",
+        context: "local"
+      });
+      return;
+    }
+    setLoading(true);
+    try {
+      let lastRecoveryEmailTime = SettingsService.get().lastRecoveryEmailTime;
+      if (
+        lastRecoveryEmailTime &&
+        Date.now() - JSON.parse(lastRecoveryEmailTime) < 60000 * 3
+      ) {
+        throw new Error(strings.pleaseWaitBeforeSendEmail());
+      }
+      await db.user.recoverAccount(email.current.toLowerCase());
+      SettingsService.set({
+        lastRecoveryEmailTime: Date.now()
+      });
+      ToastManager.show({
+        heading: strings.recoveryEmailSent(),
+        message: strings.recoveryEmailSentDesc(),
+        type: "success",
+        context: "local",
+        duration: 7000
+      });
+      setLoading(false);
+      setSent(true);
+    } catch (e) {
+      setLoading(false);
+      ToastManager.show({
+        heading: strings.recoveryEmailFailed(),
+        message: e.message,
+        type: "error",
+        context: "local"
+      });
+    }
+  };
+
+  return (
+    <>
+      <ActionSheet
+        onBeforeShow={(data) => (email.current = data)}
+        onClose={() => {
+          setSent(false);
+          setLoading(false);
+        }}
+        keyboardShouldPersistTaps="always"
+        onOpen={() => {
+          emailInputRef.current?.setNativeProps({
+            text: email.current
+          });
+        }}
+        indicatorStyle={{
+          width: 100
+        }}
+        gestureEnabled
+        id="forgotpassword_sheet"
+      >
+        {sent ? (
+          <View
+            style={{
+              padding: DefaultAppStyles.GAP,
+              justifyContent: "center",
+              alignItems: "center",
+              paddingBottom: 50
+            }}
+          >
+            <IconButton
+              style={{
+                width: null,
+                height: null
+              }}
+              color={colors.primary.accent}
+              name="email"
+              size={50}
+            />
+            <Heading>{strings.recoveryEmailSent()}</Heading>
+            <Paragraph
+              style={{
+                textAlign: "center"
+              }}
+            >
+              {strings.recoveryEmailSentDesc()}
+            </Paragraph>
+          </View>
+        ) : (
+          <View
+            style={{
+              borderRadius: DDS.isTab ? 5 : 0,
+              backgroundColor: colors.primary.background,
+              zIndex: 10,
+              width: "100%",
+              padding: DefaultAppStyles.GAP
+            }}
+          >
+            <DialogHeader title={strings.accountRecovery()} />
+            <Seperator />
+
+            <Input
+              fwdRef={emailInputRef}
+              onChangeText={(value) => {
+                email.current = value;
+              }}
+              defaultValue={email.current}
+              onErrorCheck={(e) => setError(e)}
+              returnKeyLabel={strings.next()}
+              returnKeyType="next"
+              autoComplete="email"
+              validationType="email"
+              autoCorrect={false}
+              autoCapitalize="none"
+              errorMessage={strings.emailInvalid()}
+              placeholder={strings.email()}
+              onSubmit={() => {}}
+            />
+
+            <Button
+              style={{
+                marginTop: DefaultAppStyles.GAP_VERTICAL,
+                width: "100%"
+              }}
+              loading={loading}
+              onPress={sendRecoveryEmail}
+              type="accent"
+              title={loading ? null : strings.next()}
+            />
+          </View>
+        )}
+      </ActionSheet>
+    </>
+  );
+};

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

@@ -1,160 +0,0 @@
-/*
-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, { useRef, useState } from "react";
-import { TextInput, View } from "react-native";
-import { db } from "../../common/database";
-import { DDS } from "../../services/device-detection";
-import { ToastManager } from "../../services/event-manager";
-import SettingsService from "../../services/settings";
-import { useThemeColors } from "@notesnook/theme";
-import DialogHeader from "../dialog/dialog-header";
-import { Button } from "../ui/button";
-import { IconButton } from "../ui/icon-button";
-import FormInput, { createFormRef, validators } from "../ui/input/form-input";
-import Seperator from "../ui/seperator";
-import Heading from "../ui/typography/heading";
-import Paragraph from "../ui/typography/paragraph";
-import { strings } from "@notesnook/intl";
-import { DefaultAppStyles } from "../../utils/styles";
-
-export const ForgotPassword = ({ userEmail }: { userEmail: string }) => {
-  const { colors } = useThemeColors("sheet");
-  const formRef = useRef(
-    createFormRef({
-      email: userEmail || ""
-    })
-  );
-  const emailInputRef = useRef<TextInput>(null);
-  const [loading, setLoading] = useState(false);
-  const [sent, setSent] = useState(false);
-
-  const sendRecoveryEmail = async () => {
-    if (formRef.current.validateField("email")) {
-      return;
-    }
-
-    const values = formRef.current.getValues();
-
-    setLoading(true);
-    try {
-      const lastRecoveryEmailTime = SettingsService.get().lastRecoveryEmailTime;
-      if (
-        lastRecoveryEmailTime &&
-        Date.now() - lastRecoveryEmailTime < 60000 * 3
-      ) {
-        throw new Error(strings.pleaseWaitBeforeSendEmail());
-      }
-      await db.user.recoverAccount(values.email.toLowerCase());
-      SettingsService.set({
-        lastRecoveryEmailTime: Date.now()
-      });
-      ToastManager.show({
-        heading: strings.recoveryEmailSent(),
-        message: strings.recoveryEmailSentDesc(),
-        type: "success",
-        context: "local",
-        duration: 7000
-      });
-      setLoading(false);
-      setSent(true);
-    } catch (e) {
-      setLoading(false);
-      formRef.current.setError("email", (e as Error).message);
-    }
-  };
-
-  return (
-    <>
-      {sent ? (
-        <View
-          style={{
-            padding: DefaultAppStyles.GAP,
-            justifyContent: "center",
-            alignItems: "center",
-            paddingBottom: 50
-          }}
-        >
-          <IconButton
-            style={{
-              width: null,
-              height: null
-            }}
-            color={colors.primary.accent}
-            name="email"
-            size={50}
-          />
-          <Heading>{strings.recoveryEmailSent()}</Heading>
-          <Paragraph
-            style={{
-              textAlign: "center"
-            }}
-          >
-            {strings.recoveryEmailSentDesc()}
-          </Paragraph>
-        </View>
-      ) : (
-        <View
-          style={{
-            borderRadius: DDS.isTab ? 5 : 0,
-            backgroundColor: colors.primary.background,
-            zIndex: 10,
-            width: "100%",
-            padding: DefaultAppStyles.GAP
-          }}
-        >
-          <DialogHeader title={strings.accountRecovery()} />
-          <Seperator />
-
-          <FormInput
-            name="email"
-            formRef={formRef}
-            fwdRef={emailInputRef}
-            loading={loading}
-            returnKeyLabel={strings.next()}
-            returnKeyType="next"
-            autoComplete="email"
-            keyboardType="email-address"
-            autoCorrect={false}
-            autoCapitalize="none"
-            placeholder={strings.email()}
-            validators={[
-              validators.required(strings.emailRequired()),
-              validators.email(strings.enterAValidEmailAddress())
-            ]}
-            onSubmitEditing={() => {
-              sendRecoveryEmail();
-            }}
-          />
-
-          <Button
-            style={{
-              marginTop: DefaultAppStyles.GAP_VERTICAL,
-              width: "100%"
-            }}
-            loading={loading}
-            onPress={sendRecoveryEmail}
-            type="accent"
-            title={loading ? null : strings.next()}
-          />
-        </View>
-      )}
-    </>
-  );
-};

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

@@ -1,79 +0,0 @@
-/*
-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 { useThemeColors } from "@notesnook/theme";
-import { useRoute } from "@react-navigation/native";
-import React from "react";
-import { View } from "react-native";
-import { Button } from "../ui/button";
-import { IconButton } from "../ui/icon-button";
-import { hideAuth } from "./common";
-import { AuthParams } from "../../stores/use-navigation-store";
-export const AuthHeader = (props: { welcome?: boolean }) => {
-  const { colors } = useThemeColors();
-  const route = useRoute();
-
-  return (
-    <View
-      style={{
-        width: "100%"
-      }}
-    >
-      <View
-        style={{
-          flexDirection: "row",
-          alignItems: "center",
-          paddingHorizontal: 12,
-          width: "100%",
-          height: 50,
-          justifyContent: !props.welcome ? "space-between" : "flex-end"
-        }}
-      >
-        {props.welcome ? null : (
-          <IconButton
-            name="arrow-left"
-            onPress={() => {
-              hideAuth((route.params as AuthParams)?.context);
-            }}
-            color={colors.primary.paragraph}
-          />
-        )}
-
-        {!props.welcome ? null : (
-          <Button
-            title="Skip"
-            onPress={() => {
-              hideAuth();
-            }}
-            iconSize={16}
-            type="plain"
-            iconPosition="right"
-            icon="chevron-right"
-            height={25}
-            iconStyle={{
-              marginTop: 2
-            }}
-            style={{
-              paddingHorizontal: 6
-            }}
-          />
-        )}
-      </View>
-    </View>
-  );
-};

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

@@ -0,0 +1,130 @@
+/*
+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 { strings } from "@notesnook/intl";
+import { useThemeColors } from "@notesnook/theme";
+import React, { useState } from "react";
+import { View } from "react-native";
+import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets";
+import Navigation from "../../services/navigation";
+import { Toast } from "../toast";
+import { Button } from "../ui/button";
+import { IconButton } from "../ui/icon-button";
+import { AuthMode, initialAuthMode } from "./common";
+import { Login } from "./login";
+import { Signup } from "./signup";
+import { useNavigationFocus } from "../../hooks/use-navigation-focus";
+import { DefaultAppStyles } from "../../utils/styles";
+import { useSettingStore } from "../../stores/use-setting-store";
+
+const Auth = ({ navigation, route }) => {
+  const [currentAuthMode, setCurrentAuthMode] = useState(
+    route?.params?.mode || AuthMode.login
+  );
+  const deviceMode = useSettingStore((state) => state.deviceMode);
+  const { colors } = useThemeColors();
+  const insets = useGlobalSafeAreaInsets();
+  initialAuthMode.current = route?.params.mode || AuthMode.login;
+  useNavigationFocus(navigation, {});
+
+  return (
+    <View style={{ flex: 1 }}>
+      <View
+        style={{
+          position: "absolute",
+          paddingTop: insets.top,
+          top: 0,
+          zIndex: 999,
+          backgroundColor:
+            deviceMode === "mobile" ? colors.secondary.background : null,
+          width: "100%"
+        }}
+      >
+        <View
+          style={{
+            flexDirection: "row",
+            alignItems: "center",
+            paddingHorizontal: DefaultAppStyles.GAP,
+            width: "100%",
+            height: 50,
+            justifyContent:
+              initialAuthMode.current !== AuthMode.welcomeSignup
+                ? "space-between"
+                : "flex-end"
+          }}
+        >
+          {initialAuthMode.current === AuthMode.welcomeSignup ? null : (
+            <IconButton
+              name="arrow-left"
+              onPress={() => {
+                if (initialAuthMode.current === 2) {
+                  Navigation.replace("FluidPanelsView");
+                } else {
+                  Navigation.goBack();
+                }
+              }}
+              color={colors.primary.paragraph}
+            />
+          )}
+
+          {initialAuthMode.current !== AuthMode.welcomeSignup ? null : (
+            <Button
+              title={strings.skip()}
+              onPress={() => {
+                if (initialAuthMode.current === 2) {
+                  Navigation.replace("FluidPanelsView");
+                } else {
+                  Navigation.goBack();
+                }
+              }}
+              iconSize={16}
+              type="plain"
+              iconPosition="right"
+              icon="chevron-right"
+              height={25}
+              iconStyle={{
+                marginTop: 2
+              }}
+              style={{
+                paddingHorizontal: DefaultAppStyles.GAP_SMALL
+              }}
+            />
+          )}
+        </View>
+      </View>
+
+      {currentAuthMode !== AuthMode.login ? (
+        <Signup
+          changeMode={(mode) => setCurrentAuthMode(mode)}
+          trial={AuthMode.trialSignup === currentAuthMode}
+          welcome={initialAuthMode.current === AuthMode.welcomeSignup}
+        />
+      ) : (
+        <Login
+          welcome={initialAuthMode.current}
+          changeMode={(mode) => setCurrentAuthMode(mode)}
+        />
+      )}
+
+      <Toast context="local" />
+    </View>
+  );
+};
+
+export default Auth;

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

@@ -1,57 +0,0 @@
-/*
-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, { useState } from "react";
-import { SafeAreaView } from "react-native-safe-area-context";
-import { useNavigationFocus } from "../../hooks/use-navigation-focus";
-import { Toast } from "../toast";
-import { AuthMode, initialAuthMode } from "./common";
-import { Login } from "./login";
-import { Signup } from "./signup";
-import { useThemeColors } from "@notesnook/theme";
-import { NavigationProps } from "../../services/navigation";
-
-const Auth = ({ navigation, route }: NavigationProps<"Auth">) => {
-  const [currentAuthMode, setCurrentAuthMode] = useState(
-    route?.params?.mode || AuthMode.login
-  );
-  const { colors } = useThemeColors();
-  initialAuthMode.current = route?.params.mode || AuthMode.login;
-  useNavigationFocus(navigation, {});
-
-  return (
-    <SafeAreaView
-      style={{ flex: 1, backgroundColor: colors.primary.background }}
-    >
-      {currentAuthMode !== AuthMode.login &&
-      currentAuthMode !== AuthMode.welcomeLogin ? (
-        <Signup
-          changeMode={(mode) => setCurrentAuthMode(mode)}
-          welcome={initialAuthMode.current === AuthMode.welcomeSignup}
-        />
-      ) : (
-        <Login changeMode={(mode) => setCurrentAuthMode(mode)} />
-      )}
-
-      <Toast context="local" />
-    </SafeAreaView>
-  );
-};
-
-export default Auth;

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

@@ -0,0 +1,305 @@
+/*
+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 { strings } from "@notesnook/intl";
+import { useThemeColors } from "@notesnook/theme";
+import React, { useEffect, useState } from "react";
+import { TouchableOpacity, View, useWindowDimensions } from "react-native";
+import { SheetManager } from "react-native-actions-sheet";
+import { DDS } from "../../services/device-detection";
+import { eSendEvent } from "../../services/event-manager";
+import Sync from "../../services/sync";
+import { useUserStore } from "../../stores/use-user-store";
+import { eUserLoggedIn } from "../../utils/events";
+import { AppFontSize } from "../../utils/size";
+import { sleep } from "../../utils/time";
+import SheetProvider from "../sheet-provider";
+import { Progress } from "../sheets/progress";
+import { Button } from "../ui/button";
+import Input from "../ui/input";
+import Heading from "../ui/typography/heading";
+import Paragraph from "../ui/typography/paragraph";
+import { hideAuth } from "./common";
+import { ForgotPassword } from "./forgot-password";
+import { useLogin } from "./use-login";
+import { DefaultAppStyles } from "../../utils/styles";
+import { Dialog } from "../dialog";
+
+const LoginSteps = {
+  emailAuth: 1,
+  mfaAuth: 2,
+  passwordAuth: 3
+};
+
+export const Login = ({ changeMode }) => {
+  const { colors } = useThemeColors();
+  const [focused, setFocused] = useState(false);
+  const {
+    step,
+    setStep,
+    password,
+    email,
+    emailInputRef,
+    passwordInputRef,
+    loading,
+    setLoading,
+    setError,
+    login
+  } = useLogin(async () => {
+    hideAuth();
+    eSendEvent(eUserLoggedIn, true);
+    await sleep(500);
+    Progress.present();
+    setTimeout(() => {
+      if (!useUserStore.getState().syncing) {
+        Sync.run("global", false, "full");
+      }
+    }, 5000);
+  });
+  const { width, height } = useWindowDimensions();
+  const isTablet = width > 600;
+  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
+  }, []);
+
+  return (
+    <>
+      <ForgotPassword />
+      <Dialog context="two_factor_verify" />
+      <View
+        style={{
+          borderRadius: DDS.isTab ? 5 : 0,
+          backgroundColor: colors.primary.background,
+          zIndex: 10,
+          width: "100%",
+          height: "100%",
+          alignSelf: "center"
+        }}
+      >
+        <View
+          style={{
+            justifyContent: "flex-end",
+            paddingHorizontal: DefaultAppStyles.GAP,
+            backgroundColor: colors.secondary.background,
+            borderBottomWidth: 0.8,
+            marginBottom: DefaultAppStyles.GAP_VERTICAL,
+            borderBottomColor: colors.primary.border,
+            alignSelf: isTablet ? "center" : undefined,
+            borderWidth: isTablet ? 1 : null,
+            borderColor: isTablet ? colors.primary.border : null,
+            borderRadius: isTablet ? 20 : null,
+            marginTop: isTablet ? 50 : null,
+            width: !isTablet ? null : "70%",
+            minHeight: height * 0.4
+          }}
+        >
+          <View
+            style={{
+              flexDirection: "row"
+            }}
+          >
+            <View
+              style={{
+                width: 100,
+                height: 5,
+                backgroundColor: colors.primary.accent,
+                borderRadius: 2,
+                marginRight: 7
+              }}
+            />
+
+            <View
+              style={{
+                width: 20,
+                height: 5,
+                backgroundColor: colors.secondary.background,
+                borderRadius: 2
+              }}
+            />
+          </View>
+          <Heading
+            style={{
+              marginBottom: 25,
+              marginTop: DefaultAppStyles.GAP_VERTICAL
+            }}
+            extraBold
+            size={AppFontSize.xxl}
+          >
+            {strings.loginToYourAccount()}
+          </Heading>
+        </View>
+
+        <View
+          style={{
+            width: DDS.isTab
+              ? focused
+                ? "50%"
+                : "49.99%"
+              : focused
+              ? "100%"
+              : "99.9%",
+            backgroundColor: colors.primary.background,
+            alignSelf: "center",
+            paddingHorizontal: DefaultAppStyles.GAP
+          }}
+        >
+          <Input
+            fwdRef={emailInputRef}
+            onChangeText={(value) => {
+              email.current = value;
+            }}
+            testID="input.email"
+            onErrorCheck={(e) => setError(e)}
+            returnKeyLabel="Next"
+            returnKeyType="next"
+            autoComplete="email"
+            validationType="email"
+            autoCorrect={false}
+            autoCapitalize="none"
+            errorMessage={strings.emailInvalid()}
+            placeholder={strings.email()}
+            defaultValue={email.current}
+            editable={step === LoginSteps.emailAuth && !loading}
+            onSubmit={() => {
+              if (step === LoginSteps.emailAuth) {
+                login();
+              } else {
+                passwordInputRef.current?.focus();
+              }
+            }}
+          />
+
+          {step === LoginSteps.passwordAuth && (
+            <>
+              <Input
+                fwdRef={passwordInputRef}
+                onChangeText={(value) => {
+                  password.current = value;
+                }}
+                testID="input.password"
+                returnKeyLabel={strings.done()}
+                returnKeyType="done"
+                secureTextEntry
+                autoComplete="password"
+                autoCapitalize="none"
+                autoCorrect={false}
+                placeholder={strings.password()}
+                marginBottom={0}
+                editable={!loading}
+                defaultValue={password.current}
+                onSubmit={() => login()}
+              />
+              <Button
+                title={strings.forgotPassword()}
+                style={{
+                  alignSelf: "flex-end",
+                  paddingVertical: DefaultAppStyles.GAP_VERTICAL_SMALL,
+                  paddingHorizontal: 0
+                }}
+                onPress={() => {
+                  if (loading) return;
+                  SheetManager.show("forgotpassword_sheet", email.current);
+                }}
+                textStyle={{
+                  textDecorationLine: "underline"
+                }}
+                fontSize={AppFontSize.xs}
+                type="plain"
+              />
+            </>
+          )}
+
+          <View
+            style={{
+              marginTop: 25
+            }}
+          >
+            <Button
+              loading={loading}
+              onPress={() => {
+                if (loading) return;
+                login();
+              }}
+              style={{
+                width: 250
+              }}
+              type="accent"
+              title={!loading ? strings.continue() : null}
+            />
+
+            {step === LoginSteps.passwordAuth && (
+              <Button
+                title={strings.cancelLogin()}
+                style={{
+                  alignSelf: "center",
+                  marginTop: DefaultAppStyles.GAP_VERTICAL,
+                  width: 250
+                }}
+                onPress={() => {
+                  if (loading) return;
+                  setStep(LoginSteps.emailAuth);
+                  setLoading(false);
+                }}
+                fontSize={AppFontSize.xs}
+                type="secondaryAccented"
+              />
+            )}
+
+            {!loading ? (
+              <TouchableOpacity
+                onPress={() => {
+                  if (loading) return;
+                  changeMode(1);
+                }}
+                activeOpacity={0.8}
+                style={{
+                  alignSelf: "center",
+                  marginTop: DefaultAppStyles.GAP_VERTICAL,
+                  paddingVertical: DefaultAppStyles.GAP_VERTICAL
+                }}
+              >
+                <Paragraph
+                  size={AppFontSize.xs}
+                  color={colors.secondary.paragraph}
+                >
+                  {strings.dontHaveAccount()}{" "}
+                  <Paragraph
+                    size={AppFontSize.xs}
+                    style={{ color: colors.primary.accent }}
+                  >
+                    {strings.signUp()}
+                  </Paragraph>
+                </Paragraph>
+              </TouchableOpacity>
+            ) : null}
+          </View>
+        </View>
+      </View>
+    </>
+  );
+};

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

@@ -1,363 +0,0 @@
-/*
-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 { strings } from "@notesnook/intl";
-import { useThemeColors } from "@notesnook/theme";
-import { RouteProp, useRoute } from "@react-navigation/native";
-import React, { useEffect, useState } from "react";
-import { TouchableOpacity, View, useWindowDimensions } from "react-native";
-import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
-import { DDS } from "../../services/device-detection";
-import { eSendEvent, presentSheet } from "../../services/event-manager";
-import Navigation from "../../services/navigation";
-import PremiumService from "../../services/premium";
-import SettingsService from "../../services/settings";
-import Sync from "../../services/sync";
-import { RouteParams } from "../../stores/use-navigation-store";
-import { useUserStore } from "../../stores/use-user-store";
-import { eUserLoggedIn } from "../../utils/events";
-import { AppFontSize } from "../../utils/size";
-import { DefaultAppStyles } from "../../utils/styles";
-import { sleep } from "../../utils/time";
-import { Dialog } from "../dialog";
-import { Progress } from "../sheets/progress";
-import AppIcon from "../ui/AppIcon";
-import { Button } from "../ui/button";
-import FormInput, { validators } from "../ui/input/form-input";
-import Heading from "../ui/typography/heading";
-import Paragraph from "../ui/typography/paragraph";
-import { hideAuth } from "./common";
-import { ForgotPassword } from "./forgot-password";
-import { AuthHeader } from "./header";
-import { useLogin } from "./use-login";
-
-const LoginSteps = {
-  emailAuth: 1,
-  mfaAuth: 2,
-  passwordAuth: 3
-};
-
-export const Login = ({
-  changeMode
-}: {
-  changeMode: (mode: number) => void;
-}) => {
-  const { colors } = useThemeColors();
-  const [focused, setFocused] = useState(false);
-  const route = useRoute<RouteProp<RouteParams, "Auth">>();
-  const {
-    step,
-    setStep,
-    emailInputRef,
-    passwordInputRef,
-    loading,
-    setLoading,
-    login,
-    error,
-    formRef
-  } = useLogin(async () => {
-    eSendEvent(eUserLoggedIn, true);
-    await sleep(500);
-    hideAuth();
-    setTimeout(() => {
-      if (!useUserStore.getState().syncing) {
-        Sync.run("global", false, "full");
-      }
-    }, 5000);
-
-    if (!PremiumService.get() && !SettingsService.getProperty("serverUrls")) {
-      Navigation.navigate("PayWall", {
-        context: "signup",
-        state: route.params?.state,
-        canGoBack: false
-      });
-    } else {
-      Progress.present();
-    }
-  });
-  const { width, height } = useWindowDimensions();
-  const isTablet = width > 600;
-
-  const onContinue = () => {
-    login();
-  };
-
-  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
-  }, []);
-
-  return (
-    <>
-      <AuthHeader />
-      <Dialog context="two_factor_verify" />
-      <KeyboardAwareScrollView
-        style={{
-          width: "100%"
-        }}
-        contentContainerStyle={{
-          minHeight: "90%"
-        }}
-        nestedScrollEnabled
-        enableAutomaticScroll={true}
-        keyboardShouldPersistTaps="handled"
-      >
-        <View
-          style={{
-            borderRadius: DDS.isTab ? 5 : 0,
-            backgroundColor: colors.primary.background,
-            zIndex: 10,
-            width: "100%",
-            height: "100%",
-            alignSelf: "center"
-          }}
-        >
-          <View
-            style={{
-              justifyContent: "flex-end",
-              paddingHorizontal: DefaultAppStyles.GAP,
-              borderBottomWidth: 0.8,
-              marginBottom: DefaultAppStyles.GAP_VERTICAL,
-              borderBottomColor: colors.primary.border,
-              alignSelf: isTablet ? "center" : undefined,
-              borderWidth: isTablet ? 1 : undefined,
-              borderColor: isTablet ? colors.primary.border : undefined,
-              borderRadius: isTablet ? 20 : undefined,
-              marginTop: isTablet ? 50 : undefined,
-              width: !isTablet ? undefined : "50%",
-              minHeight: height * 0.4
-            }}
-          >
-            <View
-              style={{
-                flexDirection: "row"
-              }}
-            >
-              <View
-                style={{
-                  width: 100,
-                  height: 5,
-                  backgroundColor: colors.primary.accent,
-                  borderRadius: 2,
-                  marginRight: 7
-                }}
-              />
-
-              <View
-                style={{
-                  width: 20,
-                  height: 5,
-                  backgroundColor: colors.secondary.background,
-                  borderRadius: 2
-                }}
-              />
-            </View>
-            <Heading
-              style={{
-                marginBottom: 25,
-                marginTop: DefaultAppStyles.GAP_VERTICAL
-              }}
-              extraBold
-              size={AppFontSize.xxl}
-            >
-              {strings.loginToYourAccount()}
-            </Heading>
-          </View>
-
-          <View
-            style={{
-              width: DDS.isTab
-                ? focused
-                  ? "50%"
-                  : "49.99%"
-                : focused
-                  ? "100%"
-                  : "99.9%",
-              backgroundColor: colors.primary.background,
-              alignSelf: "center",
-              paddingHorizontal: DDS.isTab ? 0 : DefaultAppStyles.GAP,
-              gap: DefaultAppStyles.GAP_VERTICAL
-            }}
-          >
-            <FormInput
-              name="email"
-              formRef={formRef}
-              fwdRef={emailInputRef}
-              testID="input.email"
-              returnKeyLabel="Next"
-              returnKeyType="next"
-              autoComplete="email"
-              keyboardType="email-address"
-              marginBottom={0}
-              autoCorrect={false}
-              autoCapitalize="none"
-              placeholder={strings.email()}
-              editable={step === LoginSteps.emailAuth && !loading}
-              validators={[
-                validators.required(strings.emailRequired()),
-                validators.email(strings.enterAValidEmailAddress())
-              ]}
-              onSubmitEditing={() => {
-                if (step === LoginSteps.emailAuth) {
-                  onContinue();
-                } else {
-                  passwordInputRef.current?.focus();
-                }
-              }}
-            />
-
-            {step === LoginSteps.passwordAuth && (
-              <>
-                <FormInput
-                  name="password"
-                  formRef={formRef}
-                  fwdRef={passwordInputRef}
-                  testID="input.password"
-                  returnKeyLabel={strings.done()}
-                  returnKeyType="done"
-                  secureTextEntry
-                  autoComplete="password"
-                  autoCapitalize="none"
-                  autoCorrect={false}
-                  placeholder={strings.password()}
-                  marginBottom={0}
-                  editable={!loading}
-                  validators={[validators.required(strings.passwordRequired())]}
-                  onSubmitEditing={() => {
-                    onContinue();
-                  }}
-                />
-                <Button
-                  title={strings.forgotPassword()}
-                  style={{
-                    alignSelf: "flex-end",
-                    paddingVertical: DefaultAppStyles.GAP_VERTICAL_SMALL,
-                    paddingHorizontal: 0
-                  }}
-                  onPress={() => {
-                    if (loading) return;
-                    presentSheet({
-                      component: (
-                        <ForgotPassword
-                          userEmail={formRef.current.getValue("email")}
-                        />
-                      )
-                    });
-                  }}
-                  textStyle={{
-                    textDecorationLine: "underline"
-                  }}
-                  fontSize={AppFontSize.xs}
-                  type="plain"
-                />
-              </>
-            )}
-
-            <View>
-              <Button
-                loading={loading}
-                onPress={() => {
-                  onContinue();
-                }}
-                style={{
-                  width: "100%"
-                }}
-                type="accent"
-                title={!loading ? strings.continue() : null}
-                fontSize={AppFontSize.sm}
-              />
-
-              {step === LoginSteps.passwordAuth && (
-                <Button
-                  title={strings.cancelLogin()}
-                  style={{
-                    alignSelf: "center",
-                    marginTop: DefaultAppStyles.GAP_VERTICAL,
-                    width: "100%"
-                  }}
-                  onPress={() => {
-                    if (loading) return;
-                    setStep(LoginSteps.emailAuth);
-                    setLoading(false);
-                  }}
-                  type="secondaryAccented"
-                />
-              )}
-
-              {!loading ? (
-                <TouchableOpacity
-                  onPress={() => {
-                    if (loading) return;
-                    changeMode(1);
-                  }}
-                  activeOpacity={0.8}
-                  style={{
-                    alignSelf: "center",
-                    marginTop: DefaultAppStyles.GAP_VERTICAL,
-                    paddingVertical: DefaultAppStyles.GAP_VERTICAL
-                  }}
-                >
-                  <Paragraph
-                    size={AppFontSize.xs}
-                    color={colors.secondary.paragraph}
-                  >
-                    {strings.dontHaveAccount()}{" "}
-                    <Paragraph
-                      size={AppFontSize.xs}
-                      style={{ color: colors.primary.accent }}
-                    >
-                      {strings.signUp()}
-                    </Paragraph>
-                  </Paragraph>
-                </TouchableOpacity>
-              ) : null}
-
-              {error ? (
-                <Paragraph
-                  numberOfLines={4}
-                  onPress={() => {}}
-                  color={colors.error.accent}
-                  style={{
-                    textAlign: "center",
-                    marginTop: DefaultAppStyles.GAP_VERTICAL
-                  }}
-                >
-                  <AppIcon
-                    color={colors.error.accent}
-                    name="alert-circle-outline"
-                    size={AppFontSize.sm - 1}
-                  />{" "}
-                  {error.message}
-                </Paragraph>
-              ) : null}
-            </View>
-          </View>
-        </View>
-      </KeyboardAwareScrollView>
-    </>
-  );
-};

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

@@ -43,26 +43,29 @@ import SheetProvider from "../sheet-provider";
 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 { LoginSteps, useLogin } from "./use-login";
 import { strings } from "@notesnook/intl";
 import { getObfuscatedEmail } from "../../utils/functions";
 import { DefaultAppStyles } from "../../utils/styles";
-import FormInput, { validators } from "../ui/input/form-input";
 
 export const SessionExpired = () => {
   const { colors } = useThemeColors();
   const [visible, setVisible] = useState(false);
   const [focused, setFocused] = useState(false);
-  const { step, passwordInputRef, loading, login, formRef } = useLogin(() => {
-    eSendEvent(eUserLoggedIn, true);
-    setVisible(false);
-    setFocused(false);
-    useUserStore.setState({
-      disableAppLockRequests: false
-    });
-  }, true);
+  const { step, password, email, passwordInputRef, loading, login } = useLogin(
+    () => {
+      eSendEvent(eUserLoggedIn, true);
+      setVisible(false);
+      setFocused(false);
+      useUserStore.setState({
+        disableAppLockRequests: false
+      });
+    },
+    true
+  );
 
   const logout = async () => {
     try {
@@ -80,28 +83,35 @@ export const SessionExpired = () => {
       });
     } catch (e) {
       ToastManager.show({
-        heading: (e as Error).message,
+        heading: e.message,
         type: "error",
         context: "local"
       });
     }
   };
 
+  useEffect(() => {
+    const sub = eSubscribeEvent(eLoginSessionExpired, open);
+    return () => {
+      sub.unsubscribe?.();
+    };
+  }, [visible, open]);
+
   const open = React.useCallback(async () => {
     try {
-      const res = await db.tokenManager.getToken();
+      let res = await db.tokenManager.getToken();
       if (!res) throw new Error("no token found");
       if (db.tokenManager._isTokenExpired(res))
         throw new Error("token expired");
 
-      const key = await db.user.getDataEncryptionKeys();
+      const key = await db.user.getEncryptionKey();
       if (!key) throw new Error("No encryption key found.");
 
       Sync.run("global", false, "full", async (complete) => {
         if (!complete) {
-          const user = await db.user.getUser();
+          let user = await db.user.getUser();
           if (!user) return;
-          formRef.current.setValue("email", user.email);
+          email.current = user.email;
           setVisible(true);
           setFocused(false);
           return;
@@ -112,23 +122,16 @@ export const SessionExpired = () => {
         setVisible(false);
       });
     } catch (e) {
-      const user = await db.user.getUser();
+      let user = await db.user.getUser();
       if (!user) return;
-      formRef.current.setValue("email", user.email);
+      email.current = user.email;
       setFocused(false);
       setVisible(true);
       useUserStore.setState({
         disableAppLockRequests: true
       });
     }
-  }, [formRef]);
-
-  useEffect(() => {
-    const sub = eSubscribeEvent(eLoginSessionExpired, open);
-    return () => {
-      sub?.unsubscribe?.();
-    };
-  }, [visible, open]);
+  }, [email]);
 
   return (
     visible && (
@@ -152,7 +155,6 @@ export const SessionExpired = () => {
         enableSheetKeyboardHandler={true}
         visible={true}
       >
-        <Dialog context="two_factor_verify" />
         <View
           style={{
             width: focused ? "100%" : "99.9%",
@@ -189,18 +191,16 @@ export const SessionExpired = () => {
                 textAlign: "center"
               }}
             >
-              {strings.sessionExpiredDesc(
-                getObfuscatedEmail(formRef.current.getValue("email") as string)
-              )}
+              {strings.sessionExpiredDesc(getObfuscatedEmail(email.current))}
             </Paragraph>
           </View>
 
           {step === LoginSteps.passwordAuth ? (
-            <FormInput
+            <Input
               fwdRef={passwordInputRef}
-              formRef={formRef}
-              name="password"
-              validators={[validators.required(strings.passwordRequired())]}
+              onChangeText={(value) => {
+                password.current = value;
+              }}
               returnKeyLabel={strings.done()}
               returnKeyType="next"
               secureTextEntry
@@ -208,9 +208,7 @@ export const SessionExpired = () => {
               autoCapitalize="none"
               autoCorrect={false}
               placeholder={strings.password()}
-              onSubmitEditing={() => {
-                login();
-              }}
+              onSubmit={() => login()}
             />
           ) : null}