editor: add comment functionality

Signed-off-by: 01zulfi <85733202+01zulfi@users.noreply.github.com>

.github/workflows/android.e2e.yml

@@ -47,6 +47,11 @@ 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

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

@@ -73,6 +73,12 @@ 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: Build unsigned app bundle
         run: yarn release:android:bundle
 

.github/workflows/android.publish.yml

@@ -73,6 +73,12 @@ 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: Build unsigned app bundle
         run: yarn release:android:bundle
 

.github/workflows/ios.publish.yml

@@ -64,6 +64,12 @@ jobs:
           bundle install
           RCT_NEW_ARCH_ENABLED=0 bundle exec pod install
 
+      - name: Check for typescript errors
+        run: |
+          npm run tx mobile:build
+          cd apps/mobile
+          npx tsc --noEmit
+
       - name: CCache Stats Before Build
         run: ccache -sv
 

apps/desktop/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@notesnook/desktop",
-  "version": "3.3.1",
+  "version": "3.3.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@notesnook/desktop",
-      "version": "3.3.1",
+      "version": "3.3.5",
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "dependencies": {

apps/desktop/package.json

@@ -2,7 +2,7 @@
   "name": "@notesnook/desktop",
   "productName": "Notesnook",
   "description": "Your private note taking space",
-  "version": "3.3.1",
+  "version": "3.3.5",
   "appAppleId": "1544027013",
   "private": true,
   "main": "./dist/cjs/index.js",

apps/desktop/src/main.ts

@@ -18,7 +18,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
 import "./overrides";
-import { app, BrowserWindow, nativeTheme, shell } from "electron";
+import { app, BrowserWindow, nativeTheme, shell, dialog } from "electron";
 import { isDevelopment } from "./utils";
 import { registerProtocol, PROTOCOL_URL } from "./utils/protocol";
 import { configureAutoUpdater } from "./utils/autoupdater";
@@ -182,6 +182,17 @@ 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/mobile/app/common/database/encryption.ts

@@ -94,7 +94,9 @@ export async function encryptDatabaseKeyWithPassword(appLockPassword: string) {
 }
 
 export async function restoreDatabaseKeyToKeyChain(appLockPassword: string) {
-  const databaseKeyCipher: Cipher = CipherStorage.getMap(DB_KEY_CIPHER);
+  const databaseKeyCipher: Cipher = CipherStorage.getMap(
+    DB_KEY_CIPHER
+  ) as Cipher;
   const databaseKey = (await decrypt(
     {
       password: appLockPassword
@@ -135,7 +137,9 @@ export async function clearAppLockVerificationCipher() {
 
 export async function validateAppLockPassword(appLockPassword: string) {
   try {
-    const appLockCipher: Cipher = CipherStorage.getMap(APPLOCK_CIPHER);
+    const appLockCipher: Cipher = CipherStorage.getMap(
+      APPLOCK_CIPHER
+    ) as Cipher;
     if (!appLockCipher) return true;
     const key = await Sodium.deriveKey(appLockPassword, appLockCipher.salt);
     const decrypted = await decrypt(key, appLockCipher);
@@ -159,7 +163,9 @@ export function clearDatabaseKey() {
 export async function getDatabaseKey(appLockPassword?: string) {
   if (DB_KEY) return DB_KEY;
   if (appLockPassword) {
-    const databaseKeyCipher: Cipher = CipherStorage.getMap("databaseKeyCipher");
+    const databaseKeyCipher: Cipher = CipherStorage.getMap(
+      "databaseKeyCipher"
+    ) as Cipher;
     const databaseKey = await decrypt(
       {
         password: appLockPassword
@@ -293,7 +299,7 @@ export async function deriveCryptoKey(data: SerializedKey) {
 
 export async function getCryptoKey() {
   try {
-    const keyCipher: Cipher = MMKV.getMap(USER_KEY_CIPHER);
+    const keyCipher: Cipher = MMKV.getMap(USER_KEY_CIPHER) as Cipher;
     if (!keyCipher) {
       DatabaseLogger.info("User key cipher is null");
       return undefined;

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

@@ -39,7 +39,7 @@ export async function setupDatabase(password?: string) {
   const key = await getDatabaseKey(password);
   if (!key) throw new Error(strings.databaseSetupFailed());
 
-  // const base = `http://192.168.100.88`;
+  // const base = `http://192.168.100.92`;
 
   // database.host({
   //   API_HOST: `${base}:5264`,

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

@@ -136,6 +136,12 @@ 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/components/auth/common.js

@@ -38,9 +38,6 @@ export function hideAuth(context) {
     context === "intro"
   ) {
     Navigation.replace("FluidPanelsView");
-    setTimeout(() => {
-      Navigation.resetRootState();
-    }, 1000);
   } else {
     Navigation.goBack();
   }

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

@@ -39,6 +39,7 @@ import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { AuthHeader } from "./header";
 import { SignupContext } from "./signup-context";
+import SettingsService from "../../services/settings";
 
 const SignupSteps = {
   signup: 0,

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

@@ -99,7 +99,7 @@ export const useLogin = (
                   callback && callback(false);
                 } catch (e) {
                   callback && callback(false);
-                  if (e.message === "invalid_grant") {
+                  if ((e as Error).message === "invalid_grant") {
                     eSendEvent(eCloseSimpleDialog, "two_factor_verify");
                     setLoading(false);
                     setStep(LoginSteps.emailAuth);

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

@@ -35,29 +35,35 @@ import SheetProvider from "../sheet-provider";
 import RateAppSheet from "../sheets/rate-app";
 import RecoveryKeySheet from "../sheets/recovery-key";
 import Progress from "../dialogs/progress";
+import { useSettingStore } from "../../stores/use-setting-store";
 
 const DialogProvider = () => {
   const { colors } = useThemeColors();
+  const isAppLoading = useSettingStore((state) => state.isAppLoading);
 
   return (
     <>
       <AppLockPassword />
       <LoadingDialog />
-      <Dialog context="global" />
-      <AuthModal colors={colors} />
-      <MergeConflicts />
-      <RecoveryKeySheet colors={colors} />
       <SheetProvider />
       <SheetProvider context="sync_progress" />
-      <ResultDialog />
-      <VaultDialog colors={colors} />
-      <RateAppSheet />
-      <ImagePreview />
-      <AnnouncementDialog />
-      <SessionExpired />
-      <PDFPreview />
-      <JumpToSectionDialog />
+      <Dialog context="global" />
       <Progress />
+
+      {isAppLoading ? null : (
+        <>
+          <MergeConflicts />
+          <RecoveryKeySheet colors={colors} />
+          <ResultDialog />
+          <VaultDialog colors={colors} />
+          <RateAppSheet />
+          <ImagePreview />
+          <AnnouncementDialog />
+          <SessionExpired />
+          <PDFPreview />
+          <JumpToSectionDialog />
+        </>
+      )}
     </>
   );
 };

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

@@ -41,7 +41,7 @@ export const openNotebook = (item: Notebook | BaseTrashItem<Notebook>) => {
       positiveText: strings.restore(),
       negativeText: strings.delete(),
       positivePress: async () => {
-        if ((await db.trash.restore(item.id)) === false) return;
+        await db.trash.restore(item.id);
         Navigation.queueRoutesForUpdate();
         useSelectionStore.getState().setSelectionMode(undefined);
         ToastManager.show({

apps/mobile/app/components/note-history/preview.js

@@ -117,7 +117,8 @@ export default function NotePreview({ session, content, note }) {
       {!session?.locked && !locked ? (
         <View
           style={{
-            flex: 1
+            flex: 1,
+            backgroundColor: colors.primary.background
           }}
         >
           <ReadonlyEditor

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

@@ -44,6 +44,7 @@ import Config from "react-native-config";
 import * as RNIap from "react-native-iap";
 import { SafeAreaView } from "react-native-safe-area-context";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
+//@ts-ignore
 import ToggleSwitch from "toggle-switch-react-native";
 import {
   ANDROID_POLICE_SVG,

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

@@ -39,9 +39,7 @@ import {
   presentSheet
 } from "../../../services/event-manager";
 import Exporter from "../../../services/exporter";
-import PremiumService from "../../../services/premium";
 import { useSettingStore } from "../../../stores/use-setting-store";
-import { useUserStore } from "../../../stores/use-user-store";
 import { getElevationStyle } from "../../../utils/elevation";
 import { AppFontSize, defaultBorderRadius } from "../../../utils/size";
 import { DefaultAppStyles } from "../../../utils/styles";
@@ -83,7 +81,6 @@ const ExportNotesSheet = ({
     type: "pdf" | "txt" | "md" | "html" | "md-frontmatter"
   ) => {
     if (exporting) return;
-    if (!PremiumService.get() && type !== "txt") return;
     setExporting(true);
     update?.({ disableClosing: true } as PresentSheetOptions);
     setComplete(false);
@@ -145,8 +142,7 @@ const ExportNotesSheet = ({
         await exportNoteAs("txt");
       },
       icon: "card-text",
-      id: notesnook.ids.dialogs.export.text,
-      pro: true
+      id: notesnook.ids.dialogs.export.text
     },
     {
       title: "HTML",
@@ -194,8 +190,7 @@ const ExportNotesSheet = ({
                   paddingVertical: DefaultAppStyles.GAP_VERTICAL,
                   justifyContent: "flex-start",
                   borderRadius: 0,
-                  paddingHorizontal: DefaultAppStyles.GAP,
-                  opacity: item.pro ? 1 : 0.5
+                  paddingHorizontal: DefaultAppStyles.GAP
                 }}
               >
                 <View

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

@@ -29,6 +29,7 @@ import {
   View
 } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
+//@ts-ignore
 import ToggleSwitch from "toggle-switch-react-native";
 import { db } from "../../../common/database";
 import { requestInAppReview } from "../../../services/app-review";

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

@@ -171,7 +171,7 @@ const onAppOpenedFromURL = async (event: { url: string }) => {
       eSendEvent(eOnLoadNote, { newNote: true });
       fluidTabsRef.current?.goToPage("editor", false);
       return;
-    } else if (url.startsWith("https://notesnook.com/open_note")) {
+    } else if (url.startsWith("https://app.notesnook.com/open_note")) {
       const id = new URL(url).searchParams.get("id");
       if (id) {
         const note = await db.notes.note(id);
@@ -182,13 +182,13 @@ const onAppOpenedFromURL = async (event: { url: string }) => {
           fluidTabsRef.current?.goToPage("editor", false);
         }
       }
-    } else if (url.startsWith("https://notesnook.com/open_reminder")) {
+    } else if (url.startsWith("https://app.notesnook.com/open_reminder")) {
       const id = new URL(url).searchParams.get("id");
       if (id) {
         const reminder = await db.reminders.reminder(id);
         if (reminder) AddReminder.present(reminder);
       }
-    } else if (url.startsWith("https://notesnook.com/new_reminder")) {
+    } else if (url.startsWith("https://app.notesnook.com/new_reminder")) {
       const reminderFeature = await isFeatureAvailable("activeReminders");
       if (!reminderFeature.isAllowed) {
         ToastManager.show({
@@ -780,13 +780,11 @@ export const useAppEvents = () => {
     if (!isAppLoading && !appLocked) {
       setTimeout(() => {
         sub = AppState.addEventListener("change", onAppStateChanged);
-        if (
-          refValues.current.initialUrl &&
-          !refValues.current.initialUrl?.includes("open_note")
-        ) {
+        if (refValues.current.initialUrl) {
           onAppOpenedFromURL({
             url: refValues.current.initialUrl!
           });
+          refValues.current.initialUrl = undefined;
         }
       }, 1000);
 

apps/mobile/app/hooks/use-feature-manager.ts

@@ -69,36 +69,6 @@ export default function useFeatureManager() {
         db.settings.setDefaultTag(undefined);
       }
     }
-    const isAppLocked = useUserStore.getState().appLocked;
-    let unsub: () => void;
-
-    if (isAppLocked) {
-      unsub = useUserStore.subscribe((state) => {
-        if (!state.appLocked && !features?.appLock?.isAllowed) {
-          unsub();
-          SettingsService.setProperty("appLockEnabled", false);
-          setTimeout(() => {
-            presentDialog({
-              title: "App Lock Disabled",
-              paragraph: features?.appLock?.error,
-              positiveText: strings.upgrade(),
-              negativeText: strings.cancel(),
-              positivePress: async () => {
-                eSendEvent(eCloseSimpleDialog);
-                if (SettingsService.getProperty("serverUrls")) return;
-                Navigation.navigate("PayWall", {
-                  context: "logged-in"
-                });
-              }
-            });
-          }, 1000);
-        }
-      });
-    }
-
-    return () => {
-      unsub?.();
-    };
   }, [features, plan]);
 
   return true;

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

@@ -1,67 +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 { useEffect, useState } from "react";
-import { Platform } from "react-native";
-import { Subscription } from "react-native-iap";
-import PremiumService from "../services/premium";
-import { db } from "../common/database";
-import { Product } from "@notesnook/core";
-
-const skuInfos: { [name: string]: Product | undefined } = {};
-
-export const usePricing = (period: "monthly" | "yearly") => {
-  const [current, setCurrent] = useState<{
-    period: string;
-    info?: Product;
-    product?: Subscription;
-  }>();
-
-  const getDefaultSku = (period: "monthly" | "yearly") => {
-    return period === "monthly"
-      ? "com.streetwriters.notesnook.sub.mo"
-      : "com.streetwriters.notesnook.sub.yr";
-  };
-
-  useEffect(() => {
-    (async () => {
-      const skuInfo =
-        skuInfos[period] ||
-        (await db.pricing?.sku(
-          Platform.OS === "android" ? "android" : "ios",
-          period
-        ));
-      skuInfos[period] = skuInfo;
-
-      const products = (await (
-        await PremiumService.loadProductsAndSubs()
-      ).subs) as Subscription[];
-      let product = products.find((p) => p.productId === skuInfo?.sku);
-      if (!product)
-        product = products.find((p) => p.productId === getDefaultSku(period));
-      setCurrent({
-        info: skuInfo,
-        period,
-        product
-      });
-    })();
-  }, [period]);
-
-  return current;
-};

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

@@ -21,6 +21,7 @@ import React, { useCallback, useEffect } from "react";
 import { db } from "../common/database";
 import BiometricService from "../services/biometrics";
 import { eSubscribeEvent, eUnSubscribeEvent } from "../services/event-manager";
+import { useSettingStore } from "../stores/use-setting-store";
 
 const VaultStatusDefaults = {
   exists: false,
@@ -36,6 +37,7 @@ export type VaultStatusType = {
 
 export const useVaultStatus = () => {
   const [vaultStatus, setVaultStatus] = React.useState(VaultStatusDefaults);
+  const isAppLoading = useSettingStore((state) => state.isAppLoading);
 
   const checkVaultStatus = useCallback(() => {
     db.vault?.exists().then(async (exists) => {
@@ -50,12 +52,13 @@ export const useVaultStatus = () => {
   }, []);
 
   useEffect(() => {
+    if (isAppLoading) return;
     checkVaultStatus();
     eSubscribeEvent("vaultUpdated", () => checkVaultStatus());
     return () => {
       eUnSubscribeEvent("vaultUpdated", () => checkVaultStatus());
     };
-  }, [checkVaultStatus]);
+  }, [checkVaultStatus, isAppLoading]);
 
   return vaultStatus;
 };

apps/mobile/app/navigation/navigation-stack.tsx

@@ -258,12 +258,14 @@ export const RootNavigation = () => {
     (state) => state.settings.introCompleted
   );
   const clearSelection = useSelectionStore((state) => state.clearSelection);
+  const resetTimer = React.useRef<NodeJS.Timeout>(undefined);
   const onStateChange = React.useCallback(
     (state: any) => {
       if (useSelectionStore.getState().selectionMode) {
         clearSelection();
       }
-      setTimeout(() => {
+      clearTimeout(resetTimer.current);
+      resetTimer.current = setTimeout(() => {
         Navigation.resetRootState(state);
       }, 1000);
       hideAllTooltips();

apps/mobile/app/package.json

@@ -44,7 +44,8 @@
     "@trpc/react-query": "^10.45.2",
     "@trpc/server": "^10.45.2",
     "@tanstack/react-query": "^4.36.1",
-    "async-mutex": "0.5.0"
+    "async-mutex": "0.5.0",
+    "react-async-hook": "^4.0.0"
   },
   "sideEffects": false
 }

apps/mobile/app/screens/add-reminder/index.tsx

@@ -49,6 +49,7 @@ import { AppFontSize, defaultBorderRadius } from "../../utils/size";
 import { DefaultAppStyles } from "../../utils/styles";
 import { getFormattedDate, useIsFeatureAvailable } from "@notesnook/common";
 import PaywallSheet from "../../components/sheets/paywall";
+import { useNavigationFocus } from "../../hooks/use-navigation-focus";
 
 const ReminderModes =
   Platform.OS === "ios"
@@ -89,6 +90,7 @@ const ReminderNotificationModes = {
 
 export default function AddReminder(props: NavigationProps<"AddReminder">) {
   const { reminder, reference } = props.route.params;
+  useNavigationFocus(props.navigation, { focusOnInit: true });
   const { colors, isDark } = useThemeColors();
   const [reminderMode, setReminderMode] = useState<Reminder["mode"]>(
     reminder?.mode || "once"

apps/mobile/app/screens/editor/index.tsx

@@ -61,6 +61,7 @@ import {
 import { fluidTabsRef } from "../../utils/global-refs";
 import { strings } from "@notesnook/intl";
 import { i18n } from "@lingui/core";
+import { useVaultStatus } from "../../hooks/use-vault-status";
 
 const style: ViewStyle = {
   height: "100%",
@@ -197,6 +198,7 @@ const Editor = React.memo(
 export default Editor;
 
 const useLockedNoteHandler = () => {
+  const vaultStatus = useVaultStatus();
   const tab = useTabStore((state) => state.getTab(state.currentTab));
   const tabRef = useRef(tab);
   tabRef.current = tab;
@@ -217,15 +219,13 @@ const useLockedNoteHandler = () => {
 
   useEffect(() => {
     (async () => {
-      const biometry = await BiometricService.isBiometryAvailable();
-      const fingerprint = await BiometricService.hasInternetCredentials();
       useTabStore.setState({
-        biometryAvailable: !!biometry,
-        biometryEnrolled: !!fingerprint
+        biometryAvailable: !!vaultStatus.isBiometryAvailable,
+        biometryEnrolled: !!vaultStatus.biometryEnrolled
       });
       syncTabs("biometry");
     })();
-  }, [tab?.id]);
+  }, [tab?.id, vaultStatus.biometryEnrolled, vaultStatus.isBiometryAvailable]);
 
   useEffect(() => {
     const unlockWithBiometrics = async () => {

apps/mobile/app/screens/editor/tiptap/types.ts

@@ -59,6 +59,7 @@ export type Settings = {
   fontScale: number;
   markdownShortcuts: boolean;
   features: Record<any, any>;
+  loggedIn: boolean;
 };
 
 export type EditorProps = {

apps/mobile/app/screens/editor/tiptap/use-editor-events.tsx

@@ -82,6 +82,7 @@ import { editorState, openInternalLink } from "./utils";
 import AddReminder from "../../add-reminder";
 import { isFeatureAvailable, useAreFeaturesAvailable } from "@notesnook/common";
 import PaywallSheet from "../../../components/sheets/paywall";
+import useNavigationStore from "../../../stores/use-navigation-store";
 
 const publishNote = async () => {
   const user = useUserStore.getState().user;
@@ -164,6 +165,7 @@ export const useEditorEvents = (
     state.timeFormat
   ]);
   const handleBack = useRef<NativeEventSubscription>();
+  const loggedIn = useUserStore((state) => !!state.user);
   const { fontScale } = useWindowDimensions();
 
   const doubleSpacedLines = useSettingStore(
@@ -223,7 +225,8 @@ export const useEditorEvents = (
       timeFormat: db.settings?.getTimeFormat(),
       fontScale,
       markdownShortcuts,
-      features
+      features,
+      loggedIn
     });
   }, [
     fullscreen,
@@ -241,7 +244,8 @@ export const useEditorEvents = (
     timeFormat,
     loading,
     fontScale,
-    markdownShortcuts
+    markdownShortcuts,
+    loggedIn
   ]);
 
   const onBackPress = useCallback(async () => {
@@ -274,7 +278,15 @@ export const useEditorEvents = (
 
   const onHardwareBackPress = useCallback(() => {
     if (fluidTabsRef.current?.page() === "editor") {
-      onBackPress();
+      if (
+        useNavigationStore.getState().currentRoute === "ManageTags" ||
+        useNavigationStore.getState().currentRoute === "LinkNotebooks" ||
+        useNavigationStore.getState().currentRoute === "AddReminder"
+      ) {
+        Navigation.goBack();
+      } else {
+        onBackPress();
+      }
       return true;
     }
   }, [onBackPress]);
@@ -547,9 +559,17 @@ export const useEditorEvents = (
           if (editor.state.current?.isFocused) {
             editor.state.current.isFocused = true;
           }
-          PaywallSheet.present(
-            await isFeatureAvailable(editorMessage.value.feature)
-          );
+          if (editorMessage.value.feature === "insertAttachment") {
+            ToastManager.show({
+              type: "info",
+              message: strings.loginRequired()
+            });
+          } else {
+            PaywallSheet.present(
+              await isFeatureAvailable(editorMessage.value.feature)
+            );
+          }
+
           break;
         case EditorEvents.monograph:
           publishNote();

apps/mobile/app/screens/search/search-bar.tsx

@@ -19,7 +19,7 @@ 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 } from "react";
+import React, { useRef, useState } from "react";
 import { View } from "react-native";
 import { TextInput } from "react-native-gesture-handler";
 import { IconButton } from "../../components/ui/icon-button";
@@ -36,6 +36,7 @@ export const SearchBar = ({
   onChangeText: (value: string) => void;
   loading?: boolean;
 }) => {
+  const [clearButton, setClearButton] = useState(false);
   const selectionMode = useSelectionStore((state) => state.selectionMode);
   const isFocused = useNavigationStore(
     (state) => state.focusedRouteId === "Search"
@@ -45,6 +46,7 @@ export const SearchBar = ({
   const inputRef = useRef<TextInput>(null);
   const _onChangeText = (value: string) => {
     onChangeText(value);
+    setClearButton(!!value);
   };
 
   return selectionMode && isFocused ? null : (
@@ -100,6 +102,23 @@ export const SearchBar = ({
           autoCorrect={false}
           placeholderTextColor={colors.primary.placeholder}
         />
+
+        {clearButton ? (
+          <IconButton
+            name="close"
+            size={AppFontSize.xxl}
+            top={10}
+            testID="clear-search"
+            bottom={10}
+            onPress={() => {
+              inputRef.current?.clear();
+              onChangeText("");
+              setClearButton(false);
+            }}
+            color={colors.primary.paragraph}
+            type="plain"
+          />
+        ) : null}
       </View>
     </View>
   );

apps/mobile/app/screens/settings/components.tsx

@@ -43,6 +43,7 @@ import { ServersConfiguration } from "./server-config";
 import SoundPicker from "./sound-picker";
 import ThemeSelector from "./theme-selector";
 import { TitleFormat } from "./title-format";
+import { NotesnookCircle } from "./notesnook-circle";
 
 export const components: { [name: string]: ReactElement } = {
   homeselector: <HomePicker />,
@@ -69,5 +70,6 @@ export const components: { [name: string]: ReactElement } = {
   ),
   "sidebar-tab-selector": <SidebarTabPicker />,
   "change-password": <ChangePassword />,
-  "change-email": <ChangeEmail />
+  "change-email": <ChangeEmail />,
+  "notesnook-circle": <NotesnookCircle />
 };

apps/mobile/app/screens/settings/debug.tsx

@@ -185,7 +185,7 @@ export default function DebugLogs() {
       paragraph: strings.clearLogsConfirmation(currentLog.key),
       negativeText: strings.cancel(),
       positiveText: strings.clear(),
-      positivePress: () => {
+      positivePress: async () => {
         const index = logs.findIndex((l) => (l.key = currentLog.key));
         logManager?.delete(currentLog.key);
         if (logs.length > 1) {

apps/mobile/app/screens/settings/notesnook-circle.tsx

@@ -0,0 +1,213 @@
+import { CirclePartner, SubscriptionStatus } from "@notesnook/core";
+import { strings } from "@notesnook/intl";
+import { useThemeColors } from "@notesnook/theme";
+import Clipboard from "@react-native-clipboard/clipboard";
+import { useState } from "react";
+import { useAsync } from "react-async-hook";
+import {
+  ActivityIndicator,
+  Image,
+  ScrollView,
+  TouchableOpacity,
+  View
+} from "react-native";
+import { db } from "../../common/database";
+import AppIcon from "../../components/ui/AppIcon";
+import { Button } from "../../components/ui/button";
+import { Notice } from "../../components/ui/notice";
+import Heading from "../../components/ui/typography/heading";
+import Paragraph from "../../components/ui/typography/paragraph";
+import { ToastManager } from "../../services/event-manager";
+import Navigation from "../../services/navigation";
+import PremiumService from "../../services/premium";
+import { useUserStore } from "../../stores/use-user-store";
+import { AppFontSize, defaultBorderRadius } from "../../utils/size";
+import { DefaultAppStyles } from "../../utils/styles";
+import { openLinkInBrowser } from "../../utils/functions";
+import { Pressable } from "../../components/ui/pressable";
+
+export const NotesnookCircle = () => {
+  const user = useUserStore((state) => state.user);
+  const isOnTrial =
+    PremiumService.get() &&
+    user?.subscription?.status === SubscriptionStatus.TRIAL;
+  const isFree = !PremiumService.get();
+  const partners = useAsync(db.circle.partners, []);
+
+  return (
+    <ScrollView
+      contentContainerStyle={{
+        gap: DefaultAppStyles.GAP_VERTICAL,
+        paddingHorizontal: DefaultAppStyles.GAP,
+        paddingTop: DefaultAppStyles.GAP_VERTICAL
+      }}
+    >
+      {!isFree && !isOnTrial ? null : (
+        <View>
+          <Paragraph>
+            {isFree
+              ? strings.freeUserCircleNotice()
+              : strings.trialUserCircleNotice()}
+          </Paragraph>
+
+          {!isOnTrial ? null : (
+            <Button
+              title={strings.upgradePlan()}
+              onPress={() => {
+                Navigation.navigate("PayWall", {
+                  canGoBack: true,
+                  context: useUserStore.getState().user
+                    ? "logged-in"
+                    : "logged-out"
+                });
+              }}
+              style={{
+                alignSelf: "flex-start",
+                paddingHorizontal: 0
+              }}
+            />
+          )}
+        </View>
+      )}
+
+      {partners.loading ? <ActivityIndicator /> : null}
+
+      {partners.error ? (
+        <Notice type="alert" text={partners.error.message} />
+      ) : null}
+
+      {partners.result?.map((item) => (
+        <Partner item={item} available={!isFree && !isOnTrial} />
+      ))}
+    </ScrollView>
+  );
+};
+
+const Partner = ({
+  item,
+  available
+}: {
+  item: CirclePartner;
+  available: boolean;
+}) => {
+  const { colors } = useThemeColors();
+  const [code, setCode] = useState<string>();
+
+  return (
+    <View
+      style={{
+        borderRadius: defaultBorderRadius,
+        borderWidth: 1,
+        borderColor: colors.primary.border,
+        padding: DefaultAppStyles.GAP,
+        gap: DefaultAppStyles.GAP_VERTICAL
+      }}
+    >
+      <View
+        style={{
+          flexDirection: "row",
+          justifyContent: "space-between",
+          alignItems: "center"
+        }}
+      >
+        <Heading>{item.name}</Heading>
+        <Image
+          src={item.logoBase64}
+          style={{
+            width: 40,
+            height: 40
+          }}
+        />
+      </View>
+
+      <Paragraph style={{ textAlign: "justify" }}>
+        {item.longDescription.trim()}
+      </Paragraph>
+
+      <Paragraph
+        style={{
+          alignSelf: "center"
+        }}
+        color={colors.primary.accent}
+      >
+        {item.offerDescription}
+      </Paragraph>
+
+      {available ? (
+        <>
+          {!code ? (
+            <Button
+              type="accent"
+              title={strings.redeemCode()}
+              width="100%"
+              onPress={() => {
+                if (!PremiumService.get()) {
+                  Navigation.navigate("PayWall", {
+                    canGoBack: true,
+                    context: useUserStore.getState().user
+                      ? "logged-in"
+                      : "logged-out"
+                  });
+                  return;
+                }
+
+                db.circle
+                  .redeem(item.id)
+                  .then((result) => setCode(result?.code))
+                  .catch((e) => ToastManager.error(e));
+              }}
+            />
+          ) : (
+            <>
+              <TouchableOpacity
+                style={{
+                  backgroundColor: colors.secondary.background,
+                  borderRadius: defaultBorderRadius,
+                  alignItems: "center",
+                  justifyContent: "center",
+                  padding: DefaultAppStyles.GAP_SMALL,
+                  borderWidth: 0.5,
+                  borderColor: colors.secondary.border,
+                  flexDirection: "row",
+                  gap: DefaultAppStyles.GAP_SMALL
+                }}
+                activeOpacity={0.9}
+                onPress={() => {
+                  Clipboard.setString(code);
+                }}
+              >
+                <Paragraph
+                  size={AppFontSize.lg}
+                  color={colors.secondary.paragraph}
+                >
+                  {code}
+                </Paragraph>
+
+                <AppIcon name="content-copy" />
+              </TouchableOpacity>
+
+              {item.codeRedeemUrl ? (
+                <Pressable
+                  onPress={() => {
+                    if (item.codeRedeemUrl) {
+                      openLinkInBrowser(
+                        item.codeRedeemUrl.replace("{{code}}", code)
+                      );
+                    }
+                  }}
+                >
+                  <Paragraph
+                    color={colors.secondary.paragraph}
+                    size={AppFontSize.xxs}
+                  >
+                    {strings.clickToDirectlyClaimPromo()}
+                  </Paragraph>
+                </Pressable>
+              ) : null}
+            </>
+          )}
+        </>
+      ) : null}
+    </View>
+  );
+};

apps/mobile/app/screens/settings/restore-backup/index.tsx

@@ -322,6 +322,7 @@ export const RestoreBackup = () => {
         });
 
       setFiles(files);
+      setLoading(false);
       BACKUP_FILES_CACHE.splice(0, BACKUP_FILES_CACHE.length, ...files);
     } catch (e) {
       e;
@@ -519,7 +520,11 @@ const BackupItem = ({
         paddingVertical: DefaultAppStyles.GAP_VERTICAL
       }}
     >
-      <View>
+      <View
+        style={{
+          flexShrink: 1
+        }}
+      >
         <Paragraph size={AppFontSize.sm}>{itemName}</Paragraph>
         <Paragraph
           size={AppFontSize.xs}

apps/mobile/app/screens/settings/section-item.tsx

@@ -26,18 +26,17 @@ import {
 import React, { useEffect, useRef, useState } from "react";
 import { ActivityIndicator, TextInput, View } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
-//@ts-ignore
 import { FeatureResult, useIsFeatureAvailable } from "@notesnook/common";
-import { strings } from "@notesnook/intl";
+//@ts-ignore
 import ToggleSwitch from "toggle-switch-react-native";
 import PaywallSheet from "../../components/sheets/paywall";
+import AppIcon from "../../components/ui/AppIcon";
 import { IconButton } from "../../components/ui/icon-button";
 import Input from "../../components/ui/input";
 import { Pressable } from "../../components/ui/pressable";
 import Seperator from "../../components/ui/seperator";
 import Heading from "../../components/ui/typography/heading";
 import Paragraph from "../../components/ui/typography/paragraph";
-import { ToastManager } from "../../services/event-manager";
 import SettingsService from "../../services/settings";
 import useNavigationStore from "../../stores/use-navigation-store";
 import { SettingStore, useSettingStore } from "../../stores/use-setting-store";
@@ -45,7 +44,6 @@ import { AppFontSize } from "../../utils/size";
 import { DefaultAppStyles } from "../../utils/styles";
 import { components } from "./components";
 import { RouteParams, SettingSection } from "./types";
-import AppIcon from "../../components/ui/AppIcon";
 
 const _SectionItem = ({ item }: { item: SettingSection }) => {
   const { colors } = useThemeColors();

apps/mobile/app/screens/settings/settings-data.tsx

@@ -32,6 +32,7 @@ import React from "react";
 import { Appearance, Linking, Platform } from "react-native";
 import { getVersion } from "react-native-device-info";
 import * as RNIap from "react-native-iap";
+//@ts-ignore
 import { enabled } from "react-native-privacy-snapshot";
 import ScreenGuardModule from "react-native-screenguard";
 import { DatabaseLogger, db } from "../../common/database";
@@ -81,15 +82,22 @@ export const settingsGroups: SettingSection[] = [
       {
         id: "subscription-status",
         useHook: () => useUserStore((state) => state.user),
-        hidden: (current) =>
-          !current ||
-          (current as User).subscription?.plan === SubscriptionPlan.FREE,
+        hidden: (current) => {
+          const user = current as User;
+          return (
+            !user ||
+            !user.subscription ||
+            user.subscription.provider === undefined ||
+            !strings.subscriptionProviderInfo[user?.subscription?.provider] ||
+            user.subscription?.plan === SubscriptionPlan.FREE
+          );
+        },
         name: (current) => {
           const user = (current as User) || useUserStore.getState().user;
           return (
             strings.subscriptionProviderInfo[
               user?.subscription?.provider
-            ].title() || "Unknown provider"
+            ]?.title() || `Unknown provider id: ${user?.subscription?.provider}`
           );
         },
         icon: "credit-card",
@@ -99,6 +107,8 @@ export const settingsGroups: SettingSection[] = [
           const subscriptionProviderInfo =
             strings.subscriptionProviderInfo[user?.subscription?.provider];
 
+          if (!subscriptionProviderInfo) return;
+
           const isCurrentPlatform =
             (user.subscription?.provider === SubscriptionProvider.APPLE &&
               Platform.OS === "ios") ||
@@ -615,6 +625,14 @@ export const settingsGroups: SettingSection[] = [
             }
           }
         ]
+      },
+      {
+        id: "notesnook-circle",
+        name: strings.notesnookCircle(),
+        icon: "circle-outline",
+        type: "screen",
+        description: strings.notesnookCircleDesc(),
+        component: "notesnook-circle"
       }
     ]
   },
@@ -1418,7 +1436,7 @@ export const settingsGroups: SettingSection[] = [
         id: "docs-link",
         name: strings.documentation(),
         modifer: async () => {
-          Linking.openURL("https://docs.notesnook.com");
+          Linking.openURL("https://help.notesnook.com/");
         },
         description: strings.documentationDesc(),
         icon: "file-document"

apps/mobile/app/services/notifications.ts

@@ -580,7 +580,7 @@ function openSettingsDialog(context: string) {
       positivePress:
         Platform.OS === "ios"
           ? undefined
-          : () => {
+          : async () => {
               resolve(true);
             },
       onClose: () => {

apps/mobile/app/stores/use-user-store.ts

@@ -17,8 +17,15 @@ 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 { isFeatureAvailable } from "@notesnook/common";
 import { Profile, User } from "@notesnook/core";
 import create, { State } from "zustand";
+import SettingsService from "../services/settings";
+import { presentDialog } from "../components/dialog/functions";
+import { strings } from "@notesnook/intl";
+import { eSendEvent } from "../services/event-manager";
+import { eCloseSimpleDialog } from "../utils/events";
+import Navigation from "../services/navigation";
 
 export enum SyncStatus {
   Passed,
@@ -57,6 +64,28 @@ export const useUserStore = create<UserStore>((set) => ({
   setLastSynced: (lastSynced) => set({ lastSynced: lastSynced }),
   lockApp: (appLocked) => {
     set({ appLocked });
+    if (!appLocked) {
+      isFeatureAvailable("appLock").then((feature) => {
+        if (!feature.isAllowed) {
+          SettingsService.setProperty("appLockEnabled", false);
+          setTimeout(() => {
+            presentDialog({
+              title: "App Lock Disabled",
+              paragraph: feature?.error,
+              positiveText: strings.upgrade(),
+              negativeText: strings.cancel(),
+              positivePress: async () => {
+                eSendEvent(eCloseSimpleDialog);
+                if (SettingsService.getProperty("serverUrls")) return;
+                Navigation.navigate("PayWall", {
+                  context: "logged-in"
+                });
+              }
+            });
+          }, 1000);
+        }
+      });
+    }
   },
   lastSyncStatus: SyncStatus.Never,
   disableAppLockRequests: false,

apps/mobile/app/utils/functions.ts

@@ -33,6 +33,7 @@ import { useNotebookStore } from "../stores/use-notebook-store";
 import { useRelationStore } from "../stores/use-relation-store";
 import { useTagStore } from "../stores/use-tag-store";
 import { eUpdateNoteInEditor } from "./events";
+import { unlockVault } from "./unlock-vault";
 
 export function getObfuscatedEmail(email: string) {
   if (!email) return "";
@@ -56,7 +57,7 @@ function confirmDeleteAllNotes(
       title: strings.doActions.delete.notebook(items.length),
       positiveText: strings.delete(),
       negativeText: strings.cancel(),
-      positivePress: (_inputValue, value) => {
+      positivePress: async (_inputValue, value) => {
         setTimeout(() => {
           resolve({ delete: true, deleteNotes: value });
         });
@@ -98,6 +99,30 @@ export const deleteItems = async (
     await db.reminders.remove(...itemIds);
     useRelationStore.getState().update();
   } else if (type === "note") {
+    let someNotesLocked = false;
+
+    for (const id of itemIds) {
+      if (
+        await db.vaults.itemExists({
+          id: id,
+          type: "note"
+        })
+      ) {
+        someNotesLocked = true;
+        break;
+      }
+    }
+
+    if (someNotesLocked) {
+      const unlocked = await unlockVault({
+        title: strings.unlockVault(),
+        paragraph: strings.unlockVaultDesc(),
+        context: "global",
+        requirePassword: true
+      });
+      if (!unlocked) return;
+    }
+
     for (const id of itemIds) {
       if (db.monographs.isPublished(id)) {
         ToastManager.show({
@@ -108,6 +133,7 @@ export const deleteItems = async (
         });
         continue;
       }
+
       await db.notes.moveToTrash(id);
 
       eSendEvent(
@@ -157,7 +183,7 @@ export const deleteItems = async (
       heading: message,
       type: "success",
       func: async () => {
-        if ((await db.trash.restore(...deletedIds)) === false) return;
+        await db.trash.restore(...deletedIds);
         Navigation.queueRoutesForUpdate();
         useMenuStore.getState().setMenuPins();
         useMenuStore.getState().setColorNotes();

apps/mobile/app/utils/unlock-vault.ts

@@ -27,18 +27,20 @@ let unlockPromise: Promise<any> | undefined = undefined;
 export async function unlockVault({
   context,
   title,
-  paragraph
+  paragraph,
+  requirePassword
 }: {
   context?: string;
   title: string;
   paragraph: string;
+  requirePassword?: boolean;
 }) {
   if (unlockPromise) {
     return unlockPromise;
   }
   unlockPromise = new Promise(async (resolve) => {
     const result = await (async () => {
-      if (db.vault.unlocked) return true;
+      if (db.vault.unlocked && !requirePassword) return true;
       const biometry = await BiometricService.isBiometryAvailable();
       const fingerprint = await BiometricService.hasInternetCredentials();
       if (biometry && fingerprint) {

apps/mobile/e2e/globalSetup.ts

@@ -1,5 +1,5 @@
 import { execSync } from "child_process";
-
+//@ts-ignore
 import { pathExists, ensureDir } from "fs-extra";
 
 import { resolveConfig } from "detox/internals";

apps/mobile/e2e/tests/note.e2e.ts

@@ -1,22 +1,3 @@
-/*
-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 { notesnook } from "../test.ids";
 import { TestBuilder } from "./utils";
 

apps/mobile/e2e/tests/search.e2e.ts

@@ -28,6 +28,9 @@ describe("Search", () => {
       .typeTextById("search-input", "Test")
       .wait(1000)
       .isVisibleByText("1")
+      .waitAndTapById("clear-search")
+      .wait(2000)
+      .isNotVisibleByText("1")
       .run();
   });
 });

apps/mobile/e2e/tests/utils.ts

@@ -20,6 +20,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { expect as jestExpect } from "@jest/globals";
 import { device as _device, expect } from "detox";
 import { readFileSync } from "fs";
+//@ts-ignore
 import { toMatchImageSnapshot } from "jest-image-snapshot";
 import type { RouteName } from "../../app/stores/use-navigation-store";
 import { notesnook } from "../test.ids";

apps/mobile/native/android/app/build.gradle

@@ -124,7 +124,7 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled true
-        versionCode 3073
+        versionCode 3078
         versionName getNpmVersion()
         testBuildType System.getProperty('testBuildType', 'debug')
         testInstrumentationRunner 'androidx.test.runner.AndroidJUnitRunner'

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

@@ -33,7 +33,7 @@ public class NotePreviewWidget extends AppWidgetProvider {
         intent.putExtra(OpenNoteId, note.getId());
         intent.setAction(Intent.ACTION_VIEW);
         intent.putExtra(RCTNNativeModule.IntentType, "OpenNote");
-        intent.setData(Uri.parse("https://notesnook.com/open_note?id=" + note.getId()));
+        intent.setData(Uri.parse("https://app.notesnook.com/open_note?id=" + note.getId()));
         PendingIntent pendingIntent = PendingIntent.getActivity(context, appWidgetId, intent, PendingIntent.FLAG_UPDATE_CURRENT | PendingIntent.FLAG_IMMUTABLE, getActivityOptionsBundle());
         views.setOnClickPendingIntent(R.id.open_note, pendingIntent);
 

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

@@ -75,7 +75,7 @@ class ReminderRemoteViewsFactory implements RemoteViewsService.RemoteViewsFactor
         final Intent fillInIntent = new Intent();
         final Bundle extras = new Bundle();
         extras.putString(ReminderViewsService.OpenReminderId, reminder.getId());
-        fillInIntent.setData(Uri.parse("https://notesnook.com/open_reminder?id=" + reminder.getId()));
+        fillInIntent.setData(Uri.parse("https://app.notesnook.com/open_reminder?id=" + reminder.getId()));
         fillInIntent.putExtra(RCTNNativeModule.IntentType, "OpenReminder");
         fillInIntent.putExtras(extras);
         views.setOnClickFillInIntent(R.id.reminder_item_btn, fillInIntent);

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

@@ -43,7 +43,7 @@ public class ReminderWidgetProvider extends AppWidgetProvider {
         new_reminder_intent.putExtra(NewReminder, NewReminder);
         new_reminder_intent.setAction(Intent.ACTION_VIEW);
         new_reminder_intent.putExtra(RCTNNativeModule.IntentType, "NewReminder");
-        new_reminder_intent.setData(Uri.parse("https://notesnook.com/new_reminder"));
+        new_reminder_intent.setData(Uri.parse("https://app.notesnook.com/new_reminder"));
         PendingIntent pendingIntent2 = PendingIntent.getActivity(context, appWidgetId, new_reminder_intent, PendingIntent.FLAG_CANCEL_CURRENT | PendingIntent.FLAG_IMMUTABLE, getActivityOptionsBundle());
         views.setOnClickPendingIntent(R.id.add_button, pendingIntent2);
 

apps/mobile/native/android/app/src/main/res/layout/widget_reminder_layout.xml

@@ -2,6 +2,7 @@
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:paddingVertical="10dp"
     android:id="@+id/reminder_item_btn">
 
     <TextView

apps/mobile/native/android/app/src/main/res/layout/widget_reminder_layout_small.xml

@@ -2,6 +2,7 @@
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:paddingVertical="10dp"
     android:id="@+id/reminder_item_btn">
 
     <TextView

apps/mobile/native/android/app/src/main/res/layout/widget_reminders.xml

@@ -25,9 +25,9 @@
             android:text="Upcoming Reminders"/>
 
         <ImageButton
-            android:layout_width="30dp"
+            android:layout_width="35dp"
             android:id="@+id/add_button"
-            android:layout_height="30dp"
+            android:layout_height="35dp"
             android:layout_alignParentRight="true"
             android:background="@drawable/ic_newnote" />
     </RelativeLayout>

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

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

apps/mobile/native/ios/Notesnook.xcodeproj/project.pbxproj

@@ -654,6 +654,7 @@
 			inputPaths = (
 				"${PODS_ROOT}/Target Support Files/Pods-Notesnook/Pods-Notesnook-resources.sh",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RCT-Folly/RCT-Folly_privacy.bundle",
+				"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/RNImageCropPickerPrivacyInfo.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/QBImagePicker.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RNSVG/RNSVGFilters.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/React-Core/React-Core_privacy.bundle",
@@ -665,6 +666,7 @@
 			name = "[CP] Copy Pods Resources";
 			outputPaths = (
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RCT-Folly_privacy.bundle",
+				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RNImageCropPickerPrivacyInfo.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/QBImagePicker.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RNSVGFilters.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/React-Core_privacy.bundle",
@@ -821,6 +823,7 @@
 			inputPaths = (
 				"${PODS_ROOT}/Target Support Files/Pods-Notesnook-NotesnookTests/Pods-Notesnook-NotesnookTests-resources.sh",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RCT-Folly/RCT-Folly_privacy.bundle",
+				"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/RNImageCropPickerPrivacyInfo.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/QBImagePicker.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/RNSVG/RNSVGFilters.bundle",
 				"${PODS_CONFIGURATION_BUILD_DIR}/React-Core/React-Core_privacy.bundle",
@@ -832,6 +835,7 @@
 			name = "[CP] Copy Pods Resources";
 			outputPaths = (
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RCT-Folly_privacy.bundle",
+				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RNImageCropPickerPrivacyInfo.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/QBImagePicker.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RNSVGFilters.bundle",
 				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/React-Core_privacy.bundle",
@@ -1091,7 +1095,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEVELOPMENT_TEAM = 53CWBG3QUC;
 				ENABLE_BITCODE = NO;
 				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64;
@@ -1165,7 +1169,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				OTHER_LDFLAGS = (
 					"$(inherited)",
 					"-ObjC",
@@ -1196,7 +1200,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 53CWBG3QUC;
 				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64;
@@ -1270,7 +1274,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_LDFLAGS = (
 					"$(inherited)",
@@ -1429,7 +1433,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEBUG_INFORMATION_FORMAT = dwarf;
 				DEVELOPMENT_TEAM = 53CWBG3QUC;
 				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64;
@@ -1441,7 +1445,7 @@
 					"@executable_path/Frameworks",
 					"@executable_path/../../Frameworks",
 				);
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE;
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = org.streetwriters.notesnook.notewidget;
@@ -1472,7 +1476,7 @@
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
 				COPY_PHASE_STRIP = NO;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 53CWBG3QUC;
@@ -1485,7 +1489,7 @@
 					"@executable_path/Frameworks",
 					"@executable_path/../../Frameworks",
 				);
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = org.streetwriters.notesnook.notewidget;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -1515,7 +1519,7 @@
 				CODE_SIGN_ENTITLEMENTS = "Make Note/Make Note.entitlements";
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEBUG_INFORMATION_FORMAT = dwarf;
 				DEVELOPMENT_TEAM = 53CWBG3QUC;
 				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = arm64;
@@ -1596,7 +1600,7 @@
 					"@executable_path/../../Frameworks",
 				);
 				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift$(inherited)";
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE;
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = org.streetwriters.notesnook.share;
@@ -1627,7 +1631,7 @@
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
 				COPY_PHASE_STRIP = NO;
-				CURRENT_PROJECT_VERSION = 2152;
+				CURRENT_PROJECT_VERSION = 2157;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 53CWBG3QUC;
@@ -1709,7 +1713,7 @@
 					"@executable_path/../../Frameworks",
 				);
 				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift$(inherited)";
-				MARKETING_VERSION = 3.3.4;
+				MARKETING_VERSION = 3.3.9;
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = org.streetwriters.notesnook.share;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -1786,7 +1790,10 @@
 				ONLY_ACTIVE_ARCH = YES;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_CPLUSPLUSFLAGS = "$(inherited)";
-				OTHER_LDFLAGS = "$(inherited)  ";
+				OTHER_LDFLAGS = (
+					"$(inherited)",
+					" ",
+				);
 				REACT_NATIVE_PATH = "${PODS_ROOT}/../../../node_modules/react-native";
 				SDKROOT = iphoneos;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG";
@@ -1851,7 +1858,10 @@
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_CPLUSPLUSFLAGS = "$(inherited)";
-				OTHER_LDFLAGS = "$(inherited)  ";
+				OTHER_LDFLAGS = (
+					"$(inherited)",
+					" ",
+				);
 				REACT_NATIVE_PATH = "${PODS_ROOT}/../../../node_modules/react-native";
 				SDKROOT = iphoneos;
 				USE_HERMES = true;

apps/mobile/native/ios/Notesnook/PrivacyInfo.xcprivacy

@@ -9,6 +9,7 @@
 			<string>NSPrivacyAccessedAPICategoryFileTimestamp</string>
 			<key>NSPrivacyAccessedAPITypeReasons</key>
 			<array>
+				<string>3B52.1</string>
 				<string>C617.1</string>
 			</array>
 		</dict>

apps/mobile/native/ios/Podfile.lock

@@ -1273,11 +1273,11 @@ PODS:
     - React-Core
   - react-native-keep-awake (1.3.1):
     - React-Core
-  - react-native-mmkv-storage (0.11.2):
+  - react-native-mmkv-storage (12.0.0):
     - DoubleConversion
     - glog
     - hermes-engine
-    - MMKV (~> 1.3.9)
+    - MMKV (~> 1.3.14)
     - RCT-Folly (= 2024.11.18.00)
     - RCTRequired
     - RCTTypeSafety
@@ -1372,7 +1372,7 @@ PODS:
   - react-native-screenguard (1.0.0):
     - React-Core
     - SDWebImage (~> 5.11.1)
-  - react-native-share-extension (2.9.0):
+  - react-native-share-extension (2.9.5):
     - React
   - react-native-sodium (1.6.5):
     - React
@@ -1770,15 +1770,53 @@ PODS:
     - Yoga
   - RNIap (12.16.2):
     - React-Core
-  - RNImageCropPicker (0.40.2):
+  - RNImageCropPicker (0.51.1):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.11.18.00)
+    - RCTRequired
+    - RCTTypeSafety
     - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-ImageManager
+    - React-NativeModulesApple
+    - React-RCTFabric
     - React-RCTImage
-    - RNImageCropPicker/QBImagePickerController (= 0.40.2)
-    - TOCropViewController
-  - RNImageCropPicker/QBImagePickerController (0.40.2):
+    - React-rendererdebug
+    - React-utils
+    - ReactCodegen
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - RNImageCropPicker/QBImagePickerController (= 0.51.1)
+    - TOCropViewController (~> 2.8.0)
+    - Yoga
+  - RNImageCropPicker/QBImagePickerController (0.51.1):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.11.18.00)
+    - RCTRequired
+    - RCTTypeSafety
     - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-ImageManager
+    - React-NativeModulesApple
+    - React-RCTFabric
     - React-RCTImage
-    - TOCropViewController
+    - React-rendererdebug
+    - React-utils
+    - ReactCodegen
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - TOCropViewController (~> 2.8.0)
+    - Yoga
   - RNKeychain (4.0.5):
     - React
   - RNNotifee (7.4.9):
@@ -1975,7 +2013,7 @@ PODS:
   - SwiftyRSA (1.7.0):
     - SwiftyRSA/ObjC (= 1.7.0)
   - SwiftyRSA/ObjC (1.7.0)
-  - TOCropViewController (2.7.4)
+  - TOCropViewController (2.8.0)
   - toolbar-android (0.2.1):
     - React
   - Yoga (0.0.0)
@@ -2425,7 +2463,7 @@ SPEC CHECKSUMS:
   react-native-image-resizer: 24c5d06fae2176dc0caed4b6396e02befb44064a
   react-native-in-app-review: b3d1eed3d1596ebf6539804778272c4c65e4a400
   react-native-keep-awake: 03b74eebe4f2bb5e8478fc8f420651a92463b6f8
-  react-native-mmkv-storage: 51c33c6f6678d67061059cce8189a57c3e47192e
+  react-native-mmkv-storage: 935d661dc3913a41be70d041aa3ff860d6aa4873
   react-native-netinfo: 66c9ac0d0ae92a57a9ed99ab8a75429740700c73
   react-native-notification-sounds: ce106d58df0dd384bccbd2e84fb53accab7cc068
   react-native-orientation-locker: cc6f357b289a2e0dd2210fea0c52cb8e0727fdaa
@@ -2434,7 +2472,7 @@ SPEC CHECKSUMS:
   react-native-quick-sqlite: 1bfc7f1e9acbe9a5aa5c4cc81712e9bde3ab7672
   react-native-safe-area-context: 9d72abf6d8473da73033b597090a80b709c0b2f1
   react-native-screenguard: 82437eeb0086a90b5e5d7e54130bb04fb406373e
-  react-native-share-extension: bcb7e466390a9e50c742f4b1019d6f181aedd7ad
+  react-native-share-extension: fdc6aaab51591a2d445df239c446aaa3a99658ec
   react-native-sodium: 285eec063e4232cb67347ef6a434b85e588d38cb
   react-native-theme-switch-animation: d90fe2de0d9e87a63cd6235d98cba6e7054e9a10
   react-native-webview: 079eca50edf657503318b66687dadfb903731aa8
@@ -2479,7 +2517,7 @@ SPEC CHECKSUMS:
   RNFlashList: ff5a0b3113c4cda0eaf4b94df8572ccad3c40fd5
   RNGestureHandler: 92e89a04cd0d1c77f383a55d14c15e7f423f4c00
   RNIap: f94647b3a3dbd5fa08ad7ed847eb588aa5fe95fe
-  RNImageCropPicker: 30d770b383d84e1067d82ea7b5ed4fff851bbbb2
+  RNImageCropPicker: aa81bda9f887e20542b569938cde5ce50a4ec404
   RNKeychain: ffd0513e676445c637410b47249460cbf56bc9cb
   RNNotifee: dabf3cdd7bfd9340bb84358cc78f635af4bc80e2
   RNPrivacySnapshot: ccad3a548338c2f526bb7b1789af3fb0618b7d1d
@@ -2495,7 +2533,7 @@ SPEC CHECKSUMS:
   SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748
   SSZipArchive: fe6a26b2a54d5a0890f2567b5cc6de5caa600aef
   SwiftyRSA: 8c6dd1ea7db1b8dc4fb517a202f88bb1354bc2c6
-  TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654
+  TOCropViewController: 797deaf39c90e6e9ddd848d88817f6b9a8a09888
   toolbar-android: c426ed5bd3dcccfed20fd79533efc0d1ae0ef018
   Yoga: 31a098f74c16780569aebd614a0f37a907de0189
 

apps/mobile/native/package.json

@@ -21,6 +21,7 @@
     "@react-navigation/native": "^6.0.10",
     "@react-navigation/native-stack": "6.6.2",
     "@sayem314/react-native-keep-awake": "^1.3.1",
+    "react-native-image-crop-picker": "^0.51.1",
     "react": "18.2.0",
     "react-native": "0.77.2",
     "react-native-actions-shortcuts": "^1.0.1",
@@ -48,7 +49,7 @@
     "react-native-navigation-bar-color": "2.0.2",
     "react-native-notification-sounds": "0.5.5",
     "@shopify/flash-list": "^1.8.0",
-    "react-native-mmkv-storage": "^0.11.2",
+    "react-native-mmkv-storage": "^12.0.0",
     "react-native-quick-sqlite": "^8.2.7",
     "react-native-svg": "^15.12.0",
     "react-native-webview": "^13.13.5",
@@ -61,7 +62,6 @@
     "react-native-zip-archive": "6.0.9",
     "react-native-theme-switch-animation": "^0.6.0",
     "@ammarahmed/react-native-background-fetch": "^4.2.2",
-    "react-native-image-crop-picker": "^0.40.2",
     "react-native-url-polyfill": "^2.0.0",
     "react-native-screenguard": "^1.0.0",
     "@formatjs/intl-locale": "4.0.0",
@@ -72,10 +72,10 @@
     "react-native-begin-background-task": "github:blockfirm/react-native-begin-background-task",
     "react-native-privacy-snapshot": "github:standardnotes/react-native-privacy-snapshot",
     "@ammarahmed/react-native-fingerprint-scanner": "^5.0.0",
-    "@ammarahmed/react-native-share-extension": "^2.9.0",
     "react-native-pager-view": "^6.5.1",
     "react-native-tab-view": "^4.0.2",
-    "react-native-orientation-locker": "^1.7.0"
+    "react-native-orientation-locker": "^1.7.0",
+    "@ammarahmed/react-native-share-extension": "^2.9.5"
   },
   "devDependencies": {
     "@babel/core": "^7.27.1",

apps/mobile/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@notesnook/mobile",
-  "version": "3.3.4",
+  "version": "3.3.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@notesnook/mobile",
-      "version": "3.3.4",
+      "version": "3.3.7",
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "workspaces": [
@@ -3730,7 +3730,7 @@
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "dependencies": {
-        "@notesnook-importer/core": "^2.2.2",
+        "@notesnook-importer/core": "^2.2.5",
         "@notesnook/common": "file:../common",
         "@notesnook/intl": "file:../intl",
         "@notesnook/theme": "file:../theme",
@@ -28297,6 +28297,7 @@
         "pathe": "1.1.2",
         "phone": "^3.1.14",
         "qclone": "^1.2.0",
+        "react-async-hook": "^4.0.0",
         "react-native-actions-sheet": "0.9.7",
         "react-native-check-version": "^1.3.0",
         "react-native-drax": "^0.10.2",
@@ -28325,7 +28326,7 @@
         "@ammarahmed/react-native-background-fetch": "^4.2.2",
         "@ammarahmed/react-native-eventsource": "1.1.0",
         "@ammarahmed/react-native-fingerprint-scanner": "^5.0.0",
-        "@ammarahmed/react-native-share-extension": "^2.9.0",
+        "@ammarahmed/react-native-share-extension": "^2.9.5",
         "@ammarahmed/react-native-sodium": "^1.6.5",
         "@bam.tech/react-native-image-resizer": "3.0.11",
         "@callstack/repack": "~5.1.2",
@@ -28360,10 +28361,10 @@
         "react-native-gzip": "1.1.0",
         "react-native-html-to-pdf-lite": "^0.9.1",
         "react-native-iap": "12.16.2",
-        "react-native-image-crop-picker": "^0.40.2",
+        "react-native-image-crop-picker": "^0.51.1",
         "react-native-in-app-review": "4.3.3",
         "react-native-keychain": "4.0.5",
-        "react-native-mmkv-storage": "^0.11.2",
+        "react-native-mmkv-storage": "^12.0.0",
         "react-native-modal-datetime-picker": "14.0.0",
         "react-native-navigation-bar-color": "2.0.2",
         "react-native-notification-sounds": "0.5.5",
@@ -28471,9 +28472,9 @@
       }
     },
     "node_modules/@ammarahmed/react-native-share-extension": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/@ammarahmed/react-native-share-extension/-/react-native-share-extension-2.9.0.tgz",
-      "integrity": "sha512-iEkpJQFZL5/WDPh7iRCLZREANgaaAHthDsPaAYT6sI4wieQcHZMBAnfRMwBEnC0BZ0WVxbQZdzJYez+dmwpr2g==",
+      "version": "2.9.5",
+      "resolved": "https://registry.npmjs.org/@ammarahmed/react-native-share-extension/-/react-native-share-extension-2.9.5.tgz",
+      "integrity": "sha512-UTE8TSxkx+RFNgSJCCfD5FSdQ5IuMOsZzuuy0BVy46emRrpPw1fedJTtDbqyKrU8fwtKEIbzJWeQtjjRZlHxjQ==",
       "license": "MIT",
       "dependencies": {
         "react-native": "^0.63.1"
@@ -44134,6 +44135,19 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-async-hook": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/react-async-hook/-/react-async-hook-4.0.0.tgz",
+      "integrity": "sha512-97lgjFkOcHCTYSrsKBpsXg3iVWM0LnzedB749iP76sb3/8Ouu4nHIkCLEOrQWHVYqrYxjF05NN6GHoXWFkB3Kw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8",
+        "npm": ">=5"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
     "node_modules/react-devtools-core": {
       "version": "6.1.2",
       "resolved": "https://registry.npmjs.org/react-devtools-core/-/react-devtools-core-6.1.2.tgz",
@@ -44505,10 +44519,13 @@
       }
     },
     "node_modules/react-native-image-crop-picker": {
-      "version": "0.40.2",
+      "version": "0.51.1",
+      "resolved": "https://registry.npmjs.org/react-native-image-crop-picker/-/react-native-image-crop-picker-0.51.1.tgz",
+      "integrity": "sha512-GIFRyXJgv1dPceKd/hraK9q9V38v45rSg2ONR6RiSePcOJemkHpc/PMU86pq6lWPilDYHSxbZmea2pNMk85ayw==",
       "license": "MIT",
       "peerDependencies": {
-        "react-native": ">=0.40.0"
+        "react": "*",
+        "react-native": "*"
       }
     },
     "node_modules/react-native-image-pan-zoom": {
@@ -44576,9 +44593,9 @@
       }
     },
     "node_modules/react-native-mmkv-storage": {
-      "version": "0.11.2",
-      "resolved": "https://registry.npmjs.org/react-native-mmkv-storage/-/react-native-mmkv-storage-0.11.2.tgz",
-      "integrity": "sha512-/jbYNOUrwgVU09WyXDK6lFGXqBs+23oR9X37z3N68rwHNiXF5WDyXnT38dU2tF07ZlvmsobNHgdxgTu4kGQUKQ==",
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/react-native-mmkv-storage/-/react-native-mmkv-storage-12.0.0.tgz",
+      "integrity": "sha512-sssZInILQBquytDDfjosjEdvevwMPk3fqQQjdjfnH362IcsBsApvtT8yJS406Mz9aJ6VhqVsZw/awltsUuPSYg==",
       "license": "MIT",
       "bin": {
         "mmkv-link": "autolink/postlink/run.js"

apps/mobile/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@notesnook/mobile",
-  "version": "3.3.4",
+  "version": "3.3.9",
   "private": true,
   "license": "GPL-3.0-or-later",
   "workspaces": [
@@ -56,4 +56,4 @@
     "react": "18.2.0",
     "react-native": "0.77.2"
   }
-}
+}

apps/mobile/patches/react-native-image-crop-picker+0.51.1.patch

@@ -1,27 +1,27 @@
-diff --git a/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/PickerModule.java b/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/PickerModule.java
-index 5de0845..1b158d8 100644
---- a/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/PickerModule.java
-+++ b/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/PickerModule.java
-@@ -692,6 +692,7 @@ class PickerModule extends ReactContextBaseJavaModule implements ActivityEventLi
-         image.putString("mime", options.outMimeType);
+diff --git a/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/ImageCropPicker.java b/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/ImageCropPicker.java
+index b9c494e..34ef800 100644
+--- a/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/ImageCropPicker.java
++++ b/node_modules/react-native-image-crop-picker/android/src/main/java/com/reactnative/ivpusic/imagepicker/ImageCropPicker.java
+@@ -679,6 +679,7 @@ class ImageCropPicker implements ActivityEventListener {
          image.putInt("size", (int) new File(compressedImagePath).length());
          image.putString("modificationDate", String.valueOf(modificationDate));
+         image.putString("filename", new File(path).getName());
 +        image.putString("sourceURL", path);
  
          if (includeBase64) {
              image.putString("data", getBase64StringFromFile(compressedImagePath));
-diff --git a/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.m b/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.m
-index 9f20973..5e14da8 100644
---- a/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.m
-+++ b/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.m
-@@ -595,8 +595,10 @@ - (void)qb_imagePickerController:
-                                     NSString *mimeType = [self determineMimeTypeFromImageData:imageData];
+diff --git a/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.mm b/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.mm
+index 354ad09..622f779 100644
+--- a/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.mm
++++ b/node_modules/react-native-image-crop-picker/ios/src/ImageCropPicker.mm
+@@ -603,7 +603,10 @@ - (void)qb_imagePickerController:(QBImagePickerController *)imagePickerControlle
                                      Boolean isKnownMimeType = [mimeType length] > 0;
                                      
-+                                    Boolean isHeicOrHeif = [mimeType isEqualToString:@"image/heic"] || [mimeType isEqualToString:@"image/heif"];
-+                                    
                                      ImageResult *imageResult = [[ImageResult alloc] init];
 -                                    if (isLossless && useOriginalWidth && useOriginalHeight && isKnownMimeType && !forceJpg) {
++
++                                    Boolean isHeicOrHeif = [mimeType isEqualToString:@"image/heic"] || [mimeType isEqualToString:@"image/heif"];
++
 +                                    if (isLossless && useOriginalWidth && useOriginalHeight && isKnownMimeType && !forceJpg && !isHeicOrHeif) {
                                          // Use original, unmodified image
                                          imageResult.data = imageData;

apps/mobile/patches/react-native-keychain+4.0.5.patch

@@ -0,0 +1,169 @@
+diff --git a/node_modules/react-native-keychain/android/build.gradle b/node_modules/react-native-keychain/android/build.gradle
+index bd2fe04..53ce4b1 100755
+--- a/node_modules/react-native-keychain/android/build.gradle
++++ b/node_modules/react-native-keychain/android/build.gradle
+@@ -51,5 +51,4 @@ dependencies {
+     //noinspection GradleDynamicVersion
+     implementation 'com.facebook.react:react-native:+'  // From node_modules
+     implementation 'androidx.annotation:annotation:1.1.0'
+-    implementation 'com.facebook.conceal:conceal:1.1.3@aar'
+ }
+diff --git a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/KeychainModule.java b/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/KeychainModule.java
+index 61d061e..be49f8a 100644
+--- a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/KeychainModule.java
++++ b/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/KeychainModule.java
+@@ -15,7 +15,6 @@ import com.oblador.keychain.PrefsStorage.ResultSet;
+ import com.oblador.keychain.cipherStorage.CipherStorage;
+ import com.oblador.keychain.cipherStorage.CipherStorage.DecryptionResult;
+ import com.oblador.keychain.cipherStorage.CipherStorage.EncryptionResult;
+-import com.oblador.keychain.cipherStorage.CipherStorageFacebookConceal;
+ import com.oblador.keychain.cipherStorage.CipherStorageKeystoreAESCBC;
+ import com.oblador.keychain.exceptions.CryptoFailedException;
+ import com.oblador.keychain.exceptions.EmptyParameterException;
+@@ -48,7 +47,6 @@ public class KeychainModule extends ReactContextBaseJavaModule {
+         super(reactContext);
+         prefsStorage = new PrefsStorage(reactContext);
+ 
+-        addCipherStorageToMap(new CipherStorageFacebookConceal(reactContext));
+         addCipherStorageToMap(new CipherStorageKeystoreAESCBC());
+     }
+ 
+diff --git a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/PrefsStorage.java b/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/PrefsStorage.java
+index 99448b1..792c24c 100644
+--- a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/PrefsStorage.java
++++ b/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/PrefsStorage.java
+@@ -7,7 +7,6 @@ import android.util.Base64;
+ 
+ import com.facebook.react.bridge.ReactApplicationContext;
+ import com.oblador.keychain.cipherStorage.CipherStorage.EncryptionResult;
+-import com.oblador.keychain.cipherStorage.CipherStorageFacebookConceal;
+ 
+ public class PrefsStorage {
+     public static final String KEYCHAIN_DATA = "RN_KEYCHAIN";
+@@ -35,10 +34,6 @@ public class PrefsStorage {
+         byte[] bytesForPassword = getBytesForPassword(service);
+         String cipherStorageName = getCipherStorageName(service);
+         if (bytesForUsername != null && bytesForPassword != null) {
+-            if (cipherStorageName == null) {
+-                // If the CipherStorage name is not found, we assume it is because the entry was written by an older version of this library. The older version used Facebook Conceal, so we default to that.
+-                cipherStorageName = CipherStorageFacebookConceal.CIPHER_STORAGE_NAME;
+-            }
+             return new ResultSet(cipherStorageName, bytesForUsername, bytesForPassword);
+         }
+         return null;
+diff --git a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/cipherStorage/CipherStorageFacebookConceal.java b/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/cipherStorage/CipherStorageFacebookConceal.java
+deleted file mode 100644
+index 3162f99..0000000
+--- a/node_modules/react-native-keychain/android/src/main/java/com/oblador/keychain/cipherStorage/CipherStorageFacebookConceal.java
++++ /dev/null
+@@ -1,110 +0,0 @@
+-package com.oblador.keychain.cipherStorage;
+-
+-import android.os.Build;
+-import androidx.annotation.NonNull;
+-
+-import com.facebook.android.crypto.keychain.AndroidConceal;
+-import com.facebook.android.crypto.keychain.SharedPrefsBackedKeyChain;
+-import com.facebook.crypto.Crypto;
+-import com.facebook.crypto.CryptoConfig;
+-import com.facebook.crypto.Entity;
+-import com.facebook.crypto.keychain.KeyChain;
+-import com.facebook.react.bridge.ReactApplicationContext;
+-import com.oblador.keychain.SecurityLevel;
+-import com.oblador.keychain.exceptions.CryptoFailedException;
+-
+-import java.nio.charset.Charset;
+-
+-public class CipherStorageFacebookConceal implements CipherStorage {
+-    public static final String CIPHER_STORAGE_NAME = "FacebookConceal";
+-    public static final String KEYCHAIN_DATA = "RN_KEYCHAIN";
+-    private final Crypto crypto;
+-
+-    public CipherStorageFacebookConceal(ReactApplicationContext reactContext) {
+-        KeyChain keyChain = new SharedPrefsBackedKeyChain(reactContext, CryptoConfig.KEY_256);
+-        this.crypto = AndroidConceal.get().createDefaultCrypto(keyChain);
+-    }
+-
+-    @Override
+-    public String getCipherStorageName() {
+-        return CIPHER_STORAGE_NAME;
+-    }
+-
+-    @Override
+-    public int getMinSupportedApiLevel() {
+-        return Build.VERSION_CODES.JELLY_BEAN;
+-    }
+-
+-    @Override
+-    public SecurityLevel securityLevel() {
+-        return SecurityLevel.ANY;
+-    }
+-
+-    @Override
+-    public boolean supportsSecureHardware() {
+-        return false;
+-    }
+-
+-    @Override
+-    public EncryptionResult encrypt(@NonNull String service, @NonNull String username, @NonNull String password, SecurityLevel level) throws CryptoFailedException {
+-
+-        if (!this.securityLevel().satisfiesSafetyThreshold(level)) {
+-            throw new CryptoFailedException(String.format("Insufficient security level (wants %s; got %s)", level, this.securityLevel()));
+-        }
+-
+-        if (!crypto.isAvailable()) {
+-            throw new CryptoFailedException("Crypto is missing");
+-        }
+-        Entity usernameEntity = createUsernameEntity(service);
+-        Entity passwordEntity = createPasswordEntity(service);
+-
+-        try {
+-            byte[] encryptedUsername = crypto.encrypt(username.getBytes(Charset.forName("UTF-8")), usernameEntity);
+-            byte[] encryptedPassword = crypto.encrypt(password.getBytes(Charset.forName("UTF-8")), passwordEntity);
+-
+-            return new EncryptionResult(encryptedUsername, encryptedPassword, this);
+-        } catch (Exception e) {
+-            throw new CryptoFailedException("Encryption failed for service " + service, e);
+-        }
+-    }
+-
+-    @Override
+-    public DecryptionResult decrypt(@NonNull String service, @NonNull byte[] username, @NonNull byte[] password) throws CryptoFailedException {
+-        if (!crypto.isAvailable()) {
+-            throw new CryptoFailedException("Crypto is missing");
+-        }
+-        Entity usernameEntity = createUsernameEntity(service);
+-        Entity passwordEntity = createPasswordEntity(service);
+-
+-        try {
+-            byte[] decryptedUsername = crypto.decrypt(username, usernameEntity);
+-            byte[] decryptedPassword = crypto.decrypt(password, passwordEntity);
+-
+-            return new DecryptionResult(
+-                    new String(decryptedUsername, Charset.forName("UTF-8")),
+-                    new String(decryptedPassword, Charset.forName("UTF-8")),
+-                    SecurityLevel.ANY);
+-        } catch (Exception e) {
+-            throw new CryptoFailedException("Decryption failed for service " + service, e);
+-        }
+-    }
+-
+-    @Override
+-    public void removeKey(@NonNull String service) {
+-        // Facebook Conceal stores only one key across all services, so we cannot delete the key (otherwise decryption will fail for encrypted data of other services).
+-    }
+-
+-    private Entity createUsernameEntity(String service) {
+-        String prefix = getEntityPrefix(service);
+-        return Entity.create(prefix + "user");
+-    }
+-
+-    private Entity createPasswordEntity(String service) {
+-        String prefix = getEntityPrefix(service);
+-        return Entity.create(prefix + "pass");
+-    }
+-
+-    private String getEntityPrefix(String service) {
+-        return KEYCHAIN_DATA + ":" + service;
+-    }
+-}

apps/mobile/patches/react-native-mmkv-storage+0.11.2.patch

@@ -1,14 +0,0 @@
-diff --git a/node_modules/react-native-mmkv-storage/android/build.gradle b/node_modules/react-native-mmkv-storage/android/build.gradle
-index abb696e..ba35baa 100644
---- a/node_modules/react-native-mmkv-storage/android/build.gradle
-+++ b/node_modules/react-native-mmkv-storage/android/build.gradle
-@@ -98,7 +98,8 @@ android {
-       cmake {
-         cppFlags "-O3 -frtti -fexceptions -Wall -fstack-protector-all"
-         arguments "-DANDROID_STL=c++_shared",
--                  "-DREACT_NATIVE_MINOR_VERSION=${REACT_NATIVE_MINOR_VERSION}"
-+                  "-DREACT_NATIVE_MINOR_VERSION=${REACT_NATIVE_MINOR_VERSION}",
-+                  "-DANDROID_SUPPORT_FLEXIBLE_PAGE_SIZES=ON"
-         abiFilters (*reactNativeArchitectures())
-       }
-     }

apps/mobile/scripts/optimize-fonts.mjs

@@ -70,6 +70,7 @@ const EXTRA_ICON_NAMES = [
   "chevron-down",
   "calendar",
   "minus-circle-outline",
+  "circle-outline",
   "close-circle-outline",
   "qrcode",
   "text",

apps/mobile/share/fetch-webview.js

@@ -28,7 +28,6 @@ import RNFetchBlob from "react-native-blob-util";
 import WebView from "react-native-webview";
 import { Config } from "./store";
 import { db } from "../app/common/database";
-import { SUBSCRIPTION_STATUS } from "../app/utils/constants";
 
 export const fetchHandle = createRef();
 export const HtmlLoadingWebViewAgent = React.memo(
@@ -40,6 +39,7 @@ export const HtmlLoadingWebViewAgent = React.memo(
     const webview = useRef();
     const premium = useRef(false);
     const corsProxy = Config.corsProxy;
+    const [isLoggedIn, setIsLoggedIn] = useState();
 
     useImperativeHandle(
       fetchHandle,
@@ -72,11 +72,8 @@ export const HtmlLoadingWebViewAgent = React.memo(
     useEffect(() => {
       (async () => {
         const user = await db.user.getUser();
-        const subscriptionStatus =
-          user?.subscription?.type || SUBSCRIPTION_STATUS.BASIC;
-        premium.current =
-          user && subscriptionStatus !== SUBSCRIPTION_STATUS.BASIC;
-
+        setIsLoggedIn(!!user);
+        console.log("USER", !!user);
         const clipperPath =
           Platform.OS === "ios"
             ? RNFetchBlob.fs.dirs.MainBundleDir +
@@ -91,6 +88,7 @@ export const HtmlLoadingWebViewAgent = React.memo(
           .catch((e) => console.log(e));
       })();
     }, []);
+    console.log(isLoggedIn);
 
     return !source || !clipper ? null : (
       <WebView
@@ -103,7 +101,8 @@ export const HtmlLoadingWebViewAgent = React.memo(
           height: 100,
           position: "absolute",
           opacity: 0,
-          zIndex: -1
+          zIndex: -1,
+          pointerEvents: "none"
         }}
         useSharedProcessPool={false}
         pointerEvents="none"
@@ -123,7 +122,11 @@ export const HtmlLoadingWebViewAgent = React.memo(
             console.log("Error handling webview message", e);
           }
         }}
-        injectedJavaScriptBeforeContentLoaded={script(clipper, premium.current)}
+        injectedJavaScriptBeforeContentLoaded={script(
+          clipper,
+          corsProxy,
+          isLoggedIn
+        )}
         onError={() => {
           console.log("Error loading page");
           loadHandler.current?.();
@@ -137,9 +140,11 @@ export const HtmlLoadingWebViewAgent = React.memo(
   () => true
 );
 
-const script = (clipper, pro) => `
+const script = (clipper, corsProxy, loggedIn) => `
+globalThis.module = {};
 ${clipper}
 
+
 function postMessage(type, value) {
   if (window.ReactNativeWebView) {
     window.ReactNativeWebView.postMessage(
@@ -158,10 +163,10 @@ function postMessage(type, value) {
         postMessage("error", globalThis.Clipper.clipPage);
       } else {
         globalThis.Clipper.clipPage(document,false, {
-          images: ${pro},
+          images: ${loggedIn ? "true" : "false"},
           inlineImages: false,
           styles: false,
-          corsProxy: undefined
+          corsProxy: ${corsProxy ? `"${corsProxy}"` : "undefined"}
         }).then(result => {
           postMessage("html", result);
         }).catch(e => {

apps/mobile/share/share.js

@@ -267,7 +267,6 @@ const ShareView = () => {
   );
 
   const onLoad = useCallback(() => {
-    console.log(noteContent.current, "current...");
     eSendEvent(eOnLoadNote + "shareEditor", {
       id: null,
       content: {
@@ -747,7 +746,7 @@ const ShareView = () => {
                   </Paragraph>
                   {rawData.value && isURL(rawData.value) ? (
                     <Button
-                      type={mode === 2 ? "inverted" : "transparent"}
+                      type={mode === 2 ? "inverted" : "plain"}
                       icon={mode === 2 ? "radiobox-marked" : "radiobox-blank"}
                       onPress={() => changeMode(2)}
                       title={modes[2].title}
@@ -758,9 +757,9 @@ const ShareView = () => {
                     />
                   ) : null}
                   <Button
-                    type={mode === 1 ? "inverted" : "transparent"}
+                    type={mode === 1 ? "inverted" : "plain"}
                     icon={mode === 1 ? "radiobox-marked" : "radiobox-blank"}
-                    onPress={() => changeMode(2)}
+                    onPress={() => changeMode(1)}
                     title={modes[1].title}
                     height={30}
                     style={{

apps/mobile/share/store.js

@@ -68,11 +68,10 @@ export const useShareStore = create((set) => ({
     let appendNote = MMKV.getString(StorageKeys.appendNote);
     let selectedNotebooks = MMKV.getString(StorageKeys.selectedNotebooks);
     let selectedTags = MMKV.getString(StorageKeys.selectedTag);
-    appendNote = JSON.parse(appendNote);
     set({
       appendNote: appendNote,
       selectedNotebooks: selectedNotebooks ? JSON.parse(selectedNotebooks) : [],
-      selectedTag: selectedTags ? JSON.parse(selectedTags) : []
+      selectedTags: selectedTags ? JSON.parse(selectedTags) : []
     });
   },
   selectedTags: [],

apps/mobile/tsconfig.json

@@ -15,10 +15,7 @@
       "@notesnook/theme": ["../../packages/theme"],
       "@types/react": ["./node_modules/@types/react"],
       "react": ["./node_modules/react"]
-    },
-    "incremental": true,
-    "maxNodeModuleJsDepth": 5,
-    "downlevelIteration": true
+    }
   },
   "exclude": ["native", "e2e"]
 }

apps/monograph/package-lock.json

@@ -141,7 +141,7 @@
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "dependencies": {
-        "@notesnook-importer/core": "^2.2.2",
+        "@notesnook-importer/core": "^2.2.5",
         "@notesnook/common": "file:../common",
         "@notesnook/intl": "file:../intl",
         "@notesnook/theme": "file:../theme",

apps/theme-builder/package-lock.json

@@ -987,7 +987,7 @@
     },
     "../web": {
       "name": "@notesnook/web",
-      "version": "3.3.1",
+      "version": "3.3.4",
       "hasInstallScript": true,
       "license": "GPL-3.0-or-later",
       "dependencies": {
@@ -1001,7 +1001,7 @@
         "@lingui/react": "5.1.2",
         "@mdi/js": "7.4.47",
         "@mdi/react": "1.6.1",
-        "@notesnook-importer/core": "^2.2.2",
+        "@notesnook-importer/core": "^2.2.5",
         "@notesnook/common": "file:../../packages/common",
         "@notesnook/core": "file:../../packages/core",
         "@notesnook/crypto": "file:../../packages/crypto",

apps/web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@notesnook/web",
   "description": "Your private note taking space",
-  "version": "3.3.1",
+  "version": "3.3.5",
   "private": true,
   "main": "./src/app.js",
   "homepage": "https://notesnook.com/",

apps/web/src/common/db.ts

@@ -53,8 +53,8 @@ async function initializeDatabase(persistence: DatabasePersistence) {
     AUTH_HOST: "https://auth.streetwriters.co",
     SSE_HOST: "https://events.streetwriters.co",
     ISSUES_HOST: "https://issues.streetwriters.co",
-    MONOGRAPH_HOST: "https://monogr.ph",
     SUBSCRIPTIONS_HOST: "https://subscriptions.streetwriters.co",
+    MONOGRAPH_HOST: "https://monogr.ph",
     NOTESNOOK_HOST: "https://notesnook.com",
     ...Config.get("serverUrls", {})
   });

apps/web/src/components/editor/index.tsx

@@ -44,6 +44,7 @@ import {
   useStore as useAppStore,
   store as appstore
 } from "../../stores/app-store";
+import { useStore as useUserStore } from "../../stores/user-store";
 import { useStore as useSearchStore } from "../../stores/search-store";
 import { AppEventManager, AppEvents } from "../../common/app-events";
 import { FlexScrollContainer } from "../scroll-container";
@@ -77,6 +78,7 @@ import { Pane, SplitPane } from "../split-pane";
 import { TITLE_BAR_HEIGHT } from "../title-bar";
 import { isMobile } from "../../hooks/use-mobile";
 import { isTablet } from "../../hooks/use-tablet";
+import { ConfirmDialog } from "../../dialogs/confirm";
 
 const PDFPreview = React.lazy(() => import("../pdf-preview"));
 
@@ -604,6 +606,15 @@ export function Editor(props: EditorProps) {
           }
         }}
         onInsertAttachment={async (type) => {
+          if (!useUserStore.getState().isLoggedIn) {
+            ConfirmDialog.show({
+              title: strings.notLoggedIn(),
+              message: strings.loginToUploadAttachments(),
+              positiveButtonText: strings.okay()
+            });
+            return;
+          }
+
           const mime = type === "file" ? "*/*" : "image/*";
           const attachments = await insertAttachments(mime);
           const editor = useEditorManager.getState().getEditor(id)?.editor;
@@ -704,8 +715,10 @@ function EditorChrome(props: PropsWithChildren<EditorProps>) {
       );
 
       requestAnimationFrame(() => {
-        editor.style.marginLeft = `-${negativeSpace}px`;
-        editor.style.marginRight = `-${negativeSpace}px`;
+        if (!isMobile() && !isTablet()) {
+          editor.style.marginLeft = `-${negativeSpace}px`;
+          editor.style.marginRight = `-${negativeSpace}px`;
+        }
         editor.style.paddingLeft = `${negativeSpace}px`;
         editor.style.paddingRight = `${negativeSpace}px`;
       });

apps/web/src/components/editor/tiptap.tsx

@@ -51,6 +51,7 @@ import {
 import { IEditor, MAX_AUTO_SAVEABLE_WORDS } from "./types";
 import { useEditorConfig, useToolbarConfig, useEditorManager } from "./manager";
 import { useStore as useSettingsStore } from "../../stores/setting-store";
+import { useStore as useUserStore } from "../../stores/user-store";
 import { debounce, useAreFeaturesAvailable } from "@notesnook/common";
 import { ScopedThemeProvider } from "../theme-provider";
 import { useStore as useThemeStore } from "../../stores/theme-store";
@@ -65,6 +66,8 @@ import { EDITOR_ZOOM } from "./common";
 import { ScrollContainer } from "@notesnook/ui";
 import { showFeatureNotAllowedToast } from "../../common/toasts";
 import { UpgradeDialog } from "../../dialogs/buy-dialog/upgrade-dialog";
+import { ConfirmDialog } from "../../dialogs/confirm";
+import { strings } from "@notesnook/intl";
 
 export type OnChangeHandler = (
   content: () => string,
@@ -185,7 +188,6 @@ function TipTap(props: TipTapProps) {
 
   const autoSave = useRef(true);
   const { toolbarConfig } = useToolbarConfig();
-
   const features = useAreFeaturesAvailable([
     "callout",
     "outlineList",
@@ -196,9 +198,19 @@ function TipTap(props: TipTapProps) {
     claims: {
       callout: !!features?.callout?.isAllowed,
       outlineList: !!features?.outlineList?.isAllowed,
-      taskList: !!features?.taskList?.isAllowed
+      taskList: !!features?.taskList?.isAllowed,
+      insertAttachment: !!useUserStore.getState().isLoggedIn
     },
     onPermissionDenied: (claim, silent) => {
+      if (claim === "insertAttachment") {
+        ConfirmDialog.show({
+          title: strings.notLoggedIn(),
+          message: strings.loginToUploadAttachments(),
+          positiveButtonText: strings.okay()
+        });
+        return;
+      }
+
       if (silent) {
         console.log(features, features?.[claim]);
         if (features?.[claim]) showFeatureNotAllowedToast(features[claim]);

apps/web/src/dialogs/feature-dialog.tsx

@@ -93,14 +93,14 @@ const features: Record<FeatureKeys, Feature> = {
         ]
       : [
           {
-            title: "New pricing plans",
+            title: "Notesnook Circle",
             subtitle:
-              "We are changing our pricing to make more sense and be more flexible."
+              "Notesnook Circle brings together trusted partners who share our commitment to privacy, transparency, and user freedom. As a member you get exclusive discounts and offers from our partners. Check it out in Settings > Notesnook Circle."
           },
           {
-            title: "Filters in search",
+            title: "Collapsible headings",
             subtitle:
-              "Search now has some basic filters like content:, title:, tag:, color: etc. For the whole list of filters, read our docs."
+              "You can now collapse and expand headings in your notes. This makes it easier to manage large notes and focus on specific sections."
           }
         ],
     cta: {

apps/web/src/dialogs/settings/components/circle-partners.tsx

@@ -0,0 +1,173 @@
+/*
+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 { useState } from "react";
+import { Copy, Loading } from "../../../components/icons";
+import { Button, Link, Flex, Text, Grid } from "@theme-ui/components";
+import { usePromise } from "@notesnook/common";
+import { db } from "../../../common/db";
+import { writeToClipboard } from "../../../utils/clipboard";
+import { showToast } from "../../../utils/toast";
+import { ErrorText } from "../../../components/error-text";
+import { useStore as useUserStore } from "../../../stores/user-store";
+import { SubscriptionPlan, SubscriptionStatus } from "@notesnook/core";
+import { BuyDialog } from "../../buy-dialog";
+import { strings } from "@notesnook/intl";
+
+export function CirclePartners() {
+  const partners = usePromise(() => db.circle.partners(), []);
+  const [redeemedCode, setRedeemedCode] = useState<{
+    partnerId: string;
+    code: string;
+  }>();
+  const subscription = useUserStore((store) => store.user?.subscription);
+
+  const isFree =
+    !subscription ||
+    subscription?.plan === SubscriptionPlan.FREE ||
+    subscription?.status === SubscriptionStatus.EXPIRED;
+  const isTrial = subscription?.status === SubscriptionStatus.TRIAL;
+  const canRedeem = !isFree && !isTrial;
+
+  return (
+    <>
+      {partners.status === "pending" ? (
+        <Loading sx={{ mt: 2 }} />
+      ) : partners.status === "rejected" ? (
+        <ErrorText error={partners.reason} />
+      ) : (
+        <Grid columns={2} sx={{ mt: 2 }}>
+          {partners.value?.map((partner) => (
+            <Flex
+              key={partner.id}
+              sx={{
+                flexDirection: "column",
+                border: "1px solid var(--border)",
+                borderRadius: "dialog",
+                padding: 2,
+                gap: 1
+              }}
+            >
+              <Flex
+                sx={{ justifyContent: "space-between", alignItems: "center" }}
+              >
+                <Text variant="title">{partner.name}</Text>
+                <img
+                  src={partner.logoBase64}
+                  alt={partner.name}
+                  style={{ width: 30, height: "auto", borderRadius: 8 }}
+                />
+              </Flex>
+              <Text variant="body" sx={{ whiteSpace: "pre-wrap" }}>
+                {partner.shortDescription}
+              </Text>
+              <Text
+                variant="subBody"
+                sx={{
+                  fontStyle: "italic",
+                  color: "accent",
+                  textAlign: "center"
+                }}
+              >
+                {partner.offerDescription}
+              </Text>
+              {redeemedCode?.partnerId === partner.id ? (
+                <>
+                  <Flex
+                    sx={{
+                      bg: "background-secondary",
+                      border: "1px solid var(--border)",
+                      borderRadius: "default",
+                      alignSelf: "center",
+                      alignItems: "center",
+                      gap: 1,
+                      p: "small"
+                    }}
+                  >
+                    <Text
+                      variant="body"
+                      className="selectable"
+                      sx={{
+                        fontFamily: "monospace",
+                        fontSize: 14
+                      }}
+                    >
+                      {redeemedCode.code}
+                    </Text>
+                    <Button
+                      variant="icon"
+                      onClick={() =>
+                        writeToClipboard({ "text/plain": redeemedCode.code })
+                      }
+                    >
+                      <Copy size={12} />
+                    </Button>
+                  </Flex>
+                  {partner.codeRedeemUrl ? (
+                    <Text variant="subBody" sx={{ textAlign: "center" }}>
+                      <Link
+                        target="_blank"
+                        href={partner.codeRedeemUrl.replace(
+                          "{{code}}",
+                          redeemedCode.code
+                        )}
+                      >
+                        Click here
+                      </Link>{" "}
+                      to directly claim the promotion.
+                    </Text>
+                  ) : null}
+                </>
+              ) : (
+                <Button
+                  variant="accent"
+                  sx={{ mt: 1 }}
+                  onClick={async () => {
+                    if (isFree) return BuyDialog.show({});
+                    if (isTrial) {
+                      return showToast(
+                        "error",
+                        strings.trialUserCircleNotice()
+                      );
+                    }
+                    if (!canRedeem) return;
+                    const result = await db.circle
+                      .redeem(partner.id)
+                      .catch((e) => {
+                        showToast("error", e.message);
+                      });
+                    if (result?.code) {
+                      setRedeemedCode({
+                        partnerId: partner.id,
+                        code: result.code
+                      });
+                      showToast("success", "Code redeemed successfully");
+                    }
+                  }}
+                >
+                  {isFree ? strings.upgradeToRedeem() : strings.redeemCode()}
+                </Button>
+              )}
+            </Flex>
+          ))}
+        </Grid>
+      )}
+    </>
+  );
+}

apps/web/src/dialogs/settings/index.tsx

@@ -39,7 +39,8 @@ import {
   Servers,
   ShieldLock,
   Sync,
-  Inbox
+  Inbox,
+  CircleEmpty
 } from "../../components/icons";
 import NavigationItem from "../../components/navigation-menu/navigation-item";
 import { FlexScrollContainer } from "../../components/scroll-container";
@@ -80,6 +81,8 @@ import { strings } from "@notesnook/intl";
 import { mdToHtml } from "../../utils/md";
 import { InboxSettings } from "./inbox-settings";
 import { withFeatureCheck } from "../../common";
+import { NotesnookCircleSettings } from "./notesnook-circle-settings";
+import { hashNavigate } from "../../navigation";
 
 type SettingsDialogProps = BaseDialogProps<false> & {
   activeSection?: SectionKeys;
@@ -109,6 +112,12 @@ const sectionGroups: SectionGroup[] = [
         icon: Sync,
         isHidden: () => !useUserStore.getState().isLoggedIn
       },
+      {
+        key: "circle",
+        title: "Notesnook Circle",
+        icon: CircleEmpty,
+        isHidden: () => !useUserStore.getState().isLoggedIn
+      },
       {
         key: "inbox",
         title: "Inbox",
@@ -185,7 +194,8 @@ const SettingsGroups = [
   ...AboutSettings,
   ...SubscriptionSettings,
   ...ServersSettings,
-  ...InboxSettings
+  ...InboxSettings,
+  ...NotesnookCircleSettings
 ];
 
 // Thoughts:
@@ -262,6 +272,12 @@ function SettingsSideBar(props: SettingsSideBarProps) {
   const [route, setRoute] = useState<SectionKeys>(activeSection || "profile");
   useUserStore((store) => store.isLoggedIn);
 
+  useEffect(() => {
+    hashNavigate(`/settings/${route}`, {
+      notify: false
+    });
+  }, [route, activeSection]);
+
   return (
     <FlexScrollContainer
       id="settings-side-menu"

apps/web/src/dialogs/settings/notesnook-circle-settings.ts

@@ -0,0 +1,43 @@
+/*
+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 { CirclePartners } from "./components/circle-partners";
+import { SettingsGroup } from "./types";
+
+export const NotesnookCircleSettings: SettingsGroup[] = [
+  {
+    header: strings.notesnookCircle(),
+    key: "notesnook-circle",
+    section: "circle",
+    settings: [
+      {
+        key: "partners",
+        title: "",
+        description: strings.notesnookCircleDesc(),
+        components: [
+          {
+            type: "custom",
+            component: CirclePartners
+          }
+        ]
+      }
+    ]
+  }
+];

apps/web/src/dialogs/settings/types.ts

@@ -20,28 +20,32 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { FeatureId } from "@notesnook/common";
 import { Icon } from "../../components/icons";
 
-export type SectionKeys =
-  | "profile"
-  | "auth"
-  | "subscription"
-  | "sync"
-  | "appearance"
-  | "behaviour"
-  | "desktop"
-  | "notifications"
-  | "servers"
-  | "editor"
-  | "backup-export"
-  | "export"
-  | "importer"
-  | "vault"
-  | "app-lock"
-  | "privacy"
-  | "support"
-  | "legal"
-  | "developer"
-  | "about"
-  | "inbox";
+const SectionKeys = [
+  "profile",
+  "auth",
+  "subscription",
+  "sync",
+  "appearance",
+  "behaviour",
+  "desktop",
+  "notifications",
+  "servers",
+  "editor",
+  "backup-export",
+  "export",
+  "importer",
+  "vault",
+  "app-lock",
+  "privacy",
+  "support",
+  "legal",
+  "developer",
+  "about",
+  "inbox",
+  "circle"
+] as const;
+
+export type SectionKeys = (typeof SectionKeys)[number];
 
 export type SectionGroupKeys =
   | "account"
@@ -152,3 +156,7 @@ export type TextInputSettingComponent = BaseSettingComponent<"input"> & {
 export type CustomSettingComponent = BaseSettingComponent<"custom"> & {
   component: () => JSX.Element | null;
 };
+
+export function isSectionKey(key: string): key is SectionKeys {
+  return SectionKeys.includes(key as SectionKeys);
+}

apps/web/src/interfaces/storage.ts

@@ -25,7 +25,12 @@ import {
   IKVStore
 } from "./key-value";
 import { NNCrypto } from "./nncrypto";
-import type { Cipher, SerializedKey } from "@notesnook/crypto";
+import type {
+  AsymmetricCipher,
+  Cipher,
+  SerializedKey,
+  SerializedKeyPair
+} from "@notesnook/crypto";
 import { isFeatureSupported } from "../utils/feature-check";
 import { IKeyStore } from "./key-store";
 import { User } from "@notesnook/core";
@@ -160,6 +165,14 @@ export class NNStorage implements IStorage {
     return NNCrypto.decryptMulti(key, items, "text");
   }
 
+  decryptAsymmetric(
+    keyPair: SerializedKeyPair,
+    cipherData: AsymmetricCipher<"base64">
+  ): Promise<string> {
+    cipherData.format = "base64";
+    return NNCrypto.decryptAsymmetric(keyPair, cipherData, "base64");
+  }
+
   /**
    * @deprecated
    */

apps/web/src/navigation/hash-routes.tsx

@@ -33,6 +33,7 @@ import {
 import { FeatureDialog } from "../dialogs/feature-dialog";
 import { CreateTagDialog } from "../dialogs/item-dialog";
 import { OnboardingDialog } from "../dialogs/onboarding-dialog";
+import { isSectionKey, SectionKeys } from "../dialogs/settings/types";
 
 const hashroutes = defineHashRoutes({
   "/": () => {},
@@ -68,6 +69,11 @@ const hashroutes = defineHashRoutes({
   },
   "/settings": () => {
     SettingsDialog.show({}).then(afterAction);
+  },
+  "/settings/:section": ({ section }) => {
+    SettingsDialog.show(
+      isSectionKey(section) ? { activeSection: section as SectionKeys } : {}
+    ).then(afterAction);
   }
 });
 

apps/web/src/utils/web-extension-server.ts

@@ -73,7 +73,11 @@ export class WebExtensionServer implements Server {
   async saveClip(clip: Clip) {
     let clipContent = "";
 
-    if (clip.mode === "simplified" || clip.mode === "screenshot") {
+    if (
+      clip.mode === "simplified" ||
+      clip.mode === "screenshot" ||
+      clip.mode === "bookmark"
+    ) {
       clipContent += clip.data;
     } else {
       const clippedFile = new File(
@@ -105,11 +109,17 @@ export class WebExtensionServer implements Server {
     if (isCipher(content)) return;
 
     content += clipContent;
-    content += h("div", [
-      h("hr"),
-      h("p", ["Clipped from ", h("a", [clip.title], { href: clip.url })]),
-      h("p", [`Date clipped: ${getFormattedDate(Date.now())}`])
-    ]).innerHTML;
+    content +=
+      clip.mode === "bookmark"
+        ? h("div", [
+            h("p", [`Date bookmarked: ${getFormattedDate(Date.now())}`]),
+            h("hr")
+          ]).innerHTML
+        : h("div", [
+            h("hr"),
+            h("p", ["Clipped from ", h("a", [clip.title], { href: clip.url })]),
+            h("p", [`Date clipped: ${getFormattedDate(Date.now())}`])
+          ]).innerHTML;
 
     const id = await db.notes.add({
       id: note?.id,

docs/help/contents/faqs/login-to-upload-attachments.md

@@ -0,0 +1,8 @@
+---
+title: Login to upload attachments 
+description: We require users to be logged in to upload attachments. 
+---
+
+# Login to upload attachments 
+
+We require users to be logged in to upload attachments. This is because attachments are encrypted using a sub-key derived from your database encryption key. Without a login, we cannot encrypt/upload/sync attachments.

docs/help/contents/keyboard-shortcuts.md

@@ -48,7 +48,7 @@ The following keyboard shortcuts will help you navigate Notesnook faster.
 | Insert date and time with timezone | Ctrl Alt Z | Ctrl Alt Z | ⌘ ⌥ Z |
 | Increase font size | Ctrl [ | Ctrl [ | ⌘ [ |
 | Decrease font size | Ctrl ] | Ctrl ] | ⌘ ] |
-| Insert paragraph | Ctrl ⇧ 0 | Ctrl ⇧ 0 | ⌘ ⇧ 0 |
+| Insert paragraph | Ctrl Alt 0 | Ctrl Alt 0 | ⌘ ⌥ 0 |
 | Insert heading 1 | Ctrl Alt 1 | Ctrl Alt 1 | ⌘ ⌥ 1 |
 | Insert heading 2 | Ctrl Alt 2 | Ctrl Alt 2 | ⌘ ⌥ 2 |
 | Insert heading 3 | Ctrl Alt 3 | Ctrl Alt 3 | ⌘ ⌥ 3 |
@@ -75,4 +75,6 @@ The following keyboard shortcuts will help you navigate Notesnook faster.
 | Text align justify | Ctrl ⇧ J | Ctrl ⇧ J | ⌘ ⇧ J |
 | Text align left | Ctrl ⇧ L | Ctrl ⇧ L | ⌘ ⇧ L |
 | Text align right | Ctrl ⇧ R | Ctrl ⇧ R | ⌘ ⇧ R |
-| Underline | Ctrl U | Ctrl U | ⌘ U |
+| Underline | Ctrl U | Ctrl U | ⌘ U |
+| Toggle highlight | Ctrl Alt H | Ctrl Alt H | ⌘ ⌥ H |
+| Insert comment | Ctrl Alt M | Ctrl Alt M | ⌘ ⌥ M |

docs/help/contents/web-clipper/clipping-your-first-web-page-with-web-clipper.md

@@ -73,6 +73,10 @@ The `Selected nodes` mode allows you to select exactly which nodes you want to c
 
 The clipping mode controls how the final clip should look.
 
+### Bookmark
+
+`Bookmark` mode saves only the URL of the page along with the title. It is best suited to save pages for later reading/reference.
+
 ### Simplified
 
 `Simplified` mode doesn't include any styles. It is best suited for long-form content such as articles & blogs. All clips in `Simplified` mode are saved directly as is i.e. they do not appear as web clip embeds in the Notesnook editor.

docs/help/docgen.yaml

@@ -84,3 +84,4 @@ navigation:
     children:
       - path: faqs/what-are-merge-conflicts.md
       - path: faqs/is-there-an-eta.md
+      - paht: faqs/login-to-upload-attachments.md

extensions/web-clipper/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@notesnook/web-clipper",
-  "version": "0.3.4",
+  "version": "0.4.0",
   "private": true,
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
@@ -105,7 +105,7 @@
     "style-loader": "^3.3.1",
     "terser-webpack-plugin": "^5.3.1",
     "ts-loader": "^9.2.6",
-    "web-ext": "^7.6.2",
+    "web-ext": "^7.12.0",
     "webpack": "5.88.2",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "^4.7.4"

extensions/web-clipper/src/common/bridge.ts

@@ -21,7 +21,7 @@ import { ThemeDefinition } from "@notesnook/theme";
 
 export type ClipArea = "full-page" | "visible" | "selection" | "article";
 
-export type ClipMode = "simplified" | "screenshot" | "complete";
+export type ClipMode = "bookmark" | "simplified" | "screenshot" | "complete";
 
 export type User = {
   email?: string;

extensions/web-clipper/src/components/icons/index.ts

@@ -57,6 +57,7 @@ export const Icons = {
   visible: mdiViewDayOutline,
   selection: mdiCursorDefaultClickOutline,
 
+  bookmark: mdiBookmarkOutline,
   simplified: mdiTextBoxOutline,
   screenshot: mdiFitToScreenOutline,
   complete: mdiViewDashboardOutline,

extensions/web-clipper/src/views/main.tsx

@@ -68,6 +68,11 @@ const clipAreas: { name: string; id: ClipArea; icon: string }[] = [
 
 const clipModes: { name: string; id: ClipMode; icon: string; pro?: boolean }[] =
   [
+    {
+      name: "Bookmark",
+      id: "bookmark",
+      icon: Icons.bookmark
+    },
     {
       name: "Simplified",
       id: "simplified",
@@ -87,6 +92,20 @@ const clipModes: { name: string; id: ClipMode; icon: string; pro?: boolean }[] =
     }
   ];
 
+enum ClipperState {
+  Idle = "idle",
+  Clipping = "clipping",
+  Clipped = "clipped",
+  Error = "error"
+}
+
+const clipperButtonLabelMap: Record<ClipperState, string> = {
+  [ClipperState.Clipping]: "Clipping...",
+  [ClipperState.Clipped]: "Save clip",
+  [ClipperState.Error]: "Retry Clip",
+  [ClipperState.Idle]: "Start clip"
+};
+
 export function Main() {
   const [error, setError] = useState<string>();
   // const [colorMode, setColorMode] = useColorMode();
@@ -98,7 +117,6 @@ export function Main() {
   const [title, setTitle] = useState<string>();
   const [hasPermission, setHasPermission] = useState<boolean>(false);
   const [url, setUrl] = useState<string>();
-  const [clipNonce, setClipNonce] = useState(0);
   const [clipMode, setClipMode] = usePersistentState<ClipMode>(
     "clipMode",
     "simplified"
@@ -107,10 +125,12 @@ export function Main() {
     "clipArea",
     "article"
   );
-  const [isClipping, setIsClipping] = useState(false);
   const [note, setNote] = usePersistentState<ItemReference>("note");
   const [refs, setRefs] = usePersistentState<SelectedReference[]>("refs", []);
   const [clipData, setClipData] = useState<ClipData>();
+  const [clipperState, setClipperState] = useState<ClipperState>(
+    ClipperState.Idle
+  );
   const pageTitle = useRef<string>();
 
   useEffect(() => {
@@ -129,7 +149,6 @@ export function Main() {
 
   useEffect(() => {
     (async () => {
-      if (!clipArea || !clipMode) return;
       if (
         !isPremium &&
         (clipMode === "complete" || clipMode === "screenshot")
@@ -137,25 +156,8 @@ export function Main() {
         setClipMode("simplified");
         return;
       }
-
-      try {
-        setIsClipping(true);
-        setClipData(
-          await clip(clipArea, clipMode, {
-            ...DEFAULT_SETTINGS,
-            ...settings,
-            images: isPremium,
-            inlineImages: isPremium
-          })
-        );
-      } catch (e) {
-        console.error(e);
-        if (e instanceof Error) setError(e.message);
-      } finally {
-        setIsClipping(false);
-      }
     })();
-  }, [isPremium, clipArea, clipMode, clipNonce]);
+  }, [isPremium, clipArea, clipMode]);
 
   useEffect(() => {
     (async () => {
@@ -168,6 +170,32 @@ export function Main() {
     })();
   }, [settings]);
 
+  async function startClip() {
+    if (!clipArea || !clipMode || clipMode === "bookmark") return;
+
+    try {
+      setError(undefined);
+      setClipperState(ClipperState.Clipping);
+      setClipData(
+        await clip(clipArea, clipMode, {
+          ...DEFAULT_SETTINGS,
+          ...settings,
+          images: isPremium,
+          inlineImages: isPremium
+        })
+      );
+      setClipperState(ClipperState.Clipped);
+    } catch (e) {
+      console.error(e);
+      if (e instanceof Error) {
+        setError(e.message);
+      }
+      setClipperState(ClipperState.Error);
+    }
+  }
+
+  const isClipping = clipperState === ClipperState.Clipping;
+
   if (!hasPermission && !!settings?.corsProxy) {
     return (
       <FlexScrollContainer style={{ maxHeight: 560 }}>
@@ -241,10 +269,15 @@ export function Main() {
             key={item.id}
             variant="icon"
             onClick={() => {
+              setError(undefined);
+              setClipperState(ClipperState.Idle);
               setClipArea(item.id);
-              setClipNonce((s) => ++s);
             }}
-            disabled={isClipping}
+            disabled={
+              isClipping ||
+              clipperState === ClipperState.Clipped ||
+              clipMode === "bookmark"
+            }
             sx={{
               display: "flex",
               borderRadius: "default",
@@ -283,10 +316,15 @@ export function Main() {
             key={item.id}
             variant="icon"
             onClick={() => {
+              setError(undefined);
+              setClipperState(ClipperState.Idle);
               setClipMode(item.id);
-              setClipNonce((s) => ++s);
             }}
-            disabled={isClipping || (item.pro && !isPremium)}
+            disabled={
+              isClipping ||
+              clipperState === ClipperState.Clipped ||
+              (item.pro && !isPremium)
+            }
             sx={{
               display: "flex",
               borderRadius: "default",
@@ -313,33 +351,58 @@ export function Main() {
           </Button>
         ))}
 
-        {clipData && clipData.data && !isClipping && (
-          <Text
-            variant="body"
-            sx={{
-              mt: 1,
-              bg: "shade",
-              color: "accent",
-              p: 1,
-              border: "1px solid var(--accent)",
-              borderRadius: "default",
-              cursor: "pointer",
-              ":hover": {
-                filter: "brightness(80%)"
-              }
-            }}
-            onClick={async () => {
-              const winUrl = URL.createObjectURL(
-                new Blob(["\ufeff", clipData.data], { type: "text/html" })
-              );
-              await browser.windows.create({
-                url: winUrl
-              });
-            }}
-          >
-            Clip done. Click here to preview.
-          </Text>
-        )}
+        {clipMode !== "bookmark" &&
+          clipData &&
+          clipData.data &&
+          !isClipping && (
+            <Flex sx={{ gap: 1, justifyContent: "space-between" }}>
+              <Text
+                variant="body"
+                sx={{
+                  flex: 1,
+                  mt: 1,
+                  bg: "shade",
+                  color: "accent",
+                  p: 1,
+                  border: "1px solid var(--accent)",
+                  borderRadius: "default",
+                  cursor: "pointer",
+                  ":hover": {
+                    filter: "brightness(80%)"
+                  }
+                }}
+                onClick={async () => {
+                  const winUrl = URL.createObjectURL(
+                    new Blob(["\ufeff", clipData.data], { type: "text/html" })
+                  );
+                  await browser.windows.create({
+                    url: winUrl
+                  });
+                }}
+              >
+                Clip done. Click here to preview.
+              </Text>
+              <Text
+                variant="body"
+                sx={{
+                  mt: 1,
+                  bg: "background-secondary",
+                  p: 1,
+                  borderRadius: "default",
+                  cursor: "pointer",
+                  ":hover": {
+                    filter: "brightness(80%)"
+                  }
+                }}
+                onClick={async () => {
+                  setClipData(undefined);
+                  setClipperState(ClipperState.Idle);
+                }}
+              >
+                Discard
+              </Text>
+            </Flex>
+          )}
 
         {error && (
           <Text
@@ -357,7 +420,7 @@ export function Main() {
               }
             }}
             onClick={async () => {
-              setClipNonce((s) => ++s);
+              await startClip();
             }}
           >
             {ERROR_MAP[error] || error}
@@ -400,9 +463,27 @@ export function Main() {
         <Button
           variant="accent"
           sx={{ mt: 1 }}
-          disabled={!clipData}
+          disabled={isClipping}
           onClick={async () => {
-            if (!clipData || !title || !clipArea || !clipMode || !url) return;
+            if (
+              clipMode !== "bookmark" &&
+              (clipperState === ClipperState.Idle ||
+                clipperState === ClipperState.Error)
+            ) {
+              await startClip();
+              return;
+            }
+
+            if (!title || !clipArea || !clipMode || !url) return;
+
+            const data =
+              clipMode === "bookmark"
+                ? {
+                    data: createBookmark(url, title)
+                  }
+                : clipData;
+
+            if (!data) return;
 
             const notesnook = await connectApi(false);
             if (!notesnook) {
@@ -417,7 +498,7 @@ export function Main() {
               note,
               refs,
               pageTitle: pageTitle.current,
-              ...clipData
+              ...data
             });
 
             setClipData(undefined);
@@ -433,7 +514,9 @@ export function Main() {
             window.close();
           }}
         >
-          Save clip
+          {clipMode === "bookmark"
+            ? "Save bookmark"
+            : clipperButtonLabelMap[clipperState]}
         </Button>
 
         <Flex
@@ -508,3 +591,11 @@ export async function clip(
     settings
   });
 }
+
+function createBookmark(url: string, title: string) {
+  const a = document.createElement("a");
+  a.setAttribute("href", url);
+  a.setAttribute("title", title);
+  a.innerText = title;
+  return a.outerHTML;
+}

extensions/web-clipper/webpack.config.js

@@ -138,7 +138,8 @@ var options = {
   plugins: [
     new CleanWebpackPlugin({
       verbose: false,
-      dangerouslyAllowCleanPatternsOutsideProject: true
+      dangerouslyAllowCleanPatternsOutsideProject: true,
+      dry: false
     }),
     new webpack.ProgressPlugin(),
     // expose and write the allowed env vars on the compiled bundle

fastlane/metadata/android/en-US/changelogs/15374.txt

@@ -0,0 +1,5 @@
+- Collapsible Headings
+- Notesnook Circle
+- Minor bug fixes and improvements
+
+Thank you for using Notesnook!

fastlane/metadata/android/en-US/changelogs/15379.txt

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

fastlane/metadata/android/en-US/changelogs/15384.txt

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

fastlane/metadata/android/en-US/changelogs/15389.txt

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

fastlane/metadata/android/en-US/changelogs/15394.txt

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

package.json

@@ -104,6 +104,10 @@
           "run-ios",
           "build-ios",
           "build-android",
+          "build-android-debug",
+          "e2e-android-debug",
+          "e2e-android",
+          "e2e-ios",
           "release-android",
           "release-android-bundle",
           "release-ios",