(mobile): fix build errors

.eslintignore

@@ -6,6 +6,7 @@ dist
 
 # mobile
 apps/mobile/native/
+apps/mobile/__tests__/
 
 # web
 apps/web/public/an.js

.eslintrc.js

@@ -67,7 +67,9 @@ module.exports = {
       },
       rules: {
         // TODO: remove this gradually
-        "@typescript-eslint/ban-ts-comment": "off"
+        "@typescript-eslint/ban-ts-comment": "off",
+        "react/react-in-jsx-scope": 2,
+        "react/jsx-uses-react": 2
       }
     }
   ]

apps/mobile/.gitignore

@@ -4,6 +4,8 @@ artifacts/
 #
 .DS_Store
 
+native/android/app/src/main/assets/
+
 *Issues.md
 build_cache/
 #

apps/mobile/app/app.js

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import React, { useEffect } from "react";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { SafeAreaProvider } from "react-native-safe-area-context";
 import { withErrorBoundry } from "./components/exception-handler";

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

@@ -12,7 +12,6 @@ import Storage, { KV } from "./storage";
 const LoggerStorage = new MMKVLoader()
   .withInstanceID("notesnook_logs")
   .initialize();
-console.log(LoggerStorage);
 initalize(new KV(LoggerStorage));
 export const DatabaseLogger = dbLogger;
 

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

@@ -1,15 +1,16 @@
+import NetInfo from "@react-native-community/netinfo";
+import hosts from "@streetwriters/notesnook-core/utils/constants";
+import React from "react";
 import { Platform } from "react-native";
 import * as ScopedStorage from "react-native-scoped-storage";
 import Sodium from "react-native-sodium";
 import RNFetchBlob from "rn-fetch-blob";
 import { ShareComponent } from "../../components/sheets/export-notes/share";
-import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { presentSheet, ToastEvent } from "../../services/event-manager";
+import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { db } from "../database";
 import Storage from "../database/storage";
 import { cacheDir, fileCheck } from "./utils";
-import hosts from "@streetwriters/notesnook-core/utils/constants";
-import NetInfo from "@react-native-community/netinfo";
 
 export async function downloadFile(filename, data, cancelToken) {
   if (!data) return false;

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { FlatList, View } from "react-native";
 import { useSelectionStore } from "../../stores/use-selection-store";
 import { useMessageStore } from "../../stores/use-message-store";

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

@@ -1,3 +1,4 @@
+import React from "react";
 import Paragraph from "../ui/typography/paragraph";
 import { getStyle } from "./functions";
 

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { Linking, View } from "react-native";
 //import SettingsBackupAndRestore from '../../screens/settings/backup-restore';
 import { eSendEvent, presentSheet } from "../../services/event-manager";

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { SIZE } from "../../utils/size";
 import Paragraph from "../ui/typography/paragraph";
 import { getStyle } from "./functions";

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

@@ -1,4 +1,4 @@
-import { Fragment } from "react";
+import React, { Fragment } from "react";
 import { View } from "react-native";
 import { allowedPlatforms } from "../../stores/use-message-store";
 import { ProFeatures } from "../dialogs/result/pro-features";

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

@@ -1,12 +1,12 @@
-import { useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { FlatList, View } from "react-native";
-import { useThemeStore } from "../../stores/use-theme-store";
-import { useMessageStore } from "../../stores/use-message-store";
 import { DDS } from "../../services/device-detection";
 import {
   eSubscribeEvent,
   eUnSubscribeEvent
 } from "../../services/event-manager";
+import { useMessageStore } from "../../stores/use-message-store";
+import { useThemeStore } from "../../stores/use-theme-store";
 import {
   eCloseAnnouncementDialog,
   eOpenAnnouncementDialog

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { View } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
 import Paragraph from "../ui/typography/paragraph";

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { Image } from "react-native";
 import { getStyle } from "./functions";
 

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { SIZE } from "../../utils/size";
 import Heading from "../ui/typography/heading";
 import { getStyle } from "./functions";

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { View } from "react-native";
 import { useMessageStore } from "../../stores/use-message-store";
 import { SIZE } from "../../utils/size";

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

@@ -1,7 +1,10 @@
 import Clipboard from "@react-native-clipboard/clipboard";
-import { useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { View } from "react-native";
 import { ScrollView } from "react-native-gesture-handler";
+import { db } from "../../common/database";
+import filesystem from "../../common/filesystem";
+import { useAttachmentProgress } from "../../hooks/use-attachment-progress";
 import picker from "../../screens/editor/tiptap/picker";
 import {
   eSendEvent,
@@ -12,13 +15,10 @@ import PremiumService from "../../services/premium";
 import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { formatBytes } from "../../utils";
-import { db } from "../../common/database";
 import {
   eCloseAttachmentDialog,
   eCloseProgressDialog
 } from "../../utils/events";
-import filesystem from "../../common/filesystem";
-import { useAttachmentProgress } from "../../hooks/use-attachment-progress";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import { Dialog } from "../dialog";

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

@@ -1,10 +1,11 @@
+import React from "react";
 import { TouchableOpacity, View } from "react-native";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
+import { db } from "../../common/database";
+import { useAttachmentProgress } from "../../hooks/use-attachment-progress";
 import { useAttachmentStore } from "../../stores/use-attachment-store";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { formatBytes } from "../../utils";
-import { db } from "../../common/database";
-import { useAttachmentProgress } from "../../hooks/use-attachment-progress";
 import { SIZE } from "../../utils/size";
 import SheetProvider from "../sheet-provider";
 import { IconButton } from "../ui/icon-button";

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

@@ -1,18 +1,18 @@
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { View } from "react-native";
 import { FlatList } from "react-native-gesture-handler";
 import Icon from "react-native-vector-icons/MaterialCommunityIcons";
+import { db } from "../../common/database";
+import filesystem from "../../common/filesystem";
 import {
   eSubscribeEvent,
   eUnSubscribeEvent
 } from "../../services/event-manager";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { db } from "../../common/database";
 import {
   eCloseAttachmentDialog,
   eOpenAttachmentsDialog
 } from "../../utils/events";
-import filesystem from "../../common/filesystem";
 import { SIZE } from "../../utils/size";
 import DialogHeader from "../dialog/dialog-header";
 import { Toast } from "../toast";

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

@@ -1,4 +1,6 @@
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
+import { Platform, View } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import {
   eSubscribeEvent,
   eUnSubscribeEvent
@@ -13,8 +15,6 @@ import { IconButton } from "../ui/icon-button";
 import { hideAuth, initialAuthMode } from "./common";
 import { Login } from "./login";
 import { Signup } from "./signup";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Platform, View } from "react-native";
 
 export const AuthMode = {
   login: 0,

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

@@ -1,15 +1,15 @@
-import { useRef, useState } from "react";
+import React, { useRef, useState } from "react";
 import { View } from "react-native";
-import { useUserStore } from "../../stores/use-user-store";
+import { db } from "../../common/database";
 import {
   eSendEvent,
   presentSheet,
   ToastEvent
 } from "../../services/event-manager";
-import { db } from "../../common/database";
+import { useUserStore } from "../../stores/use-user-store";
 import { eCloseProgressDialog } from "../../utils/events";
-import { Button } from "../ui/button";
 import DialogHeader from "../dialog/dialog-header";
+import { Button } from "../ui/button";
 import Input from "../ui/input";
 import { Notice } from "../ui/notice";
 import Seperator from "../ui/seperator";

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

@@ -1,11 +1,11 @@
-import { useRef, useState } from "react";
+import React, { useRef, useState } from "react";
 import { View } from "react-native";
 import ActionSheet from "react-native-actions-sheet";
+import { db } from "../../common/database";
 import { DDS } from "../../services/device-detection";
 import { ToastEvent } from "../../services/event-manager";
 import SettingsService from "../../services/settings";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { db } from "../../common/database";
 import DialogHeader from "../dialog/dialog-header";
 import { Button } from "../ui/button";
 import { IconButton } from "../ui/icon-button";

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

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import React, { useState } from "react";
 import { View } from "react-native";
 import { useNavigationFocus } from "../../hooks/use-navigation-focus";
 import { Toast } from "../toast";

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

@@ -1,14 +1,15 @@
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { View } from "react-native";
 import { SheetManager } from "react-native-actions-sheet";
+import Animated, { FadeInDown, FadeOutUp } from "react-native-reanimated";
+import { db } from "../../common/database";
 import { DDS } from "../../services/device-detection";
 import { eSendEvent, ToastEvent } from "../../services/event-manager";
 import { clearMessage } from "../../services/message";
 import PremiumService from "../../services/premium";
 import SettingsService from "../../services/settings";
-import { useUserStore } from "../../stores/use-user-store";
 import { useThemeStore } from "../../stores/use-theme-store";
-import { db } from "../../common/database";
+import { useUserStore } from "../../stores/use-user-store";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
 import BaseDialog from "../dialog/base-dialog";
@@ -20,10 +21,9 @@ import { SvgView } from "../ui/svg";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
 import { SVG } from "./background";
+import { hideAuth } from "./common";
 import { ForgotPassword } from "./forgot-password";
 import TwoFactorVerification from "./two-factor";
-import Animated, { FadeInDown, FadeOutUp } from "react-native-reanimated";
-import { hideAuth } from "./common";
 export const Login = ({ changeMode }) => {
   const colors = useThemeStore((state) => state.colors);
   const email = useRef();

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

@@ -1,7 +1,6 @@
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { Modal, View } from "react-native";
-import { useThemeStore } from "../../stores/use-theme-store";
-import { useUserStore } from "../../stores/use-user-store";
+import { db } from "../../common/database";
 import BiometricService from "../../services/biometrics";
 import {
   eSendEvent,
@@ -11,22 +10,23 @@ import {
 } from "../../services/event-manager";
 import { clearMessage } from "../../services/message";
 import PremiumService from "../../services/premium";
+import SettingsService from "../../services/settings";
 import Sync from "../../services/sync";
-import { db } from "../../common/database";
+import { useThemeStore } from "../../stores/use-theme-store";
+import { useUserStore } from "../../stores/use-user-store";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";
-import { IconButton } from "../ui/icon-button";
-import { Button } from "../ui/button";
 import { Dialog } from "../dialog";
 import { presentDialog } from "../dialog/functions";
-import Input from "../ui/input";
+import SheetProvider from "../sheet-provider";
+import { Progress } from "../sheets/progress";
 import { Toast } from "../toast";
+import { Button } from "../ui/button";
+import { IconButton } from "../ui/icon-button";
+import Input from "../ui/input";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
-import SettingsService from "../../services/settings";
 import TwoFactorVerification from "./two-factor";
-import SheetProvider from "../sheet-provider";
-import { Progress } from "../sheets/progress";
 
 function getEmail(email) {
   if (!email) return null;

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

@@ -1,14 +1,14 @@
-import { useRef, useState } from "react";
+import React, { useRef, useState } from "react";
 import { Dimensions, View } from "react-native";
 import Animated, { FadeInDown, FadeOutUp } from "react-native-reanimated";
+import umami from "../../common/analytics";
+import { db } from "../../common/database";
 import { DDS } from "../../services/device-detection";
 import { ToastEvent } from "../../services/event-manager";
 import { clearMessage, setEmailVerifyMessage } from "../../services/message";
 import PremiumService from "../../services/premium";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { useUserStore } from "../../stores/use-user-store";
-import umami from "../../common/analytics";
-import { db } from "../../common/database";
 import { openLinkInBrowser } from "../../utils/functions";
 import { SIZE } from "../../utils/size";
 import { sleep } from "../../utils/time";

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

@@ -1,9 +1,14 @@
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { View } from "react-native";
-import { eSendEvent, presentSheet } from "../../services/event-manager";
+import { db } from "../../common/database/index";
+import useTimer from "../../hooks/use-timer";
+import {
+  eSendEvent,
+  presentSheet,
+  ToastEvent
+} from "../../services/event-manager";
 import { useThemeStore } from "../../stores/use-theme-store";
 import { eCloseProgressDialog } from "../../utils/events";
-import useTimer from "../../hooks/use-timer";
 import { SIZE } from "../../utils/size";
 import { Button } from "../ui/button";
 import { IconButton } from "../ui/icon-button";
@@ -12,8 +17,6 @@ import { PressableButton } from "../ui/pressable";
 import Seperator from "../ui/seperator";
 import Heading from "../ui/typography/heading";
 import Paragraph from "../ui/typography/paragraph";
-import { db } from "../../common/database/index";
-import { ToastEvent } from "../../services/event-manager";
 
 const TwoFactorVerification = ({ onMfaLogin, mfaInfo }) => {
   const colors = useThemeStore((state) => state.colors);

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

@@ -1,6 +1,7 @@
+import React from "react";
 import { View } from "react-native";
-import { useThemeStore } from "../../stores/use-theme-store";
 import { useSelectionStore } from "../../stores/use-selection-store";
+import { useThemeStore } from "../../stores/use-theme-store";
 
 export const ContainerHeader = ({ children }) => {
   const colors = useThemeStore((state) => state.colors);

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

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import React, { useEffect } from "react";
 import { Keyboard, Platform, View } from "react-native";
 import Animated, {
   Easing,

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

@@ -1,6 +1,7 @@
+import React from "react";
 import { KeyboardAvoidingView, Platform, SafeAreaView } from "react-native";
-import { useSettingStore } from "../../stores/use-setting-store";
 import useIsFloatingKeyboard from "../../hooks/use-is-floating-keyboard";
+import { useSettingStore } from "../../stores/use-setting-store";
 import { Header } from "../header";
 import SelectionHeader from "../selection-header";
 export const Container = ({ children }) => {

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { View } from "react-native";
 import { useMessageStore } from "../../stores/use-message-store";
 import { useThemeStore } from "../../stores/use-theme-store";

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

@@ -1,7 +1,8 @@
+import React from "react";
 import { ViewProps } from "react-native";
 import Animated, { FadeOutUp } from "react-native-reanimated";
-import { useThemeStore } from "../../stores/use-theme-store";
 import { useDelayLayout } from "../../hooks/use-delay-layout";
+import { useThemeStore } from "../../stores/use-theme-store";
 import { DefaultPlaceholder } from "./default-placeholder";
 import { SettingsPlaceholder } from "./settings-placeholder";