Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-23 23:19:40 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
ammarahm-ed
2022-04-24 05:59:14 +05:00
parent 094dac3427
commit 496f550a19
217 changed files with 4694 additions and 4179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
apps/mobile/App.js
View File

@@ -1,38 +1,42 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { SafeAreaProvider } from 'react-native-safe-area-context'; import { SafeAreaProvider } from 'react-native-safe-area-context';
import Launcher from './src/components/launcher'; import Launcher from './src/components/launcher';
import { ApplicationHolder } from './src/navigation'; import { ApplicationHolder } from './src/navigation';
import Notifications from './src/services/notifications'; import Notifications from './src/services/notifications';
import SettingsService from './src/services/settings'; import SettingsService from './src/services/settings';
import { TipManager } from './src/services/tip-manager'; import { TipManager } from './src/services/tip-manager';
import { useUserStore } from './src/stores/stores'; import { useUserStore } from './src/stores/use-user-store';
import { useAppEvents } from './src/utils/hooks/use-app-events'; import { useAppEvents } from './src/utils/hooks/use-app-events';
SettingsService.init();
SettingsService.checkOrientation(); SettingsService.checkOrientation();
const App = () => { const App = () => {
useAppEvents(); useAppEvents();
useEffect(() => { useEffect(() => {
(async () => { let { appLockMode } = SettingsService.get();
try { if (appLockMode && appLockMode !== 'none') {
SettingsService.init(); useUserStore.getState().setVerifyUser(true);
}
let appLockMode = SettingsService.get().appLockMode; setTimeout(() => {
if (appLockMode && appLockMode !== 'none') { console.log('run later');
useUserStore.getState().setVerifyUser(true); SettingsService.onFirstLaunch();
} Notifications.get();
TipManager.init(); TipManager.init();
Notifications.get(); }, 100);
await SettingsService.onFirstLaunch();
} catch (e) {}
})();
}, []); }, []);
return ( return (
<SafeAreaProvider> <GestureHandlerRootView
<ApplicationHolder /> style={{
<Launcher /> flex: 1
</SafeAreaProvider> }}
>
<SafeAreaProvider>
<ApplicationHolder />
<Launcher />
</SafeAreaProvider>
</GestureHandlerRootView>
); );
}; };

2
apps/mobile/index.js
View File

@@ -1,3 +1,4 @@
/* eslint-disable @typescript-eslint/no-var-requires */
import React from 'react'; import React from 'react';
import { AppRegistry, LogBox, Platform, UIManager } from 'react-native'; import { AppRegistry, LogBox, Platform, UIManager } from 'react-native';
import Config from 'react-native-config'; import Config from 'react-native-config';
@@ -7,6 +8,7 @@ import { SafeAreaProvider } from 'react-native-safe-area-context';
import { enableScreens } from 'react-native-screens'; import { enableScreens } from 'react-native-screens';
import { name as appName } from './app.json'; import { name as appName } from './app.json';
import Notifications from './src/services/notifications'; import Notifications from './src/services/notifications';
global.Buffer = require('buffer').Buffer; global.Buffer = require('buffer').Buffer;
enableLayoutAnimations(true); enableLayoutAnimations(true);

5
apps/mobile/src/components/announcements/announcement.js
View File

@@ -1,7 +1,8 @@
import React from 'react'; import React from 'react';
import { FlatList, View } from 'react-native'; import { FlatList, View } from 'react-native';
import { useMessageStore, useSelectionStore } from '../../stores/stores'; import { useSelectionStore } from '../../stores/use-selection-store';
import { useThemeStore } from '../../stores/theme'; import { useMessageStore } from '../../stores/use-message-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { allowedOnPlatform, renderItem } from './functions'; import { allowedOnPlatform, renderItem } from './functions';
export const Announcement = ({ color }) => { export const Announcement = ({ color }) => {

2
apps/mobile/src/components/announcements/body.js
View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
import { getStyle } from './functions'; import { getStyle } from './functions';

2
apps/mobile/src/components/announcements/cta.js
View File

@@ -2,7 +2,7 @@ import React from 'react';
import { Linking, View } from 'react-native'; import { Linking, View } from 'react-native';
import SettingsBackupAndRestore from '../../screens/settings/backup-restore'; import SettingsBackupAndRestore from '../../screens/settings/backup-restore';
import { eSendEvent, presentSheet } from '../../services/event-manager'; import { eSendEvent, presentSheet } from '../../services/event-manager';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eCloseAnnouncementDialog } from '../../utils/events'; import { eCloseAnnouncementDialog } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { sleep } from '../../utils/time'; import { sleep } from '../../utils/time';

2
apps/mobile/src/components/announcements/description.js
View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
import { getStyle } from './functions'; import { getStyle } from './functions';

2
apps/mobile/src/components/announcements/functions.js
View File

@@ -1,6 +1,6 @@
import React, { Fragment } from 'react'; import React, { Fragment } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { allowedPlatforms } from '../../stores/stores'; import { allowedPlatforms } from '../../stores';
import { ProFeatures } from '../dialogs/result/pro-features'; import { ProFeatures } from '../dialogs/result/pro-features';
import { Body } from './body'; import { Body } from './body';
import { Cta } from './cta'; import { Cta } from './cta';

4
apps/mobile/src/components/announcements/index.js
View File

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

2
apps/mobile/src/components/announcements/list.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
import { getStyle } from './functions'; import { getStyle } from './functions';

2
apps/mobile/src/components/announcements/subheading.js
View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';
import { getStyle } from './functions'; import { getStyle } from './functions';

2
apps/mobile/src/components/announcements/title.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useMessageStore } from '../../stores/stores'; import { useMessageStore } from '../../stores/use-message-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';

4
apps/mobile/src/components/attachments/actions.js
View File

@@ -5,8 +5,8 @@ import { ScrollView } from 'react-native-gesture-handler';
import picker from '../../screens/editor/tiny/toolbar/picker'; import picker from '../../screens/editor/tiny/toolbar/picker';
import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager'; import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import { useAttachmentStore } from '../../stores/stores'; import { useAttachmentStore } from '../../stores/use-attachment-store';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { formatBytes } from '../../utils'; import { formatBytes } from '../../utils';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eCloseAttachmentDialog, eCloseProgressDialog } from '../../utils/events'; import { eCloseAttachmentDialog, eCloseProgressDialog } from '../../utils/events';

4
apps/mobile/src/components/attachments/attachmentitem.js
View File

@@ -2,8 +2,8 @@ import React from 'react';
import { TouchableOpacity, View } from 'react-native'; import { TouchableOpacity, View } from 'react-native';
import * as Progress from 'react-native-progress'; import * as Progress from 'react-native-progress';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useAttachmentStore } from '../../stores/stores'; import { useAttachmentStore } from '../../stores/use-attachment-store';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { formatBytes } from '../../utils'; import { formatBytes } from '../../utils';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { useAttachmentProgress } from '../../utils/hooks/use-attachment-progress'; import { useAttachmentProgress } from '../../utils/hooks/use-attachment-progress';

2
apps/mobile/src/components/attachments/index.js
View File

@@ -3,7 +3,7 @@ import { View } from 'react-native';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eCloseAttachmentDialog, eOpenAttachmentsDialog } from '../../utils/events'; import { eCloseAttachmentDialog, eOpenAttachmentsDialog } from '../../utils/events';
import filesystem from '../../utils/filesystem'; import filesystem from '../../utils/filesystem';

4
apps/mobile/src/components/auth/changepassword.js
View File

@@ -1,7 +1,7 @@
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager'; import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eCloseProgressDialog } from '../../utils/events'; import { eCloseProgressDialog } from '../../utils/events';

2
apps/mobile/src/components/auth/forgotpassword.js
View File

@@ -4,7 +4,7 @@ import ActionSheet from 'react-native-actions-sheet';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { ToastEvent } from '../../services/event-manager'; import { ToastEvent } from '../../services/event-manager';
import SettingsService from '../../services/settings'; import SettingsService from '../../services/settings';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import DialogHeader from '../dialog/dialog-header'; import DialogHeader from '../dialog/dialog-header';
import { Button } from '../ui/button'; import { Button } from '../ui/button';

28
apps/mobile/src/components/auth/index.js
View File

@@ -1,10 +1,13 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { useThemeStore } from '../../stores/theme'; import { Platform } from 'react-native';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { useThemeStore } from '../../stores/use-theme-store';
import { eCloseLoginDialog, eOpenLoginDialog } from '../../utils/events'; import { eCloseLoginDialog, eOpenLoginDialog } from '../../utils/events';
import { sleep } from '../../utils/time'; import { sleep } from '../../utils/time';
import BaseDialog from '../dialog/base-dialog'; import BaseDialog from '../dialog/base-dialog';
import { Toast } from '../toast'; import { Toast } from '../toast';
import { IconButton } from '../ui/icon-button';
import { Login } from './login'; import { Login } from './login';
import { Signup } from './signup'; import { Signup } from './signup';
@@ -20,6 +23,7 @@ const Auth = () => {
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [currentAuthMode, setCurrentAuthMode] = useState(AuthMode.login); const [currentAuthMode, setCurrentAuthMode] = useState(AuthMode.login);
const actionSheetRef = useRef(); const actionSheetRef = useRef();
const insets = useSafeAreaInsets();
useEffect(() => { useEffect(() => {
eSubscribeEvent(eOpenLoginDialog, open); eSubscribeEvent(eOpenLoginDialog, open);
@@ -55,8 +59,6 @@ const Auth = () => {
background={colors.bg} background={colors.bg}
transparent={false} transparent={false}
> >
<Toast context="local" />
{currentAuthMode !== AuthMode.login ? ( {currentAuthMode !== AuthMode.login ? (
<Signup <Signup
changeMode={mode => setCurrentAuthMode(mode)} changeMode={mode => setCurrentAuthMode(mode)}
@@ -66,6 +68,24 @@ const Auth = () => {
) : ( ) : (
<Login changeMode={mode => setCurrentAuthMode(mode)} /> <Login changeMode={mode => setCurrentAuthMode(mode)} />
)} )}
{currentAuthMode === AuthMode.welcomeSignup ? null : (
<IconButton
name="arrow-left"
onPress={() => {
eSendEvent(eCloseLoginDialog);
}}
color={colors.pri}
customStyle={{
position: 'absolute',
zIndex: 999,
left: 12,
top: Platform.OS === 'ios' ? 12 + insets.top : 12
}}
/>
)}
<Toast context="local" />
</BaseDialog> </BaseDialog>
); );
}; };

230
apps/mobile/src/components/auth/login.js
View File

@@ -3,18 +3,19 @@ import { Platform, View } from 'react-native';
import { SheetManager } from 'react-native-actions-sheet'; import { SheetManager } from 'react-native-actions-sheet';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager'; import { eSendEvent, ToastEvent } from '../../services/event-manager';
import { clearMessage } from '../../services/message'; import { clearMessage } from '../../services/message';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import SettingsService from '../../services/settings'; import SettingsService from '../../services/settings';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eCloseLoginDialog } from '../../utils/events'; import { eCloseLoginDialog } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { sleep } from '../../utils/time'; import { sleep } from '../../utils/time';
import BaseDialog from '../dialog/base-dialog'; import BaseDialog from '../dialog/base-dialog';
import SheetProvider from '../sheet-provider'; import SheetProvider from '../sheet-provider';
import { Progress } from '../sheets/progress';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { IconButton } from '../ui/icon-button'; import { IconButton } from '../ui/icon-button';
import Input from '../ui/input'; import Input from '../ui/input';
@@ -25,7 +26,6 @@ import Paragraph from '../ui/typography/paragraph';
import { SVG } from './background'; import { SVG } from './background';
import { ForgotPassword } from './forgot-password'; import { ForgotPassword } from './forgot-password';
import TwoFactorVerification from './two-factor'; import TwoFactorVerification from './two-factor';
import { Progress } from '../sheets/progress';
export const Login = ({ changeMode }) => { export const Login = ({ changeMode }) => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const email = useRef(); const email = useRef();
@@ -130,20 +130,6 @@ export const Login = ({ changeMode }) => {
return ( return (
<> <>
<IconButton
name="arrow-left"
onPress={() => {
eSendEvent(eCloseLoginDialog);
}}
color={colors.pri}
customStyle={{
position: 'absolute',
zIndex: 999,
left: 12,
top: Platform.OS === 'ios' ? 12 + insets.top : 12
}}
/>
<ForgotPassword /> <ForgotPassword />
<SheetProvider context="two_factor_verify" /> <SheetProvider context="two_factor_verify" />
@@ -167,123 +153,121 @@ export const Login = ({ changeMode }) => {
<SvgView src={SVG(colors.night ? colors.icon : 'black')} height={700} /> <SvgView src={SVG(colors.night ? colors.icon : 'black')} height={700} />
</BouncingView> </BouncingView>
</View> </View>
<BouncingView initialScale={0.98} duration={3000}> <View
<View style={{
width: '100%',
justifyContent: 'center',
alignSelf: 'center',
paddingHorizontal: 12,
marginBottom: 30,
marginTop: 15
}}
>
<Heading
style={{ style={{
width: '100%', textAlign: 'center'
justifyContent: 'center',
alignSelf: 'center',
paddingHorizontal: 12,
marginBottom: 30,
marginTop: 15
}} }}
size={30}
color={colors.heading}
> >
<Heading Welcome back!
style={{ </Heading>
textAlign: 'center' <Paragraph
}}
size={30}
color={colors.heading}
>
Welcome back!
</Heading>
<Paragraph
style={{
textDecorationLine: 'underline',
textAlign: 'center',
marginTop: 5
}}
onPress={() => {
changeMode(1);
}}
size={SIZE.md}
>
Don't have an account? Sign up
</Paragraph>
</View>
<View
style={{ style={{
width: focused ? '100%' : '99.9%', textDecorationLine: 'underline',
padding: 12, textAlign: 'center',
backgroundColor: colors.bg, marginTop: 5
flexGrow: 1
}} }}
onPress={() => {
changeMode(1);
}}
size={SIZE.md}
> >
<Input Don't have an account? Sign up
fwdRef={emailInputRef} </Paragraph>
onChangeText={value => { </View>
email.current = value; <View
}} style={{
testID="input.email" width: focused ? '100%' : '99.9%',
onErrorCheck={e => setError(e)} padding: 12,
returnKeyLabel="Next" backgroundColor: colors.bg,
returnKeyType="next" flexGrow: 1
autoComplete="email" }}
validationType="email" >
autoCorrect={false} <Input
autoCapitalize="none" fwdRef={emailInputRef}
errorMessage="Email is invalid" onChangeText={value => {
placeholder="Email" email.current = value;
onSubmit={() => { }}
passwordInputRef.current?.focus(); testID="input.email"
}} onErrorCheck={e => setError(e)}
/> returnKeyLabel="Next"
returnKeyType="next"
autoComplete="email"
validationType="email"
autoCorrect={false}
autoCapitalize="none"
errorMessage="Email is invalid"
placeholder="Email"
onSubmit={() => {
passwordInputRef.current?.focus();
}}
/>
<Input <Input
fwdRef={passwordInputRef} fwdRef={passwordInputRef}
onChangeText={value => { onChangeText={value => {
password.current = value; password.current = value;
}} }}
testID="input.password" testID="input.password"
returnKeyLabel="Done" returnKeyLabel="Done"
returnKeyType="done" returnKeyType="done"
secureTextEntry secureTextEntry
autoComplete="password" autoComplete="password"
autoCapitalize="none" autoCapitalize="none"
autoCorrect={false} autoCorrect={false}
placeholder="Password" placeholder="Password"
marginBottom={0} marginBottom={0}
onSubmit={() => login()} onSubmit={() => login()}
/> />
<Button
title="Forgot your password?"
style={{
alignSelf: 'flex-end',
height: 30,
paddingHorizontal: 0
}}
onPress={() => {
SheetManager.show('forgotpassword_sheet', email.current);
}}
textStyle={{
textDecorationLine: 'underline'
}}
fontSize={SIZE.xs}
type="gray"
/>
<View
style={{
// position: 'absolute',
marginTop: 50,
alignSelf: 'center'
}}
>
<Button <Button
title="Forgot your password?"
style={{ style={{
alignSelf: 'flex-end', marginTop: 10,
height: 30, width: 250,
paddingHorizontal: 0 borderRadius: 100
}} }}
onPress={() => { loading={loading}
SheetManager.show('forgotpassword_sheet', email.current); onPress={() => login()}
}} // width="100%"
textStyle={{ type="accent"
textDecorationLine: 'underline' title={loading ? null : 'Login to your account'}
}}
fontSize={SIZE.xs}
type="gray"
/> />
<View
style={{
// position: 'absolute',
marginTop: 50,
alignSelf: 'center'
}}
>
<Button
style={{
marginTop: 10,
width: 250,
borderRadius: 100
}}
loading={loading}
onPress={() => login()}
// width="100%"
type="accent"
title={loading ? null : 'Login to your account'}
/>
</View>
</View> </View>
</BouncingView> </View>
</View> </View>
</> </>
); );

4
apps/mobile/src/components/auth/sessionexpired.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { Modal, View } from 'react-native'; import { Modal, View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import BiometricService from '../../services/biometrics'; import BiometricService from '../../services/biometrics';
import { import {
eSendEvent, eSendEvent,

318
apps/mobile/src/components/auth/signup.js
View File

@@ -1,21 +1,21 @@
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { Dimensions, Platform, View } from 'react-native'; import { Dimensions, Platform, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useThemeStore } from '../../stores/theme';
import { useUserStore } from '../../stores/stores';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent, ToastEvent } from '../../services/event-manager'; import { eSendEvent, ToastEvent } from '../../services/event-manager';
import { clearMessage, setEmailVerifyMessage } from '../../services/message'; import { clearMessage, setEmailVerifyMessage } from '../../services/message';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import { useUserStore } from '../../stores/use-user-store';
import { useThemeStore } from '../../stores/use-theme-store';
import umami from '../../utils/analytics';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eCloseLoginDialog } from '../../utils/events'; import { eCloseLoginDialog } from '../../utils/events';
import { openLinkInBrowser } from '../../utils/functions'; import { openLinkInBrowser } from '../../utils/functions';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { sleep } from '../../utils/time'; import { sleep } from '../../utils/time';
import umami from '../../utils/analytics';
import { IconButton } from '../ui/icon-button';
import { Button } from '../ui/button';
import BaseDialog from '../dialog/base-dialog'; import BaseDialog from '../dialog/base-dialog';
import { Button } from '../ui/button';
import { IconButton } from '../ui/icon-button';
import Input from '../ui/input'; import Input from '../ui/input';
import { SvgView } from '../ui/svg'; import { SvgView } from '../ui/svg';
import { BouncingView } from '../ui/transitions/bouncing-view'; import { BouncingView } from '../ui/transitions/bouncing-view';
@@ -85,22 +85,6 @@ export const Signup = ({ changeMode, welcome, trial }) => {
return ( return (
<> <>
{!welcome && (
<IconButton
name="arrow-left"
onPress={() => {
eSendEvent(eCloseLoginDialog);
}}
color={colors.pri}
customStyle={{
position: 'absolute',
zIndex: 999,
left: 12,
top: Platform.OS === 'ios' ? 12 + insets.top : 12
}}
/>
)}
{loading ? <BaseDialog transparent={true} visible={true} animation="fade" /> : null} {loading ? <BaseDialog transparent={true} visible={true} animation="fade" /> : null}
<View <View
style={{ style={{
@@ -117,179 +101,177 @@ export const Signup = ({ changeMode, welcome, trial }) => {
overflow: 'hidden' overflow: 'hidden'
}} }}
> >
<BouncingView initialScale={1.05} duration={5000}> <BouncingView initialScale={1.05}>
<SvgView src={SVG(colors.night ? colors.icon : 'black')} height={700} /> <SvgView src={SVG(colors.night ? colors.icon : 'black')} height={700} />
</BouncingView> </BouncingView>
</View> </View>
<BouncingView initialScale={0.98} duration={5000}> <View
<View style={{
width: '100%',
justifyContent: 'center',
alignSelf: 'center',
paddingHorizontal: 12,
marginBottom: 30,
marginTop: Dimensions.get('window').height < 700 ? -75 : 15
}}
>
<Heading
style={{ style={{
width: '100%', textAlign: 'center'
justifyContent: 'center',
alignSelf: 'center',
paddingHorizontal: 12,
marginBottom: 30,
marginTop: Dimensions.get('window').height < 700 ? -75 : 15
}} }}
size={30}
color={colors.heading}
> >
<Heading Create your account
style={{ </Heading>
textAlign: 'center' <Paragraph
}} style={{
size={30} textDecorationLine: 'underline',
color={colors.heading} textAlign: 'center'
> }}
Create your account onPress={() => {
</Heading> changeMode(0);
}}
size={SIZE.md}
>
Already have an account? Log in
</Paragraph>
</View>
<View
style={{
width: '100%',
padding: 12,
backgroundColor: colors.bg,
flexGrow: 1
}}
>
<Input
fwdRef={emailInputRef}
onChangeText={value => {
email.current = value;
}}
testID="input.email"
onErrorCheck={e => setError(e)}
returnKeyLabel="Next"
returnKeyType="next"
autoComplete="email"
validationType="email"
autoCorrect={false}
autoCapitalize="none"
errorMessage="Email is invalid"
placeholder="Email"
onSubmit={() => {
passwordInputRef.current?.focus();
}}
/>
<Input
fwdRef={passwordInputRef}
onChangeText={value => {
password.current = value;
}}
testID="input.password"
onErrorCheck={e => setError(e)}
returnKeyLabel="Next"
returnKeyType="next"
secureTextEntry
autoComplete="password"
autoCapitalize="none"
validationType="password"
autoCorrect={false}
placeholder="Password"
onSubmit={() => {
confirmPasswordInputRef.current?.focus();
}}
/>
<Input
fwdRef={confirmPasswordInputRef}
onChangeText={value => {
confirmPassword.current = value;
}}
testID="input.confirmPassword"
onErrorCheck={e => setError(e)}
returnKeyLabel="Signup"
returnKeyType="done"
secureTextEntry
autoComplete="password"
autoCapitalize="none"
autoCorrect={false}
validationType="confirmPassword"
customValidator={() => password.current}
placeholder="Confirm password"
marginBottom={5}
onSubmit={signup}
/>
<Paragraph size={SIZE.xs} color={colors.icon}>
By signing up, you agree to our{' '}
<Paragraph <Paragraph
style={{ size={SIZE.xs}
textDecorationLine: 'underline',
textAlign: 'center'
}}
onPress={() => { onPress={() => {
changeMode(0); openLinkInBrowser('https://notesnook.com/tos', colors)
.catch(e => {})
.then(r => {});
}} }}
size={SIZE.md} style={{
textDecorationLine: 'underline'
}}
color={colors.accent}
> >
Already have an account? Log in terms of service{' '}
</Paragraph> </Paragraph>
</View> and{' '}
<Paragraph
size={SIZE.xs}
onPress={() => {
openLinkInBrowser('https://notesnook.com/privacy', colors)
.catch(e => {})
.then(r => {});
}}
style={{
textDecorationLine: 'underline'
}}
color={colors.accent}
>
privacy policy.
</Paragraph>
</Paragraph>
<View <View
style={{ style={{
width: '100%', marginTop: 50,
padding: 12, alignSelf: 'center'
backgroundColor: colors.bg,
flexGrow: 1
}} }}
> >
<Input <Button
fwdRef={emailInputRef}
onChangeText={value => {
email.current = value;
}}
testID="input.email"
onErrorCheck={e => setError(e)}
returnKeyLabel="Next"
returnKeyType="next"
autoComplete="email"
validationType="email"
autoCorrect={false}
autoCapitalize="none"
errorMessage="Email is invalid"
placeholder="Email"
onSubmit={() => {
passwordInputRef.current?.focus();
}}
/>
<Input
fwdRef={passwordInputRef}
onChangeText={value => {
password.current = value;
}}
testID="input.password"
onErrorCheck={e => setError(e)}
returnKeyLabel="Next"
returnKeyType="next"
secureTextEntry
autoComplete="password"
autoCapitalize="none"
validationType="password"
autoCorrect={false}
placeholder="Password"
onSubmit={() => {
confirmPasswordInputRef.current?.focus();
}}
/>
<Input
fwdRef={confirmPasswordInputRef}
onChangeText={value => {
confirmPassword.current = value;
}}
testID="input.confirmPassword"
onErrorCheck={e => setError(e)}
returnKeyLabel="Signup"
returnKeyType="done"
secureTextEntry
autoComplete="password"
autoCapitalize="none"
autoCorrect={false}
validationType="confirmPassword"
customValidator={() => password.current}
placeholder="Confirm password"
marginBottom={5}
onSubmit={signup}
/>
<Paragraph size={SIZE.xs} color={colors.icon}>
By signing up, you agree to our{' '}
<Paragraph
size={SIZE.xs}
onPress={() => {
openLinkInBrowser('https://notesnook.com/tos', colors)
.catch(e => {})
.then(r => {});
}}
style={{
textDecorationLine: 'underline'
}}
color={colors.accent}
>
terms of service{' '}
</Paragraph>
and{' '}
<Paragraph
size={SIZE.xs}
onPress={() => {
openLinkInBrowser('https://notesnook.com/privacy', colors)
.catch(e => {})
.then(r => {});
}}
style={{
textDecorationLine: 'underline'
}}
color={colors.accent}
>
privacy policy.
</Paragraph>
</Paragraph>
<View
style={{ style={{
marginTop: 50, marginTop: 10,
alignSelf: 'center' width: 250,
borderRadius: 100
}} }}
> loading={loading}
onPress={signup}
type="accent"
title={loading ? null : 'Agree and continue'}
/>
{loading || !welcome ? null : (
<Button <Button
style={{ style={{
marginTop: 10, marginTop: 10,
width: 250, width: 250,
borderRadius: 100 borderRadius: 100
}} }}
loading={loading} onPress={() => {
onPress={signup} eSendEvent(eCloseLoginDialog);
type="accent" }}
title={loading ? null : 'Agree and continue'} type="grayBg"
title="Skip for now"
/> />
)}
{loading || !welcome ? null : (
<Button
style={{
marginTop: 10,
width: 250,
borderRadius: 100
}}
onPress={() => {
eSendEvent(eCloseLoginDialog);
}}
type="grayBg"
title="Skip for now"
/>
)}
</View>
</View> </View>
</BouncingView> </View>
</View> </View>
</> </>
); );

2
apps/mobile/src/components/auth/twofactor.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { eSendEvent, presentSheet } from '../../services/event-manager'; import { eSendEvent, presentSheet } from '../../services/event-manager';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eCloseProgressDialog } from '../../utils/events'; import { eCloseProgressDialog } from '../../utils/events';
import useTimer from '../../utils/hooks/use-timer'; import useTimer from '../../utils/hooks/use-timer';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

4
apps/mobile/src/components/container/containerheader.js
View File

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

6
apps/mobile/src/components/container/floatingbutton.js
View File

@@ -9,12 +9,12 @@ import Animated, {
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { notesnook } from '../../../e2e/test.ids'; import { notesnook } from '../../../e2e/test.ids';
import { useSelectionStore, useSettingStore } from '../../stores/stores'; import { useSelectionStore } from '../../stores/use-selection-store';
import { useSettingStore } from '../../stores/use-setting-store';
import { editing, getElevation, showTooltip, TOOLTIP_POSITIONS } from '../../utils'; import { editing, getElevation, showTooltip, TOOLTIP_POSITIONS } from '../../utils';
import { normalize, SIZE } from '../../utils/size'; import { normalize, SIZE } from '../../utils/size';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';
const translateY = new Animated.Value(0);
export const FloatingButton = ({ title, onPress, color = 'accent', shouldShow = false }) => { export const FloatingButton = ({ title, onPress, color = 'accent', shouldShow = false }) => {
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
@@ -77,7 +77,7 @@ export const FloatingButton = ({ title, onPress, color = 'accent', shouldShow =
? Platform.isPad ? Platform.isPad
? insets.bottom - 12 ? insets.bottom - 12
: insets.bottom - 24 : insets.bottom - 24
: insets.bottom + 12, : insets.bottom,
zIndex: 10 zIndex: 10
}, },
animatedStyle animatedStyle

14
apps/mobile/src/components/container/index.js
View File

@@ -1,24 +1,24 @@
import React from 'react'; import React from 'react';
import { KeyboardAvoidingView, Platform, SafeAreaView } from 'react-native'; import { KeyboardAvoidingView, Platform, SafeAreaView } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import useIsFloatingKeyboard from '../../utils/hooks/use-is-floating-keyboard'; import useIsFloatingKeyboard from '../../utils/hooks/use-is-floating-keyboard';
import { Header } from '../header';
import SelectionHeader from '../selection-header';
export const Container = ({ children }) => { export const Container = ({ children }) => {
const colors = useThemeStore(state => state.colors);
const floating = useIsFloatingKeyboard(); const floating = useIsFloatingKeyboard();
return ( return (
<KeyboardAvoidingView <KeyboardAvoidingView
behavior="padding" behavior="padding"
enabled={Platform.OS === 'ios' && !floating} enabled={Platform.OS === 'ios' && !floating}
style={{ style={{
backgroundColor: colors.bg, flex: 1
width: '100%',
height: '100%'
}} }}
> >
<SelectionHeader />
<Header title="Header" screen="Header" />
<SafeAreaView <SafeAreaView
style={{ style={{
height: '100%', flex: 1,
backgroundColor: colors.bg,
overflow: 'hidden' overflow: 'hidden'
}} }}
> >

2
apps/mobile/src/components/dialog/BaseDialog.js
View File

@@ -8,7 +8,7 @@ import {
TouchableOpacity, TouchableOpacity,
View View
} from 'react-native'; } from 'react-native';
import { useSettingStore } from '../../stores/stores'; import { useSettingStore } from '../../stores/use-setting-store';
import useIsFloatingKeyboard from '../../utils/hooks/use-is-floating-keyboard'; import useIsFloatingKeyboard from '../../utils/hooks/use-is-floating-keyboard';
import { BouncingView } from '../ui/transitions/bouncing-view'; import { BouncingView } from '../ui/transitions/bouncing-view';

2
apps/mobile/src/components/dialog/DialogButtons.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { ActivityIndicator, StyleSheet, View } from 'react-native'; import { ActivityIndicator, StyleSheet, View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';

2
apps/mobile/src/components/dialog/DialogContainer.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { getElevation } from '../../utils'; import { getElevation } from '../../utils';

2
apps/mobile/src/components/dialog/DialogHeader.tsx
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { Text } from 'react-native'; import { Text } from 'react-native';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { PressableButtonProps } from '../ui/pressable'; import { PressableButtonProps } from '../ui/pressable';

2
apps/mobile/src/components/dialog/index.js
View File

@@ -1,6 +1,6 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { getElevation } from '../../utils'; import { getElevation } from '../../utils';

2
apps/mobile/src/components/dialogprovider/index.js
View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { EditorSettings } from '../../screens/editor/EditorSettings'; import { EditorSettings } from '../../screens/editor/EditorSettings';
import { AddNotebookSheet } from '../sheets/add-notebook'; import { AddNotebookSheet } from '../sheets/add-notebook';
import { AddTopicDialog } from '../dialogs/add-topic'; import { AddTopicDialog } from '../dialogs/add-topic';

8
apps/mobile/src/components/dialogs/addtopic/index.js
View File

@@ -1,7 +1,7 @@
import React, { createRef } from 'react'; import React, { createRef } from 'react';
import { Keyboard, LayoutAnimation, UIManager, View } from 'react-native'; import { Keyboard, LayoutAnimation, UIManager, View } from 'react-native';
import { Transition, Transitioning, TransitioningView } from 'react-native-reanimated'; import { Transition, Transitioning, TransitioningView } from 'react-native-reanimated';
import { useMenuStore } from '../../../stores/stores'; import { useMenuStore } from '../../../stores/use-menu-store';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
@@ -54,11 +54,7 @@ export class AddTopicDialog extends React.Component {
} }
this.setState({ loading: false }); this.setState({ loading: false });
this.close(); this.close();
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate('Notebooks', 'Notebook', 'TopicNotes');
Navigation.routeNames.Notebooks,
Navigation.routeNames.Notebook,
Navigation.routeNames.NotesPage
]);
useMenuStore.getState().setMenuPins(); useMenuStore.getState().setMenuPins();
} catch (e) {} } catch (e) {}
}; };

4
apps/mobile/src/components/dialogs/jumptosection/index.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { ScrollView, View } from 'react-native'; import { ScrollView, View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useMessageStore } from '../../../stores/stores'; import { useMessageStore } from '../../../stores/use-message-store';
import { DDS } from '../../../services/device-detection'; import { DDS } from '../../../services/device-detection';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager';
import { getElevation } from '../../../utils'; import { getElevation } from '../../../utils';

2
apps/mobile/src/components/dialogs/result/ProFeatures.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { eSendEvent } from '../../../services/event-manager'; import { eSendEvent } from '../../../services/event-manager';
import { import {
eCloseProgressDialog, eCloseProgressDialog,

2
apps/mobile/src/components/dialogs/result/index.js
View File

@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { DDS } from '../../../services/device-detection'; import { DDS } from '../../../services/device-detection';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager';
import { getElevation } from '../../../utils'; import { getElevation } from '../../../utils';

20
apps/mobile/src/components/dialogs/vault/index.js
View File

@@ -187,17 +187,15 @@ export class VaultDialog extends Component {
}); });
return; return;
} }
Navigation.setRoutesToUpdate([
Navigation.routeNames.NotesPage, Navigation.queueRoutesForUpdate(
Navigation.routeNames.Favorites, 'Notes',
Navigation.routeNames.Notes 'Favorites',
]); 'TopicNotes',
Navigation.setRoutesToUpdate([ 'TaggedNotes',
Navigation.routeNames.Notes, 'ColoredNotes'
Navigation.routeNames.Favorites, );
Navigation.routeNames.NotesPage,
Navigation.routeNames.Notebook
]);
this.password = null; this.password = null;
this.confirmPassword = null; this.confirmPassword = null;
SearchService.updateAndSearch(); SearchService.updateAndSearch();

25
apps/mobile/src/components/header/index.js
View File

@@ -2,23 +2,24 @@ import React, { useEffect, useState } from 'react';
import { Platform, StyleSheet, View } from 'react-native'; import { Platform, StyleSheet, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eScrollEvent } from '../../utils/events'; import { eScrollEvent } from '../../utils/events';
import { LeftMenus } from './left-menus'; import { LeftMenus } from './left-menus';
import { RightMenus } from './right-menus'; import { RightMenus } from './right-menus';
import { Title } from './title'; import { Title } from './title';
export const Header = React.memo( export const Header = React.memo(
({ root, title, screen, isBack, color, action, rightButtons, notebook, onBackPress }) => { () => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
const [hide, setHide] = useState(true); const [hide, setHide] = useState(true);
const onScroll = data => { const onScroll = data => {
if (data.screen !== screen) return;
if (data.y > 150) { if (data.y > 150) {
if (!hide) return;
setHide(false); setHide(false);
} else { } else {
if (hide) return;
setHide(true); setHide(true);
} }
}; };
@@ -28,7 +29,7 @@ export const Header = React.memo(
return () => { return () => {
eUnSubscribeEvent(eScrollEvent, onScroll); eUnSubscribeEvent(eScrollEvent, onScroll);
}; };
}, []); }, [hide]);
return ( return (
<View <View
@@ -45,22 +46,14 @@ export const Header = React.memo(
]} ]}
> >
<View style={styles.leftBtnContainer}> <View style={styles.leftBtnContainer}>
<LeftMenus onBackPress={onBackPress} headerMenuState={!isBack} currentScreen={screen} /> <LeftMenus />
<Title />
<Title
notebook={notebook}
headerColor={color}
heading={title}
screen={screen}
root={root}
/>
</View> </View>
<RightMenus />
<RightMenus rightButtons={rightButtons} action={action} currentScreen={screen} />
</View> </View>
); );
}, },
(prev, next) => prev.title === next.title () => true
); );
const styles = StyleSheet.create({ const styles = StyleSheet.create({

66
apps/mobile/src/components/header/leftmenus.js
View File

@@ -1,52 +1,50 @@
import React from 'react'; import React from 'react';
import { notesnook } from '../../../e2e/test.ids'; import { notesnook } from '../../../e2e/test.ids';
import { useThemeStore } from '../../stores/theme';
import { useSettingStore } from '../../stores/stores';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import useNavigationStore from '../../stores/use-navigation-store';
import { useSettingStore } from '../../stores/use-setting-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { IconButton } from '../ui/icon-button'; import { IconButton } from '../ui/icon-button';
export const LeftMenus = ({ currentScreen, headerMenuState, onBackPress }) => { export const LeftMenus = () => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
const canGoBack = useNavigationStore(state => state.canGoBack);
const isTablet = deviceMode === 'tablet';
const onLeftButtonPress = () => { const onLeftButtonPress = () => {
if (onBackPress) return onBackPress(); if (!canGoBack) {
if (headerMenuState) {
Navigation.openDrawer(); Navigation.openDrawer();
return; return;
} }
Navigation.goBack(); Navigation.goBack();
}; };
return ( return isTablet ? null : (
<> <IconButton
{deviceMode !== 'tablet' || currentScreen === 'Search' || !headerMenuState ? ( testID={notesnook.ids.default.header.buttons.left}
<IconButton customStyle={{
testID={notesnook.ids.default.header.buttons.left} justifyContent: 'center',
customStyle={{ alignItems: 'center',
justifyContent: 'center', height: 40,
alignItems: 'center', width: 40,
height: 40, borderRadius: 100,
width: 40, marginLeft: -5,
borderRadius: 100, marginRight: DDS.isLargeTablet() ? 10 : 25
marginLeft: -5, }}
marginRight: DDS.isLargeTablet() ? 10 : 25 left={40}
}} top={40}
left={40} right={DDS.isLargeTablet() ? 10 : 25}
top={40} onPress={onLeftButtonPress}
right={DDS.isLargeTablet() ? 10 : 25} onLongPress={() => {
onPress={onLeftButtonPress} Navigation.popToTop();
onLongPress={() => { }}
Navigation.popToTop(); name={canGoBack ? 'arrow-left' : 'menu'}
}} color={colors.pri}
name={!headerMenuState ? 'arrow-left' : 'menu'} iconStyle={{
color={colors.pri} marginLeft: canGoBack ? -5 : 0
iconStyle={{ }}
marginLeft: !headerMenuState ? -5 : 0 />
}}
/>
) : undefined}
</>
); );
}; };

25
apps/mobile/src/components/header/rightmenus.js
View File

@@ -2,24 +2,30 @@ import React, { useRef } from 'react';
import { StyleSheet, View } from 'react-native'; import { StyleSheet, View } from 'react-native';
import Menu from 'react-native-reanimated-material-menu'; import Menu from 'react-native-reanimated-material-menu';
import { notesnook } from '../../../e2e/test.ids'; import { notesnook } from '../../../e2e/test.ids';
import { useThemeStore } from '../../stores/theme';
import { useSettingStore } from '../../stores/stores';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import SearchService from '../../services/search';
import useNavigationStore from '../../stores/use-navigation-store';
import { useSettingStore } from '../../stores/use-setting-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { IconButton } from '../ui/icon-button'; import { IconButton } from '../ui/icon-button';
export const RightMenus = ({ currentScreen, action, rightButtons }) => { export const RightMenus = () => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
const rightButtons = useNavigationStore(state => state.headerRightButtons);
const currentScreen = useNavigationStore(state => state.currentScreen.name);
const menuRef = useRef(); const menuRef = useRef();
return ( return (
<View style={styles.rightBtnContainer}> <View style={styles.rightBtnContainer}>
{!currentScreen.startsWith('Settings') ? ( {!currentScreen.startsWith('Settings') ? (
<IconButton <IconButton
onPress={async () => { onPress={async () => {
Navigation.navigate('Search', { SearchService.prepareSearch();
menu: false Navigation.navigate({
name: 'Search'
}); });
}} }}
testID="icon-search" testID="icon-search"
@@ -31,7 +37,7 @@ export const RightMenus = ({ currentScreen, action, rightButtons }) => {
{deviceMode !== 'mobile' ? ( {deviceMode !== 'mobile' ? (
<Button <Button
onPress={action} onPress={RightMenus.floatingButtonAction}
testID={notesnook.ids.default.addBtn} testID={notesnook.ids.default.addBtn}
icon={currentScreen === 'Trash' ? 'delete' : 'plus'} icon={currentScreen === 'Trash' ? 'delete' : 'plus'}
iconSize={SIZE.xl} iconSize={SIZE.xl}
@@ -54,7 +60,7 @@ export const RightMenus = ({ currentScreen, action, rightButtons }) => {
/> />
) : null} ) : null}
{rightButtons ? ( {rightButtons && rightButtons.length > 0 ? (
<Menu <Menu
ref={menuRef} ref={menuRef}
animationDuration={200} animationDuration={200}
@@ -67,7 +73,6 @@ export const RightMenus = ({ currentScreen, action, rightButtons }) => {
onPress={() => { onPress={() => {
menuRef.current?.show(); menuRef.current?.show();
}} }}
//testID={notesnook.ids.default.header.buttons.left}
name="dots-vertical" name="dots-vertical"
color={colors.pri} color={colors.pri}
customStyle={styles.rightBtn} customStyle={styles.rightBtn}
@@ -87,7 +92,7 @@ export const RightMenus = ({ currentScreen, action, rightButtons }) => {
}} }}
key={item.title} key={item.title}
title={item.title} title={item.title}
onPress={item.func} onPress={item.onPress}
/> />
))} ))}
</Menu> </Menu>
@@ -96,6 +101,8 @@ export const RightMenus = ({ currentScreen, action, rightButtons }) => {
); );
}; };
RightMenus.floatingButtonAction = () => {};
const styles = StyleSheet.create({ const styles = StyleSheet.create({
rightBtnContainer: { rightBtnContainer: {
flexDirection: 'row', flexDirection: 'row',

85
apps/mobile/src/components/header/title.js
View File

@@ -1,51 +1,76 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import Animated, { Layout } from 'react-native-reanimated';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { eOnNewTopicAdded, eScrollEvent } from '../../utils/events'; import useNavigationStore from '../../stores/use-navigation-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { db } from '../../utils/database';
import { eScrollEvent } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
export const Title = ({ heading, headerColor, screen, notebook }) => { const titleState = {};
export const Title = () => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const [hide, setHide] = useState(screen === 'Notebook' ? true : false); const currentScreen = useNavigationStore(state => state.currentScreen);
const isTopic = currentScreen.type === 'topic';
const [hide, setHide] = useState(isTopic ? true : false);
const isHidden = titleState[currentScreen.id];
const notebook = isTopic ? db.notebooks?.notebook(currentScreen.notebookId)?.data : null;
const title = currentScreen.title;
const isTag = title.slice(0, 1) === '#';
const onScroll = data => { const onScroll = data => {
if (screen !== 'Notebook') { if (currentScreen.name !== 'Notebook') {
setHide(false); setHide(false);
return; return;
} }
if (data.y > 150) { if (data.y > 150) {
if (!hide) return;
setHide(false); setHide(false);
} else { } else {
if (hide) return;
setHide(true); setHide(true);
} }
}; };
useEffect(() => {
if (currentScreen.name === 'Notebook') {
let value =
typeof titleState[currentScreen.id] === 'boolean' ? titleState[currentScreen.id] : true;
setHide(value);
} else {
setHide(titleState[currentScreen.id]);
}
}, [currentScreen.id]);
useEffect(() => {
titleState[currentScreen.id] = hide;
}, [hide]);
useEffect(() => { useEffect(() => {
eSubscribeEvent(eScrollEvent, onScroll); eSubscribeEvent(eScrollEvent, onScroll);
return () => { return () => {
eUnSubscribeEvent(eScrollEvent, onScroll); eUnSubscribeEvent(eScrollEvent, onScroll);
}; };
}, []); }, [hide]);
function navigateToNotebook() { function navigateToNotebook() {
if (!notebook) return; if (!isTopic) return;
let routeName = 'Notebook'; Navigation.navigate(
let params = { {
menu: false, name: 'Notebook',
notebook: notebook, id: isTopic.id,
title: notebook.title type: isTopic.type
}; },
let headerState = { {
heading: notebook.title, notebook: isTopic,
id: notebook.id, title: isTopic.title
type: notebook.type }
}; );
eSendEvent(eOnNewTopicAdded, params);
Navigation.navigate(routeName, params, headerState);
} }
return ( return (
@@ -56,24 +81,28 @@ export const Title = ({ heading, headerColor, screen, notebook }) => {
flexDirection: 'row' flexDirection: 'row'
}} }}
> >
{!hide ? ( {!hide && !isHidden ? (
<Heading <Heading
onPress={navigateToNotebook} onPress={navigateToNotebook}
numberOfLines={notebook ? 2 : 1} numberOfLines={isTopic ? 2 : 1}
size={notebook ? SIZE.md + 2 : SIZE.xl} size={isTopic ? SIZE.md + 2 : SIZE.xl}
style={{ style={{
flexWrap: 'wrap' flexWrap: 'wrap'
}} }}
color={headerColor} color={currentScreen.color}
> >
{notebook ? ( {isTopic ? (
<Paragraph numberOfLines={1} size={SIZE.xs + 1}> <Paragraph numberOfLines={1} size={SIZE.xs + 1}>
{notebook?.title} {notebook?.title}
{'\n'} {'\n'}
</Paragraph> </Paragraph>
) : null} ) : null}
<Heading color={colors.accent}>{heading.slice(0, 1) === '#' ? '#' : null}</Heading> {isTag ? (
{heading.slice(0, 1) === '#' ? heading.slice(1) : heading} <Heading size={isTopic ? SIZE.md + 2 : SIZE.xl} color={colors.accent}>
#
</Heading>
) : null}
{isTag ? title.slice(1) : title}
</Heading> </Heading>
) : null} ) : null}
</View> </View>

4
apps/mobile/src/components/intro/index.js
View File

@@ -5,8 +5,8 @@ import { SafeAreaView } from 'react-native-safe-area-context';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import AppLock from '../../screens/settings/app-lock'; import AppLock from '../../screens/settings/app-lock';
import SettingsService from '../../services/settings'; import SettingsService from '../../services/settings';
import { useSettingStore } from '../../stores/stores'; import { useSettingStore } from '../../stores/use-setting-store';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { getElevation } from '../../utils'; import { getElevation } from '../../utils';
import umami from '../../utils/analytics'; import umami from '../../utils/analytics';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

2
apps/mobile/src/components/intro/welcome.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import umami from '../../utils/analytics'; import umami from '../../utils/analytics';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import { getElevation } from '../../utils'; import { getElevation } from '../../utils';
import { eCloseProgressDialog, eOpenLoginDialog } from '../../utils/events'; import { eCloseProgressDialog, eOpenLoginDialog } from '../../utils/events';

47
apps/mobile/src/components/launcher/index.js
View File

@@ -9,15 +9,13 @@ import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manag
import { setRateAppMessage } from '../../services/message'; import { setRateAppMessage } from '../../services/message';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import SettingsService from '../../services/settings'; import SettingsService from '../../services/settings';
import { import { initialize } from '../../stores';
initialize, import { useUserStore } from '../../stores/use-user-store';
useFavoriteStore, import { useMessageStore } from '../../stores/use-message-store';
useMessageStore, import { useSettingStore } from '../../stores/use-setting-store';
useNoteStore, import { useFavoriteStore } from '../../stores/use-favorite-store';
useSettingStore, import { useNoteStore } from '../../stores/use-notes-store';
useUserStore import { useThemeStore } from '../../stores/use-theme-store';
} from '../../stores/stores';
import { useThemeStore } from '../../stores/theme';
import { editing } from '../../utils'; import { editing } from '../../utils';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { MMKV } from '../../utils/database/mmkv'; import { MMKV } from '../../utils/database/mmkv';
@@ -52,9 +50,10 @@ const Launcher = React.memo(
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
const passwordInputRef = useRef(); const passwordInputRef = useRef();
const password = useRef(); const password = useRef();
const introCompleted = SettingsService.get().introCompleted;
const [requireIntro, setRequireIntro] = useState({ const [requireIntro, setRequireIntro] = useState({
updated: false, updated: introCompleted,
value: false value: !introCompleted
}); });
const dbInitCompleted = useRef(false); const dbInitCompleted = useRef(false);
@@ -63,18 +62,20 @@ const Launcher = React.memo(
return; return;
} }
await restoreEditorState(); await restoreEditorState();
await db.notes.init(); setImmediate(() => {
setNotes(); db.notes.init().then(() => {
setFavorites(); setNotes();
setLoading(false); setFavorites();
Walkthrough.init(); setLoading(false);
Walkthrough.init();
});
});
}; };
const init = async () => { const init = async () => {
if (!dbInitCompleted.current) { if (!dbInitCompleted.current) {
await db.init(); await db.init();
initialize(); initialize();
useUserStore.getState().setUser(await db.user.getUser());
dbInitCompleted.current = true; dbInitCompleted.current = true;
} }
@@ -84,7 +85,7 @@ const Launcher = React.memo(
}; };
const hideSplashScreen = async () => { const hideSplashScreen = async () => {
await sleep(requireIntro.value ? 500 : 0); if (requireIntro.value) await sleep(500);
await RNBootSplash.hide({ fade: true }); await RNBootSplash.hide({ fade: true });
setTimeout(async () => { setTimeout(async () => {
if (Platform.OS === 'android') { if (Platform.OS === 'android') {
@@ -100,22 +101,22 @@ const Launcher = React.memo(
} else { } else {
StatusBar.setBarStyle(colors.night ? 'light-content' : 'dark-content'); StatusBar.setBarStyle(colors.night ? 'light-content' : 'dark-content');
} }
}, 500); }, 1000);
}; };
useEffect(() => { useEffect(() => {
console.log('hide splash', requireIntro.updated);
if (requireIntro.updated) { if (requireIntro.updated) {
hideSplashScreen(); hideSplashScreen();
return;
} }
}, [requireIntro, verifyUser]);
useEffect(() => {
let introCompleted = SettingsService.get().introCompleted; let introCompleted = SettingsService.get().introCompleted;
console.log(requireIntro);
setRequireIntro({ setRequireIntro({
updated: true, updated: true,
value: !introCompleted value: !introCompleted
}); });
}, []); }, [requireIntro, verifyUser]);
useEffect(() => { useEffect(() => {
if (!loading) { if (!loading) {

5
apps/mobile/src/components/list/card.js
View File

@@ -2,8 +2,9 @@ import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Animated, { FadeInUp, FadeOutUp } from 'react-native-reanimated'; import Animated, { FadeInUp, FadeOutUp } from 'react-native-reanimated';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useMessageStore, useSelectionStore } from '../../stores/stores'; import { useSelectionStore } from '../../stores/use-selection-store';
import { useThemeStore } from '../../stores/theme'; import { useMessageStore } from '../../stores/use-message-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { hexToRGBA } from '../../utils/color-scheme/utils'; import { hexToRGBA } from '../../utils/color-scheme/utils';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';

4
apps/mobile/src/components/list/empty.js
View File

@@ -1,8 +1,8 @@
import React from 'react'; import React from 'react';
import { ActivityIndicator, useWindowDimensions, View } from 'react-native'; import { ActivityIndicator, useWindowDimensions, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useSettingStore } from '../../stores/stores'; import { useSettingStore } from '../../stores/use-setting-store';
import { useTip } from '../../services/tip-manager'; import { useTip } from '../../services/tip-manager';
import { COLORS_NOTE } from '../../utils/color-scheme'; import { COLORS_NOTE } from '../../utils/color-scheme';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

14
apps/mobile/src/components/list/index.js
View File

@@ -3,8 +3,7 @@ import { FlatList, RefreshControl, View } from 'react-native';
import { notesnook } from '../../../e2e/test.ids'; import { notesnook } from '../../../e2e/test.ids';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import Sync from '../../services/sync'; import Sync from '../../services/sync';
import { useUserStore } from '../../stores/stores'; import { useThemeStore } from '../../stores/use-theme-store';
import { useThemeStore } from '../../stores/theme';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eScrollEvent } from '../../utils/events'; import { eScrollEvent } from '../../utils/events';
import { tabBarRef } from '../../utils/global-refs'; import { tabBarRef } from '../../utils/global-refs';
@@ -56,7 +55,8 @@ const List = ({
placeholderData, placeholderData,
loading, loading,
headerProps = { headerProps = {
heading: 'Home' heading: 'Home',
color: null
}, },
screen, screen,
ListHeader, ListHeader,
@@ -65,11 +65,11 @@ const List = ({
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const scrollRef = useRef(); const scrollRef = useRef();
const [_loading, _setLoading] = useState(true); const [_loading, _setLoading] = useState(true);
const syncing = useUserStore(state => state.syncing);
useEffect(() => { useEffect(() => {
let timeout = null; let timeout = null;
if (!loading) { if (!loading) {
console.log('LOADING ENDED');
timeout = setTimeout( timeout = setTimeout(
() => { () => {
_setLoading(false); _setLoading(false);
@@ -77,6 +77,7 @@ const List = ({
listData.length === 0 ? 0 : 300 listData.length === 0 ? 0 : 300
); );
} else { } else {
console.log('STILL LOADING');
_setLoading(true); _setLoading(true);
} }
return () => { return () => {
@@ -149,7 +150,7 @@ const List = ({
colors={[colors.accent]} colors={[colors.accent]}
progressBackgroundColor={colors.nav} progressBackgroundColor={colors.nav}
onRefresh={_onRefresh} onRefresh={_onRefresh}
refreshing={syncing} refreshing={false}
/> />
} }
ListEmptyComponent={ ListEmptyComponent={
@@ -169,9 +170,6 @@ const List = ({
) : ( ) : (
<Header <Header
title={headerProps.heading} title={headerProps.heading}
paragraph={headerProps.paragraph}
onPress={headerProps.onPress}
icon={headerProps.icon}
color={headerProps.color} color={headerProps.color}
type={type} type={type}
screen={screen} screen={screen}

4
apps/mobile/src/components/listitems/headers/header.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useMessageStore } from '../../../stores/stores'; import { useMessageStore } from '../../../stores/use-message-store';
import { COLORS_NOTE } from '../../../utils/color-scheme'; import { COLORS_NOTE } from '../../../utils/color-scheme';
import { Announcement } from '../../announcements/announcement'; import { Announcement } from '../../announcements/announcement';
import { Card } from '../../list/card'; import { Card } from '../../list/card';

4
apps/mobile/src/components/listitems/headers/notebookheader.js
View File

@@ -1,7 +1,7 @@
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useMenuStore } from '../../../stores/stores'; import { useMenuStore } from '../../../stores/use-menu-store';
import { ToastEvent } from '../../../services/event-manager'; import { ToastEvent } from '../../../services/event-manager';
import { getTotalNotes } from '../../../utils'; import { getTotalNotes } from '../../../utils';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';

4
apps/mobile/src/components/listitems/headers/sectionheader.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { TouchableOpacity, useWindowDimensions, View } from 'react-native'; import { TouchableOpacity, useWindowDimensions, View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useSettingStore } from '../../../stores/stores'; import { useSettingStore } from '../../../stores/use-setting-store';
import { import {
eSendEvent, eSendEvent,
eSubscribeEvent, eSubscribeEvent,

51
apps/mobile/src/components/listitems/note/index.js
View File

@@ -3,8 +3,8 @@ import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useSettingStore } from '../../../stores/stores'; import { useSettingStore } from '../../../stores/use-setting-store';
import { eSendEvent } from '../../../services/event-manager'; import { eSendEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { COLORS_NOTE } from '../../../utils/color-scheme'; import { COLORS_NOTE } from '../../../utils/color-scheme';
@@ -19,32 +19,33 @@ import Heading from '../../ui/typography/heading';
import Paragraph from '../../ui/typography/paragraph'; import Paragraph from '../../ui/typography/paragraph';
const navigateToTopic = topic => { const navigateToTopic = topic => {
let routeName = 'NotesPage'; Navigation.navigate(
let params = { ...topic, menu: false, get: 'topics' }; {
let headerState = { name: 'NotesPage',
heading: topic.title, title: topic.title,
id: topic.id, id: topic.id,
type: topic.type type: topic.type
}; },
eSendEvent(refreshNotesPage, params); { ...topic, menu: false, get: 'topics' }
Navigation.navigate(routeName, params, headerState); );
}; };
function navigateToTag(item) { function navigateToTag(item) {
let _tag = db.tags.tag(item.id); const tag = db.tags.tag(item.id);
if (!_tag) return; if (!tag) return;
let params = { Navigation.navigate(
..._tag, {
type: 'tag', name: 'NotesPage',
get: 'tagged' title: '#' + tag.title,
}; id: tag.id,
type: tag.type
eSendEvent(refreshNotesPage, params); },
Navigation.navigate('NotesPage', params, { {
heading: '#' + _tag.title, ...tag,
id: _tag.id, type: 'tag',
type: _tag.type get: 'tagged'
}); }
);
} }
const showActionSheet = item => { const showActionSheet = item => {

22
apps/mobile/src/components/listitems/note/wrapper.js
View File

@@ -1,7 +1,9 @@
import React from 'react'; import React from 'react';
import NoteItem from '.'; import NoteItem from '.';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { useEditorStore, useSelectionStore, useTrashStore } from '../../../stores/stores'; import { useSelectionStore } from '../../../stores/use-selection-store';
import { useTrashStore } from '../../../stores/use-trash-store';
import { useEditorStore } from '../../../stores/use-editor-store';
import { DDS } from '../../../services/device-detection'; import { DDS } from '../../../services/device-detection';
import { eSendEvent, openVault, ToastEvent } from '../../../services/event-manager'; import { eSendEvent, openVault, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
@@ -66,14 +68,16 @@ export const openNote = async (item, isTrash, setSelectedItem) => {
negativeText: 'Delete', negativeText: 'Delete',
positivePress: async () => { positivePress: async () => {
await db.trash.restore(item.id); await db.trash.restore(item.id);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Tags, 'Tags',
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.Notebooks, 'Notebooks',
Navigation.routeNames.NotesPage, 'Favorites',
Navigation.routeNames.Favorites, 'Trash',
Navigation.routeNames.Trash 'TaggedNotes',
]); 'ColoredNotes',
'TopicNotes'
);
useSelectionStore.getState().setSelectionMode(false); useSelectionStore.getState().setSelectionMode(false);
ToastEvent.show({ ToastEvent.show({
heading: 'Restore successful', heading: 'Restore successful',

22
apps/mobile/src/components/listitems/notebook/index.js
View File

@@ -2,8 +2,8 @@ import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useSettingStore } from '../../../stores/stores'; import { useSettingStore } from '../../../stores/use-setting-store';
import { eSendEvent } from '../../../services/event-manager'; import { eSendEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { getTotalNotes, history } from '../../../utils'; import { getTotalNotes, history } from '../../../utils';
@@ -27,15 +27,15 @@ export const NotebookItem = ({ item, isTopic = false, notebookID, isTrash, dateB
const navigateToTopic = topic => { const navigateToTopic = topic => {
if (history.selectedItemsList.length > 0) return; if (history.selectedItemsList.length > 0) return;
let routeName = 'NotesPage'; Navigation.navigate(
let params = { ...topic, menu: false, get: 'topics' }; {
let headerState = { name: 'NotesPage',
heading: topic.title, title: topic.title,
id: topic.id, id: topic.id,
type: topic.type type: topic.type
}; },
eSendEvent(refreshNotesPage, params); { ...topic, menu: false, get: 'topics' }
Navigation.navigate(routeName, params, headerState); );
}; };
return ( return (

49
apps/mobile/src/components/listitems/notebook/wrapper.js
View File

@@ -1,13 +1,15 @@
import React from 'react'; import React from 'react';
import { NotebookItem } from '.'; import { NotebookItem } from '.';
import { eSendEvent, ToastEvent } from '../../../services/event-manager'; import Notebook from '../../../screens/notebook';
import { TopicNotes } from '../../../screens/notes/topic-notes';
import { ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { useSelectionStore, useTrashStore } from '../../../stores/stores'; import { useSelectionStore } from '../../../stores/use-selection-store';
import { useTrashStore } from '../../../stores/use-trash-store';
import { history } from '../../../utils'; import { history } from '../../../utils';
import { eOnNewTopicAdded, refreshNotesPage } from '../../../utils/events'; import { db } from '../../../utils/database';
import { presentDialog } from '../../dialog/functions'; import { presentDialog } from '../../dialog/functions';
import SelectionWrapper from '../selection-wrapper'; import SelectionWrapper from '../selection-wrapper';
import { db } from '../../../utils/database';
export const NotebookWrapper = React.memo( export const NotebookWrapper = React.memo(
({ item, index, dateBy }) => { ({ item, index, dateBy }) => {
@@ -30,14 +32,16 @@ export const NotebookWrapper = React.memo(
negativeText: 'Delete', negativeText: 'Delete',
positivePress: async () => { positivePress: async () => {
await db.trash.restore(item.id); await db.trash.restore(item.id);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Tags, 'Tags',
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.Notebooks, 'Notebooks',
Navigation.routeNames.NotesPage, 'Favorites',
Navigation.routeNames.Favorites, 'Trash',
Navigation.routeNames.Trash 'TaggedNotes',
]); 'ColoredNotes',
'TopicNotes'
);
useSelectionStore.getState().setSelectionMode(false); useSelectionStore.getState().setSelectionMode(false);
ToastEvent.show({ ToastEvent.show({
heading: 'Restore successful', heading: 'Restore successful',
@@ -57,28 +61,11 @@ export const NotebookWrapper = React.memo(
}); });
return; return;
} }
let routeName = item.type === 'topic' ? 'NotesPage' : 'Notebook';
let params =
item.type === 'topic'
? { ...item, menu: false }
: {
menu: false,
notebook: item,
title: item.title
};
let headerState = {
heading: item.title,
id: item.id,
type: item.type
};
if (item.type === 'topic') { if (item.type === 'topic') {
eSendEvent(refreshNotesPage, params); TopicNotes.navigate(item, true);
} else { } else {
eSendEvent(eOnNewTopicAdded, params); Notebook.navigate(item, true);
} }
Navigation.navigate(routeName, params, headerState);
}; };
return ( return (
<SelectionWrapper <SelectionWrapper

43
apps/mobile/src/components/listitems/selectionwrapper/actionstrip.js
View File

@@ -1,16 +1,14 @@
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Animated, { SlideInUp, SlideOutDown, useValue } from 'react-native-reanimated'; import Animated, { SlideInUp, SlideOutDown } from 'react-native-reanimated';
import { openVault, ToastEvent } from '../../../services/event-manager'; import { openVault, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { import { useSelectionStore } from '../../../stores/use-selection-store';
useMenuStore, import { useTrashStore } from '../../../stores/use-trash-store';
useNotebookStore, import { useMenuStore } from '../../../stores/use-menu-store';
useSelectionStore, import { useNotebookStore } from '../../../stores/use-notebook-store';
useTrashStore import { useThemeStore } from '../../../stores/use-theme-store';
} from '../../../stores/stores';
import { useThemeStore } from '../../../stores/theme';
import { dWidth, getElevation, toTXT } from '../../../utils'; import { dWidth, getElevation, toTXT } from '../../../utils';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
import { deleteItems } from '../../../utils/functions'; import { deleteItems } from '../../../utils/functions';
@@ -28,18 +26,19 @@ export const ActionStrip = ({ note, setActionStrip }) => {
const [isPinnedToMenu, setIsPinnedToMenu] = useState(false); const [isPinnedToMenu, setIsPinnedToMenu] = useState(false);
const [width, setWidth] = useState(dWidth - 16); const [width, setWidth] = useState(dWidth - 16);
const opacity = useValue(0);
useEffect(() => { useEffect(() => {
if (note.type === 'note') return; if (note.type === 'note') return;
setIsPinnedToMenu(db.settings.isPinned(note.id)); setIsPinnedToMenu(db.settings.isPinned(note.id));
}, []); }, []);
const updateNotes = () => { const updateNotes = () => {
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
}; };
const actions = [ const actions = [
@@ -155,13 +154,15 @@ export const ActionStrip = ({ note, setActionStrip }) => {
icon: 'delete-restore', icon: 'delete-restore',
onPress: async () => { onPress: async () => {
await db.trash.restore(note.id); await db.trash.restore(note.id);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.Notebooks, 'Favorites',
Navigation.routeNames.NotesPage, 'ColoredNotes',
Navigation.routeNames.Favorites, 'TaggedNotes',
Navigation.routeNames.Trash 'TopicNotes',
]); 'Trash',
'Notebooks'
);
ToastEvent.show({ ToastEvent.show({
heading: heading:

4
apps/mobile/src/components/listitems/selectionwrapper/backfill.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useEditorStore } from '../../../stores/stores'; import { useEditorStore } from '../../../stores/use-editor-store';
import { hexToRGBA } from '../../../utils/color-scheme/utils'; import { hexToRGBA } from '../../../utils/color-scheme/utils';
export const Filler = ({ item, background }) => { export const Filler = ({ item, background }) => {

4
apps/mobile/src/components/listitems/selectionwrapper/index.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager';
import { useSettingStore } from '../../../stores/stores'; import { useSettingStore } from '../../../stores/use-setting-store';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { history } from '../../../utils'; import { history } from '../../../utils';
import { PressableButton } from '../../ui/pressable'; import { PressableButton } from '../../ui/pressable';
import { ActionStrip } from './action-strip'; import { ActionStrip } from './action-strip';

4
apps/mobile/src/components/listitems/selectionwrapper/selection.js
View File

@@ -1,9 +1,9 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { TouchableOpacity, View } from 'react-native'; import { TouchableOpacity, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { Actions } from '../../../stores/Actions'; import { Actions } from '../../../stores/Actions';
import { useSelectionStore } from '../../../stores/stores'; import { useSelectionStore } from '../../../stores/use-selection-store';
import { SIZE } from '../../../utils/size'; import { SIZE } from '../../../utils/size';
export const SelectionIcon = ({ setActionStrip, item, compactMode }) => { export const SelectionIcon = ({ setActionStrip, item, compactMode }) => {

26
apps/mobile/src/components/listitems/tag/index.js
View File

@@ -1,35 +1,21 @@
import React from 'react'; import React from 'react';
import { useWindowDimensions, View } from 'react-native'; import { View } from 'react-native';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { PressableButton } from '../../ui/pressable'; import { TaggedNotes } from '../../../screens/notes/tagged';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { eSendEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
import { refreshNotesPage } from '../../../utils/events';
import { SIZE } from '../../../utils/size'; import { SIZE } from '../../../utils/size';
import { IconButton } from '../../ui/icon-button';
import { Properties } from '../../properties'; import { Properties } from '../../properties';
import { IconButton } from '../../ui/icon-button';
import { PressableButton } from '../../ui/pressable';
import Heading from '../../ui/typography/heading'; import Heading from '../../ui/typography/heading';
import Paragraph from '../../ui/typography/paragraph'; import Paragraph from '../../ui/typography/paragraph';
const TagItem = React.memo( const TagItem = React.memo(
({ item, index }) => { ({ item, index }) => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const { fontScale } = useWindowDimensions();
const onPress = () => { const onPress = () => {
let params = { TaggedNotes.navigate(item, true);
...item,
type: 'tag',
get: 'tagged'
};
eSendEvent(refreshNotesPage, params);
Navigation.navigate('NotesPage', params, {
heading: '#' + item.title,
id: item.id,
type: item.type
});
}; };
return ( return (

14
apps/mobile/src/components/mergeconflicts/index.js
View File

@@ -5,7 +5,7 @@ import { Modal, Platform, SafeAreaView, Text, View } from 'react-native';
import Animated from 'react-native-reanimated'; import Animated from 'react-native-reanimated';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import WebView from 'react-native-webview'; import WebView from 'react-native-webview';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { import {
eSendEvent, eSendEvent,
@@ -156,11 +156,13 @@ const MergeConflicts = () => {
}); });
} }
eSendEvent(refreshNotesPage); eSendEvent(refreshNotesPage);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
if (getNote()?.id === note.id) { if (getNote()?.id === note.id) {
updateNoteInEditor(); updateNoteInEditor();
} }

2
apps/mobile/src/components/notehistory/index.js
View File

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react';
import { Text, View } from 'react-native'; import { Text, View } from 'react-native';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { presentSheet } from '../../services/event-manager'; import { presentSheet } from '../../services/event-manager';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { openLinkInBrowser } from '../../utils/functions'; import { openLinkInBrowser } from '../../utils/functions';

16
apps/mobile/src/components/notehistory/preview.js
View File

@@ -1,8 +1,8 @@
import React, { useRef } from 'react'; import React, { useRef } from 'react';
import { Alert, Platform, View } from 'react-native'; import { Alert, Platform, View } from 'react-native';
import WebView from 'react-native-webview'; import WebView from 'react-native-webview';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useEditorStore } from '../../stores/stores'; import { useEditorStore } from '../../stores/use-editor-store';
import { eSendEvent, ToastEvent } from '../../services/event-manager'; import { eSendEvent, ToastEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
@@ -78,11 +78,13 @@ export default function NotePreview({ session, content }) {
} }
eSendEvent(eCloseProgressDialog, 'note_history'); eSendEvent(eCloseProgressDialog, 'note_history');
eSendEvent(eCloseProgressDialog); eSendEvent(eCloseProgressDialog);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
ToastEvent.show({ ToastEvent.show({
heading: 'Note restored successfully', heading: 'Note restored successfully',

4
apps/mobile/src/components/premium/component.js
View File

@@ -1,8 +1,8 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { ActivityIndicator, ScrollView, View } from 'react-native'; import { ActivityIndicator, ScrollView, View } from 'react-native';
import { LAUNCH_ROCKET } from '../../assets/images/assets'; import { LAUNCH_ROCKET } from '../../assets/images/assets';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent, presentSheet } from '../../services/event-manager'; import { eSendEvent, presentSheet } from '../../services/event-manager';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';

2
apps/mobile/src/components/premium/expiring.js
View File

@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import { eOpenPremiumDialog, eOpenResultDialog, eOpenTrialEndingDialog } from '../../utils/events'; import { eOpenPremiumDialog, eOpenResultDialog, eOpenTrialEndingDialog } from '../../utils/events';

2
apps/mobile/src/components/premium/feature.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { Text, View } from 'react-native'; import { Text, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
import { ProTag } from './pro-tag'; import { ProTag } from './pro-tag';

2
apps/mobile/src/components/premium/group.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { ScrollView, View } from 'react-native'; import { ScrollView, View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';

2
apps/mobile/src/components/premium/offer.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { Text } from 'react-native'; import { Text } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';

2
apps/mobile/src/components/premium/premiumtoast.js
View File

@@ -5,7 +5,7 @@ import { EditorWebView } from '../../screens/editor/Functions';
import tiny from '../../screens/editor/tiny/tiny'; import tiny from '../../screens/editor/tiny/tiny';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { editing, getElevation } from '../../utils'; import { editing, getElevation } from '../../utils';
import { eCloseActionSheet, eOpenPremiumDialog, eShowGetPremium } from '../../utils/events'; import { eCloseActionSheet, eOpenPremiumDialog, eShowGetPremium } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

2
apps/mobile/src/components/premium/pricingitem.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { getElevation } from '../../utils'; import { getElevation } from '../../utils';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';

4
apps/mobile/src/components/premium/pricingplans.js
View File

@@ -1,8 +1,8 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { ActivityIndicator, Platform, Text, View } from 'react-native'; import { ActivityIndicator, Platform, Text, View } from 'react-native';
import * as RNIap from 'react-native-iap'; import * as RNIap from 'react-native-iap';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager'; import { eSendEvent, presentSheet, ToastEvent } from '../../services/event-manager';
import PremiumService from '../../services/premium'; import PremiumService from '../../services/premium';
import { db } from '../../utils/database'; import { db } from '../../utils/database';

2
apps/mobile/src/components/premium/protag.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
export const ProTag = ({ width, size, background }) => { export const ProTag = ({ width, size, background }) => {

15
apps/mobile/src/components/properties/colortags.js
View File

@@ -2,7 +2,8 @@ import React, { useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { notesnook } from '../../../e2e/test.ids'; import { notesnook } from '../../../e2e/test.ids';
import { useMenuStore, useSettingStore } from '../../stores/stores'; import { useMenuStore } from '../../stores/use-menu-store';
import { useSettingStore } from '../../stores/use-setting-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
@@ -28,11 +29,13 @@ export const ColorTags = ({ item, close }) => {
let _note = db.notes.note(note.id).data; let _note = db.notes.note(note.id).data;
setNote({ ..._note }); setNote({ ..._note });
setColorNotes(); setColorNotes();
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
eSendEvent(refreshNotesPage); eSendEvent(refreshNotesPage);
}; };

2
apps/mobile/src/components/properties/datemeta.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { timeConverter } from '../../utils/time'; import { timeConverter } from '../../utils/time';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';

2
apps/mobile/src/components/properties/devmode.js
View File

@@ -1,7 +1,7 @@
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useSettingStore } from '../../stores/stores'; import { useSettingStore } from '../../stores/use-setting-store';
import { ToastEvent } from '../../services/event-manager'; import { ToastEvent } from '../../services/event-manager';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

2
apps/mobile/src/components/properties/index.js
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { Platform, ScrollView, View } from 'react-native'; import { Platform, ScrollView, View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { presentSheet } from '../../services/event-manager'; import { presentSheet } from '../../services/event-manager';
import { db } from '../../utils/database'; import { db } from '../../utils/database';

4
apps/mobile/src/components/properties/items.js
View File

@@ -2,8 +2,8 @@ import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useSettingStore } from '../../stores/stores'; import { useSettingStore } from '../../stores/use-setting-store';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';

27
apps/mobile/src/components/properties/notebooks.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { ScrollView, View } from 'react-native'; import { ScrollView, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
@@ -42,34 +42,33 @@ export default function Notebooks({ note, close }) {
} }
const navigateNotebook = id => { const navigateNotebook = id => {
let routeName = 'Notebook'; let item = db.notebooks.notebook(id)?.data;
let item = db.notebooks.notebook(id).data; if (!item) return;
let params = { let params = {
menu: false, menu: false,
notebook: item, notebook: item,
title: item.title title: item.title
}; };
let headerState = { let currentScreen = {
heading: item.title, name: 'Notebook',
title: item.title,
id: item.id, id: item.id,
type: item.type type: item.type
}; };
eSendEvent(eOnNewTopicAdded, params); Navigation.navigate(currentScreen, params);
Navigation.navigate(routeName, params, headerState);
}; };
const navigateTopic = (id, notebookId) => { const navigateTopic = (id, notebookId) => {
let routeName = 'NotesPage'; let item = db.notebooks.notebook(notebookId)?.topics?.topic(id)?._topic;
let item = db.notebooks.notebook(notebookId).topics.topic(id)._topic; if (!item) return;
let params = { ...item, menu: false }; let params = { ...item, menu: false };
let headerState = { let currentScreen = {
heading: item.title, name: 'NotesPage',
title: item.title,
id: item.id, id: item.id,
type: item.type type: item.type
}; };
eSendEvent(refreshNotesPage, params); Navigation.navigate(currentScreen, params);
Navigation.navigate(routeName, params, headerState);
}; };
return !note.notebooks || note.notebooks.length === 0 ? null : ( return !note.notebooks || note.notebooks.length === 0 ? null : (

4
apps/mobile/src/components/properties/synced.js
View File

@@ -1,8 +1,8 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { openLinkInBrowser } from '../../utils/functions'; import { openLinkInBrowser } from '../../utils/functions';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { sleep } from '../../utils/time'; import { sleep } from '../../utils/time';

18
apps/mobile/src/components/properties/tags.js
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
@@ -64,13 +64,15 @@ const TagItem = ({ tag, close }) => {
type: 'tag', type: 'tag',
get: 'tagged' get: 'tagged'
}; };
Navigation.navigate(
eSendEvent(refreshNotesPage, params); {
Navigation.navigate('NotesPage', params, { name: 'NotesPage',
heading: '#' + _tag.title, title: '#' + _tag.title,
id: _tag.id, id: _tag.id,
type: _tag.type type: _tag.type
}); },
params
);
await sleep(300); await sleep(300);
close(); close();
}; };

12
apps/mobile/src/components/properties/topics.js
View File

@@ -1,24 +1,20 @@
import React from 'react'; import React from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { eSendEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { refreshNotesPage } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
export const Topics = ({ item, close }) => { export const Topics = ({ item, close }) => {
const open = topic => { const open = topic => {
close(); close();
let routeName = 'NotesPage';
let params = { ...topic, menu: false, get: 'topics' }; let params = { ...topic, menu: false, get: 'topics' };
let headerState = { let currentScreen = {
heading: topic.title, name: 'NotesPage',
title: topic.title,
id: topic.id, id: topic.id,
type: topic.type type: topic.type
}; };
eSendEvent(refreshNotesPage, params); Navigation.navigate(currentScreen, params);
Navigation.navigate(routeName, params, headerState);
}; };
const renderItem = topic => ( const renderItem = topic => (

88
apps/mobile/src/components/selectionheader/index.js
View File

@@ -1,8 +1,8 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { BackHandler, Platform, View } from 'react-native'; import { BackHandler, Platform, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useSelectionStore } from '../../stores/stores'; import { useSelectionStore } from '../../stores/use-selection-store';
import { eSendEvent, ToastEvent } from '../../services/event-manager'; import { eSendEvent, ToastEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
@@ -15,19 +15,24 @@ import { sleep } from '../../utils/time';
import { presentDialog } from '../dialog/functions'; import { presentDialog } from '../dialog/functions';
import { IconButton } from '../ui/icon-button'; import { IconButton } from '../ui/icon-button';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';
import useNavigationStore from '../../stores/use-navigation-store';
export const SelectionHeader = React.memo(({ screen, type, extras }) => { export const SelectionHeader = React.memo(() => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const selectionMode = useSelectionStore(state => state.selectionMode); const selectionMode = useSelectionStore(state => state.selectionMode);
const selectedItemsList = useSelectionStore(state => state.selectedItemsList); const selectedItemsList = useSelectionStore(state => state.selectedItemsList);
const setSelectionMode = useSelectionStore(state => state.setSelectionMode); const setSelectionMode = useSelectionStore(state => state.setSelectionMode);
const clearSelection = useSelectionStore(state => state.clearSelection); const clearSelection = useSelectionStore(state => state.clearSelection);
const currentScreen = useNavigationStore(state => state.currentScreen);
const screen = currentScreen.name;
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
useEffect(() => { useEffect(() => {
tabBarRef.current?.setScrollEnabled(!selectionMode); if (selectionMode) {
tabBarRef.current?.lock();
} else {
tabBarRef.current?.unlock();
}
}, [selectionMode]); }, [selectionMode]);
const addToFavorite = async () => { const addToFavorite = async () => {
@@ -35,11 +40,13 @@ export const SelectionHeader = React.memo(({ screen, type, extras }) => {
selectedItemsList.forEach(item => { selectedItemsList.forEach(item => {
db.notes.note(item.id).favorite(); db.notes.note(item.id).favorite();
}); });
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.NotesPage, 'Favorites',
Navigation.routeNames.Favorites 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
clearSelection(); clearSelection();
} }
}; };
@@ -51,14 +58,17 @@ export const SelectionHeader = React.memo(({ screen, type, extras }) => {
noteIds.push(item.id); noteIds.push(item.id);
}); });
await db.trash.restore(...noteIds); await db.trash.restore(...noteIds);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Tags, 'Notes',
Navigation.routeNames.Notes, 'Favorites',
Navigation.routeNames.Notebooks, 'ColoredNotes',
Navigation.routeNames.NotesPage, 'TaggedNotes',
Navigation.routeNames.Favorites, 'TopicNotes',
Navigation.routeNames.Trash 'Trash',
]); 'Notebooks',
'Tags'
);
clearSelection(); clearSelection();
ToastEvent.show({ ToastEvent.show({
heading: 'Restore successful', heading: 'Restore successful',
@@ -82,14 +92,16 @@ export const SelectionHeader = React.memo(({ screen, type, extras }) => {
noteIds.push(item.id); noteIds.push(item.id);
}); });
await db.trash.delete(...noteIds); await db.trash.delete(...noteIds);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Tags, 'Notes',
Navigation.routeNames.Notes, 'Favorites',
Navigation.routeNames.Notebooks, 'ColoredNotes',
Navigation.routeNames.NotesPage, 'TaggedNotes',
Navigation.routeNames.Favorites, 'TopicNotes',
Navigation.routeNames.Trash 'Trash',
]); 'Notebooks',
'Tags'
);
clearSelection(); clearSelection();
} }
}, },
@@ -111,7 +123,7 @@ export const SelectionHeader = React.memo(({ screen, type, extras }) => {
} }
}, [selectionMode]); }, [selectionMode]);
return !selectionMode || Navigation.getCurrentScreen() !== screen ? null : ( return !selectionMode ? null : (
<View <View
style={{ style={{
width: '100%', width: '100%',
@@ -205,23 +217,27 @@ export const SelectionHeader = React.memo(({ screen, type, extras }) => {
/> />
)} )}
{type === 'topic' ? ( {screen === 'TopicNotes' ? (
<IconButton <IconButton
onPress={async () => { onPress={async () => {
if (selectedItemsList.length > 0) { if (selectedItemsList.length > 0) {
//TODO
let extras = {};
await db.notebooks await db.notebooks
.notebook(extras.notebook) .notebook(extras.notebook)
.topics.topic(extras.topic) .topics.topic(extras.topic)
.delete(...selectedItemsList.map(item => item.id)); .delete(...selectedItemsList.map(item => item.id));
eSendEvent(refreshNotesPage); eSendEvent(refreshNotesPage);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes, 'ColoredNotes',
Navigation.routeNames.Notebook, 'TaggedNotes',
Navigation.routeNames.Notebooks 'TopicNotes',
]); 'Notebooks',
'Notebook'
);
clearSelection(); clearSelection();
} }
}} }}

2
apps/mobile/src/components/sheetprovider/index.js
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { ActivityIndicator, View } from 'react-native'; import { ActivityIndicator, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import { editing } from '../../utils'; import { editing } from '../../utils';
import { eCloseProgressDialog, eOpenProgressDialog } from '../../utils/events'; import { eCloseProgressDialog, eOpenProgressDialog } from '../../utils/events';

16
apps/mobile/src/components/sheets/addnotebook/index.js
View File

@@ -2,7 +2,7 @@ import React, { createRef } from 'react';
import { Keyboard, StyleSheet, TextInput, TouchableOpacity, View } from 'react-native'; import { Keyboard, StyleSheet, TextInput, TouchableOpacity, View } from 'react-native';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { useMenuStore } from '../../../stores/stores'; import { useMenuStore } from '../../../stores/use-menu-store';
import { DDS } from '../../../services/device-detection'; import { DDS } from '../../../services/device-detection';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
@@ -198,11 +198,15 @@ export class AddNotebookSheet extends React.Component {
}); });
} }
useMenuStore.getState().setMenuPins(); useMenuStore.getState().setMenuPins();
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notebooks, 'Notes',
Navigation.routeNames.Notebook, 'ColoredNotes',
Navigation.routeNames.NotesPage 'TaggedNotes',
]); 'TopicNotes',
'Notebooks',
'Notebook'
);
this.setState({ this.setState({
loading: false loading: false
}); });

34
apps/mobile/src/components/sheets/addto/index.js
View File

@@ -5,8 +5,9 @@ import { notesnook } from '../../../../e2e/test.ids';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import SearchService from '../../../services/search'; import SearchService from '../../../services/search';
import { useNotebookStore, useSelectionStore } from '../../../stores/stores'; import { useSelectionStore } from '../../../stores/use-selection-store';
import { useThemeStore } from '../../../stores/theme'; import { useNotebookStore } from '../../../stores/use-notebook-store';
import { useThemeStore } from '../../../stores/use-theme-store';
import { getTotalNotes } from '../../../utils'; import { getTotalNotes } from '../../../utils';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
import { eOpenMoveNoteDialog } from '../../../utils/events'; import { eOpenMoveNoteDialog } from '../../../utils/events';
@@ -50,13 +51,15 @@ const AddToNotebookSheet = () => {
setVisible(false); setVisible(false);
newNotebookTitle = null; newNotebookTitle = null;
setNote(null); setNote(null);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.NotesPage, 'ColoredNotes',
Navigation.routeNames.Notebook, 'TaggedNotes',
Navigation.routeNames.Notebooks 'TopicNotes',
]); 'Notebooks',
'Notebook'
);
}; };
return !visible ? null : ( return !visible ? null : (
@@ -135,11 +138,14 @@ const MoveNoteComponent = ({ note }) => {
); );
} }
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
setNotebooks(); setNotebooks();
updateNoteExists(); updateNoteExists();
SearchService.updateAndSearch(); SearchService.updateAndSearch();

2
apps/mobile/src/components/sheets/exportnotes/index.js
View File

@@ -4,7 +4,7 @@ import FileViewer from 'react-native-file-viewer';
import Share from 'react-native-share'; import Share from 'react-native-share';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { notesnook } from '../../../../e2e/test.ids'; import { notesnook } from '../../../../e2e/test.ids';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { ToastEvent } from '../../../services/event-manager'; import { ToastEvent } from '../../../services/event-manager';
import Exporter from '../../../services/exporter'; import Exporter from '../../../services/exporter';
import { getElevation } from '../../../utils'; import { getElevation } from '../../../utils';

4
apps/mobile/src/components/sheets/github/issue.js
View File

@@ -1,8 +1,8 @@
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { Linking, Platform, Text, TextInput, View } from 'react-native'; import { Linking, Platform, Text, TextInput, View } from 'react-native';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useUserStore } from '../../../stores/stores'; import { useUserStore } from '../../../stores/use-user-store';
import { eSendEvent, ToastEvent } from '../../../services/event-manager'; import { eSendEvent, ToastEvent } from '../../../services/event-manager';
import PremiumService from '../../../services/premium'; import PremiumService from '../../../services/premium';
import { APP_VERSION } from '../../../../version'; import { APP_VERSION } from '../../../../version';

30
apps/mobile/src/components/sheets/managetags/index.js
View File

@@ -1,8 +1,8 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { ScrollView, View } from 'react-native'; import { ScrollView, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useTagStore } from '../../../stores/stores'; import { useTagStore } from '../../../stores/use-tag-store';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
@@ -113,11 +113,15 @@ const ManageTagsSheet = () => {
}); });
} }
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes',
'Notebooks',
'Notebook'
);
}; };
return !visible ? null : ( return !visible ? null : (
@@ -230,11 +234,13 @@ const TagItem = ({ tag, note, setNote }) => {
setNote(db.notes.note(note.id).data); setNote(db.notes.note(note.id).data);
} catch (e) {} } catch (e) {}
setTimeout(() => { setTimeout(() => {
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
}, 1); }, 1);
}; };

35
apps/mobile/src/components/sheets/movenotes/movenote.tsx
View File

@@ -2,7 +2,7 @@ import React, { RefObject, useState } from 'react';
import { Platform, View } from 'react-native'; import { Platform, View } from 'react-native';
import ActionSheet from 'react-native-actions-sheet'; import ActionSheet from 'react-native-actions-sheet';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { eSendEvent, presentSheet, ToastEvent } from '../../../services/event-manager'; import { eSendEvent, presentSheet, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
@@ -82,13 +82,16 @@ export const MoveNotes = ({
} }
await db.notebooks?.notebook(currentNotebook.id).topics.add(value); await db.notebooks?.notebook(currentNotebook.id).topics.add(value);
setCurrentNotebook(db.notebooks?.notebook(currentNotebook.id).data); setCurrentNotebook(db.notebooks?.notebook(currentNotebook.id).data);
Navigation.setRoutesToUpdate([
Navigation.routeNames.NotesPage, Navigation.queueRoutesForUpdate(
Navigation.routeNames.Favorites, 'Notes',
Navigation.routeNames.Notes, 'Favorites',
Navigation.routeNames.Notebooks, 'ColoredNotes',
Navigation.routeNames.Notebook 'TaggedNotes',
]); 'TopicNotes',
'Notebook',
'Notebooks'
);
return true; return true;
}; };
@@ -269,13 +272,15 @@ export const MoveNotes = ({
}, },
...selectedNoteIds ...selectedNoteIds
); );
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.NotesPage, 'Notes',
Navigation.routeNames.Favorites, 'Favorites',
Navigation.routeNames.Notes, 'ColoredNotes',
Navigation.routeNames.Notebooks, 'TaggedNotes',
Navigation.routeNames.Notebook 'TopicNotes',
]); 'Notebook',
'Notebooks'
);
SearchService.updateAndSearch(); SearchService.updateAndSearch();
eSendEvent(eCloseProgressDialog); eSendEvent(eCloseProgressDialog);
}} }}

2
apps/mobile/src/components/sheets/newfeature/index.tsx
View File

@@ -3,7 +3,7 @@ import { View } from 'react-native';
import { APP_VERSION } from '../../../../version'; import { APP_VERSION } from '../../../../version';
import { eSendEvent, presentSheet } from '../../../services/event-manager'; import { eSendEvent, presentSheet } from '../../../services/event-manager';
import SettingsService from '../../../services/settings'; import SettingsService from '../../../services/settings';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { eCloseProgressDialog } from '../../../utils/events'; import { eCloseProgressDialog } from '../../../utils/events';
import { SIZE } from '../../../utils/size'; import { SIZE } from '../../../utils/size';
import { Button } from '../../ui/button'; import { Button } from '../../ui/button';

2
apps/mobile/src/components/sheets/progress/index.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import * as ProgressBar from 'react-native-progress'; import * as ProgressBar from 'react-native-progress';
import { presentSheet } from '../../../services/event-manager'; import { presentSheet } from '../../../services/event-manager';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import useSyncProgress from '../../../utils/hooks/use-sync-progress'; import useSyncProgress from '../../../utils/hooks/use-sync-progress';
import { SIZE } from '../../../utils/size'; import { SIZE } from '../../../utils/size';
import Seperator from '../../ui/seperator'; import Seperator from '../../ui/seperator';

28
apps/mobile/src/components/sheets/publishnote/index.js
View File

@@ -2,8 +2,8 @@ import Clipboard from '@react-native-clipboard/clipboard';
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { ActivityIndicator, TouchableOpacity, View } from 'react-native'; import { ActivityIndicator, TouchableOpacity, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { useAttachmentStore } from '../../../stores/stores'; import { useAttachmentStore } from '../../../stores/use-attachment-store';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
@@ -76,11 +76,13 @@ const PublishNoteSheet = () => {
password: isLocked && passwordValue password: isLocked && passwordValue
}); });
setNote(db.notes.note(note.id)?.data); setNote(db.notes.note(note.id)?.data);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.NotesPage, 'Favorites',
Navigation.routeNames.Favorites 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
} }
} catch (e) { } catch (e) {
ToastEvent.show({ ToastEvent.show({
@@ -101,11 +103,13 @@ const PublishNoteSheet = () => {
if (note?.id) { if (note?.id) {
await db.monographs.unpublish(note.id); await db.monographs.unpublish(note.id);
setNote(db.notes.note(note.id)?.data); setNote(db.notes.note(note.id)?.data);
Navigation.setRoutesToUpdate([ Navigation.queueRoutesForUpdate(
Navigation.routeNames.Notes, 'Notes',
Navigation.routeNames.NotesPage, 'Favorites',
Navigation.routeNames.Favorites 'ColoredNotes',
]); 'TaggedNotes',
'TopicNotes'
);
} }
} catch (e) { } catch (e) {
ToastEvent.show({ ToastEvent.show({

4
apps/mobile/src/components/sheets/restoredata/index.js
View File

@@ -3,8 +3,8 @@ import { ActivityIndicator, Platform, View } from 'react-native';
import DocumentPicker from 'react-native-document-picker'; import DocumentPicker from 'react-native-document-picker';
import { FlatList } from 'react-native-gesture-handler'; import { FlatList } from 'react-native-gesture-handler';
import * as ScopedStorage from 'react-native-scoped-storage'; import * as ScopedStorage from 'react-native-scoped-storage';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { initialize } from '../../../stores/stores'; import { initialize } from '../../../stores';
import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager'; import { eSubscribeEvent, eUnSubscribeEvent, ToastEvent } from '../../../services/event-manager';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
import { MMKV } from '../../../utils/database/mmkv'; import { MMKV } from '../../../utils/database/mmkv';

5
apps/mobile/src/components/sheets/sort/index.js
View File

@@ -1,8 +1,8 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../../stores/theme';
import { eSendEvent } from '../../../services/event-manager'; import { eSendEvent } from '../../../services/event-manager';
import Navigation from '../../../services/navigation'; import Navigation from '../../../services/navigation';
import { useThemeStore } from '../../../stores/use-theme-store';
import { GROUP, SORT } from '../../../utils/constants'; import { GROUP, SORT } from '../../../utils/constants';
import { db } from '../../../utils/database'; import { db } from '../../../utils/database';
import { refreshNotesPage } from '../../../utils/events'; import { refreshNotesPage } from '../../../utils/events';
@@ -11,7 +11,6 @@ import { SIZE } from '../../../utils/size';
import { Button } from '../../ui/button'; import { Button } from '../../ui/button';
import Seperator from '../../ui/seperator'; import Seperator from '../../ui/seperator';
import Heading from '../../ui/typography/heading'; import Heading from '../../ui/typography/heading';
import Animated, { Layout } from 'react-native-reanimated';
const Sort = ({ type, screen }) => { const Sort = ({ type, screen }) => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
@@ -23,7 +22,7 @@ const Sort = ({ type, screen }) => {
layoutmanager.withSpringAnimation(600); layoutmanager.withSpringAnimation(600);
setGroupOptions(_groupOptions); setGroupOptions(_groupOptions);
setTimeout(() => { setTimeout(() => {
Navigation.setRoutesToUpdate([screen]); Navigation.queueRoutesForUpdate(screen);
eSendEvent('groupOptionsUpdate'); eSendEvent('groupOptionsUpdate');
eSendEvent(refreshNotesPage); eSendEvent(refreshNotesPage);
}, 1); }, 1);

2
apps/mobile/src/components/sheets/update/index.js
View File

@@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { Linking, View } from 'react-native'; import { Linking, View } from 'react-native';
import { ScrollView } from 'react-native-gesture-handler'; import { ScrollView } from 'react-native-gesture-handler';
import { useThemeStore } from '../../../stores/theme'; import { useThemeStore } from '../../../stores/use-theme-store';
import { STORE_LINK } from '../../../utils/constants'; import { STORE_LINK } from '../../../utils/constants';
import { SIZE } from '../../../utils/size'; import { SIZE } from '../../../utils/size';
import { Button } from '../../ui/button'; import { Button } from '../../ui/button';

36
apps/mobile/src/components/sidemenu/colorsection.js
View File

@@ -1,12 +1,12 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import { useThemeStore } from '../../stores/theme';
import { useMenuStore, useNoteStore } from '../../stores/stores';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import useNavigationStore from '../../stores/use-navigation-store';
import { useMenuStore } from '../../stores/use-menu-store';
import { useNoteStore } from '../../stores/use-notes-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { COLORS_NOTE } from '../../utils/color-scheme'; import { COLORS_NOTE } from '../../utils/color-scheme';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { refreshNotesPage } from '../../utils/events';
import { normalize, SIZE } from '../../utils/size'; import { normalize, SIZE } from '../../utils/size';
import { presentDialog } from '../dialog/functions'; import { presentDialog } from '../dialog/functions';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';
@@ -40,10 +40,11 @@ const ColorItem = React.memo(
const [headerTextState, setHeaderTextState] = useState(null); const [headerTextState, setHeaderTextState] = useState(null);
alias = db.colors.alias(item.id) || ''; alias = db.colors.alias(item.id) || '';
const onHeaderStateChange = event => { const onHeaderStateChange = state => {
setTimeout(() => { setTimeout(() => {
if (event.id === item.id) { let id = state.currentScreen?.id;
setHeaderTextState(event); if (id === item.id) {
setHeaderTextState({ id: state.currentScreen.id });
} else { } else {
if (headerTextState !== null) { if (headerTextState !== null) {
setHeaderTextState(null); setHeaderTextState(null);
@@ -53,9 +54,9 @@ const ColorItem = React.memo(
}; };
useEffect(() => { useEffect(() => {
eSubscribeEvent('onHeaderStateChange', onHeaderStateChange); let unsub = useNavigationStore.subscribe(onHeaderStateChange);
return () => { return () => {
eUnSubscribeEvent('onHeaderStateChange', onHeaderStateChange); unsub();
}; };
}, [headerTextState]); }, [headerTextState]);
@@ -66,14 +67,19 @@ const ColorItem = React.memo(
menu: true, menu: true,
get: 'colored' get: 'colored'
}; };
Navigation.navigate(
{
name: 'NotesPage',
title: alias.slice(0, 1).toUpperCase() + alias.slice(1),
id: item.id,
type: 'color'
},
params
);
eSendEvent(refreshNotesPage, params); setImmediate(() => {
Navigation.navigate('NotesPage', params, { Navigation.closeDrawer();
heading: alias.slice(0, 1).toUpperCase() + alias.slice(1),
id: item.id,
type: 'color'
}); });
Navigation.closeDrawer();
}; };
const onLongPress = () => { const onLongPress = () => {

12
apps/mobile/src/components/sidemenu/index.js
View File

@@ -5,8 +5,10 @@ import { notesnook } from '../../../e2e/test.ids';
import Settings from '../../screens/settings'; import Settings from '../../screens/settings';
import { DDS } from '../../services/device-detection'; import { DDS } from '../../services/device-detection';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import { useSettingStore, useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { useThemeStore } from '../../stores/theme'; import { useSettingStore } from '../../stores/use-setting-store';
import { useNoteStore } from '../../stores/use-notes-store';
import { useThemeStore } from '../../stores/use-theme-store';
import umami from '../../utils/analytics'; import umami from '../../utils/analytics';
import { toggleDarkMode } from '../../utils/color-scheme/utils'; import { toggleDarkMode } from '../../utils/color-scheme/utils';
import { MenuItemsList, SUBSCRIPTION_STATUS } from '../../utils/constants'; import { MenuItemsList, SUBSCRIPTION_STATUS } from '../../utils/constants';
@@ -22,7 +24,7 @@ export const SideMenu = React.memo(
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
const subscriptionType = useUserStore(state => state.user?.subscription?.type); const subscriptionType = useUserStore(state => state.user?.subscription?.type);
console.log(subscriptionType); const loading = useNoteStore(state => state.loading);
const noTextMode = false; const noTextMode = false;
const BottomItemsList = [ const BottomItemsList = [
@@ -63,7 +65,7 @@ export const SideMenu = React.memo(
[] []
); );
return ( return !loading ? (
<View <View
style={{ style={{
height: '100%', height: '100%',
@@ -129,7 +131,7 @@ export const SideMenu = React.memo(
</View> </View>
</View> </View>
</View> </View>
); ) : null;
}, },
() => true () => true
); );

40
apps/mobile/src/components/sidemenu/menuitem.js
View File

@@ -2,9 +2,9 @@ import React, { useEffect, useState } from 'react';
import { View } from 'react-native'; import { View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import ToggleSwitch from 'toggle-switch-react-native'; import ToggleSwitch from 'toggle-switch-react-native';
import { useThemeStore } from '../../stores/theme';
import { eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import useNavigationStore from '../../stores/use-navigation-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { normalize, SIZE } from '../../utils/size'; import { normalize, SIZE } from '../../utils/size';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';
@@ -14,34 +14,30 @@ import Paragraph from '../ui/typography/paragraph';
export const MenuItem = React.memo( export const MenuItem = React.memo(
({ item, index, testID, rightBtn }) => { ({ item, index, testID, rightBtn }) => {
const colors = useThemeStore(state => state.colors); const colors = useThemeStore(state => state.colors);
const [headerTextState, setHeaderTextState] = useState(null); const [headerTextState, setHeaderTextState] = useState(
let isFocused = headerTextState?.id === item.name.toLowerCase() + '_navigation'; useNavigationStore.getState().currentScreen
);
const screenId = item.name.toLowerCase() + '_navigation';
let isFocused = headerTextState?.id === screenId;
const _onPress = event => { const _onPress = () => {
if (item.func) { if (item.func) {
console.log('item.func called');
item.func(); item.func();
} else { } else {
Navigation.navigate( Navigation.navigate({ name: item.name }, { menu: true });
item.name,
{
menu: true
},
{
heading: item.name,
id: item.name.toLowerCase() + '_navigation'
}
);
} }
if (item.close) { if (item.close) {
Navigation.closeDrawer(); setImmediate(() => {
Navigation.closeDrawer();
});
} }
}; };
const onHeaderStateChange = event => { const onHeaderStateChange = state => {
setTimeout(() => { setTimeout(() => {
if (event.id === item.name.toLowerCase() + '_navigation') { let id = state.currentScreen?.id;
setHeaderTextState(event); if (id === screenId) {
setHeaderTextState({ id: state.currentScreen.id });
} else { } else {
if (headerTextState !== null) { if (headerTextState !== null) {
setHeaderTextState(null); setHeaderTextState(null);
@@ -51,9 +47,9 @@ export const MenuItem = React.memo(
}; };
useEffect(() => { useEffect(() => {
eSubscribeEvent('onHeaderStateChange', onHeaderStateChange); let unsub = useNavigationStore.subscribe(onHeaderStateChange);
return () => { return () => {
eUnSubscribeEvent('onHeaderStateChange', onHeaderStateChange); unsub();
}; };
}, [headerTextState]); }, [headerTextState]);

64
apps/mobile/src/components/sidemenu/pinnedsection.js
View File

@@ -1,21 +1,26 @@
import React, { useEffect, useRef, useState } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { FlatList, View } from 'react-native'; import { FlatList, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { eSendEvent } from '../../services/event-manager';
import { useMenuStore, useNoteStore } from '../../stores/stores';
import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../services/event-manager';
import Navigation from '../../services/navigation'; import Navigation from '../../services/navigation';
import useNavigationStore from '../../stores/use-navigation-store';
import { useMenuStore } from '../../stores/use-menu-store';
import { useNoteStore } from '../../stores/use-notes-store';
import { useThemeStore } from '../../stores/use-theme-store';
import { db } from '../../utils/database'; import { db } from '../../utils/database';
import { eOnNewTopicAdded, refreshNotesPage } from '../../utils/events'; import { eOnNewTopicAdded, refreshNotesPage } from '../../utils/events';
import { normalize, SIZE } from '../../utils/size'; import { normalize, SIZE } from '../../utils/size';
import { Properties } from '../properties';
import { Button } from '../ui/button'; import { Button } from '../ui/button';
import { Notice } from '../ui/notice'; import { Notice } from '../ui/notice';
import { PressableButton } from '../ui/pressable'; import { PressableButton } from '../ui/pressable';
import { Properties } from '../properties';
import Seperator from '../ui/seperator'; import Seperator from '../ui/seperator';
import SheetWrapper from '../ui/sheet'; import SheetWrapper from '../ui/sheet';
import Heading from '../ui/typography/heading'; import Heading from '../ui/typography/heading';
import Paragraph from '../ui/typography/paragraph'; import Paragraph from '../ui/typography/paragraph';
import { TaggedNotes } from '../../screens/notes/tagged';
import { TopicNotes } from '../../screens/notes/topic-notes';
import Notebook from '../../screens/notebook';
export const TagsSection = React.memo( export const TagsSection = React.memo(
() => { () => {
@@ -30,42 +35,16 @@ export const TagsSection = React.memo(
}, [loading]); }, [loading]);
const onPress = item => { const onPress = item => {
let params = {};
if (item.type === 'notebook') { if (item.type === 'notebook') {
params = { Notebook.navigate(item);
notebook: item,
title: item.title,
menu: true
};
eSendEvent(eOnNewTopicAdded, params);
Navigation.navigate('Notebook', params, {
heading: item.title,
id: item.id,
type: item.type
});
} else if (item.type === 'tag') { } else if (item.type === 'tag') {
params = { TaggedNotes.navigate(item);
...item,
type: 'tag',
menu: true,
get: 'tagged'
};
eSendEvent(refreshNotesPage, params);
Navigation.navigate('NotesPage', params, {
heading: '#' + db.tags.alias(item.id),
id: item.id,
type: item.type
});
} else { } else {
params = { ...item, menu: true, get: 'topics' }; TopicNotes.navigate(item);
eSendEvent(refreshNotesPage, params);
Navigation.navigate('NotesPage', params, {
heading: item.title,
id: item.id,
type: item.type
});
} }
Navigation.closeDrawer(); setImmediate(() => {
Navigation.closeDrawer();
});
}; };
const renderItem = ({ item, index }) => { const renderItem = ({ item, index }) => {
let alias = item ? (item.type === 'tag' ? db.tags.alias(item.title) : item.title) : null; let alias = item ? (item.type === 'tag' ? db.tags.alias(item.title) : item.title) : null;
@@ -112,10 +91,13 @@ export const PinItem = React.memo(
const color = headerTextState?.id === item.id ? colors.accent : colors.pri; const color = headerTextState?.id === item.id ? colors.accent : colors.pri;
const fwdRef = useRef(); const fwdRef = useRef();
const onHeaderStateChange = event => { const onHeaderStateChange = state => {
setTimeout(() => { setTimeout(() => {
if (event.id === item.id) { let id = state.currentScreen?.id;
setHeaderTextState(event); if (id === item.id) {
setHeaderTextState({
id: state.currentScreen.id
});
} else { } else {
if (headerTextState !== null) { if (headerTextState !== null) {
setHeaderTextState(null); setHeaderTextState(null);
@@ -125,9 +107,9 @@ export const PinItem = React.memo(
}; };
useEffect(() => { useEffect(() => {
eSubscribeEvent('onHeaderStateChange', onHeaderStateChange); let unsub = useNavigationStore.subscribe(onHeaderStateChange);
return () => { return () => {
eUnSubscribeEvent('onHeaderStateChange', onHeaderStateChange); unsub();
}; };
}, [headerTextState]); }, [headerTextState]);

4
apps/mobile/src/components/sidemenu/userstatus.js
View File

@@ -2,8 +2,8 @@ import React from 'react';
import { ActivityIndicator, Platform, View } from 'react-native'; import { ActivityIndicator, Platform, View } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useSafeAreaInsets } from 'react-native-safe-area-context';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { useThemeStore } from '../../stores/theme'; import { useThemeStore } from '../../stores/use-theme-store';
import { useUserStore } from '../../stores/stores'; import { useUserStore } from '../../stores/use-user-store';
import { eSendEvent } from '../../services/event-manager'; import { eSendEvent } from '../../services/event-manager';
import Sync from '../../services/sync'; import Sync from '../../services/sync';
import { eOpenLoginDialog } from '../../utils/events'; import { eOpenLoginDialog } from '../../utils/events';

1
apps/mobile/src/components/tabs/index.js
View File

@@ -22,7 +22,6 @@ export default class Tabs extends Component {
this.lastOffset = this.props.offsets.a; this.lastOffset = this.props.offsets.a;
this.locked = false; this.locked = false;
} }
renderItem = ({ item, index }) => this.props.items[index]; renderItem = ({ item, index }) => this.props.items[index];
onMoveShouldSetResponder = event => { onMoveShouldSetResponder = event => {

244
apps/mobile/src/components/tabs/new.tsx Normal file
View File

@@ -0,0 +1,244 @@
import React, { forwardRef, useImperativeHandle } from 'react';
import { ViewProps } from 'react-native';
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
import Animated, {
runOnJS,
useAnimatedReaction,
useAnimatedStyle,
useSharedValue,
withSpring,
withTiming
} from 'react-native-reanimated';
interface TabProps extends ViewProps {
dimensions: { width: number; height: number };
widths: { a: number; b: number; c: number };
onChangeTab: (data: { i: number; from: number }) => void;
onScroll: (offset: number) => void;
enabled: boolean;
onDrawerStateChange: (state: boolean) => void;
}
export interface TabsRef {
goToPage: (page: number) => void;
goToIndex: (index: number) => 0 | undefined;
unlock: () => boolean;
lock: () => boolean;
openDrawer: () => void;
closeDrawer: () => void;
page: number;
setScrollEnabled: () => true;
}
export const NewTabs = forwardRef<TabsRef, TabProps>(
(
{ children, dimensions, widths, onChangeTab, onScroll, enabled, onDrawerStateChange }: TabProps,
ref
) => {
const translateX = useSharedValue(widths ? widths.a : 0);
const startX = useSharedValue(0);
const currentTab = useSharedValue(1);
const previousTab = useSharedValue(1);
const isDrawerOpen = useSharedValue(false);
const gestureStartValue = useSharedValue({
x: 0,
y: 0
});
const locked = useSharedValue(false);
const forcedLock = useSharedValue(false);
const containerWidth = widths ? widths.a + widths.b + widths.c : dimensions.width;
const drawerPosition = 0;
const homePosition = widths.a;
const editorPosition = widths.a + widths.b;
useImperativeHandle(
ref,
(): TabsRef => ({
goToPage: (page: number) => {
page = page + 1;
if (page === 1) {
onDrawerStateChange(false);
console.log('coming here');
translateX.value = withTiming(homePosition);
currentTab.value = 1;
} else if (page === 2) {
onDrawerStateChange(false);
translateX.value = withTiming(editorPosition);
currentTab.value = 2;
}
},
goToIndex: (index: number) => {
console.log('index', index);
if (index === 0) {
onDrawerStateChange(true);
return (translateX.value = withSpring(0));
}
if (index === 1) {
translateX.value = withTiming(homePosition);
currentTab.value = 1;
} else if (index === 2) {
translateX.value = withTiming(editorPosition);
currentTab.value = 2;
}
},
unlock: () => {
forcedLock.value = false;
console.log('forced lock status', forcedLock.value);
return false;
},
lock: () => {
forcedLock.value = true;
console.log('forced lock status', forcedLock.value);
return true;
},
openDrawer: () => {
translateX.value = withSpring(drawerPosition, {
mass: 0.5
});
onDrawerStateChange(true);
},
closeDrawer: () => {
translateX.value = withTiming(homePosition);
onDrawerStateChange(false);
},
page: currentTab.value,
setScrollEnabled: () => true
}),
[]
);
useAnimatedReaction(
() => currentTab.value,
result => {
if (onChangeTab) {
runOnJS(onChangeTab)({ i: result, from: previousTab.value });
}
},
[]
);
useAnimatedReaction(
() => translateX.value,
value => {
runOnJS(onScroll)(value);
},
[]
);
const gesture = Gesture.Pan()
.maxPointers(1)
.enabled(enabled)
.activeOffsetX([-20, 20])
.failOffsetY([-10, 10])
.onBegin(event => {
locked.value = false;
gestureStartValue.value = {
x: event.absoluteX,
y: event.absoluteY
};
})
.onStart(event => {
let diffX = gestureStartValue.value.x - event.absoluteX;
let diffY = gestureStartValue.value.y - event.absoluteY;
let vx = event.velocityX;
let vy = event.velocityY;
if (vx < 0) vx = vx * -1;
if (vy < 0) vy = vy * -1;
console.log(event.velocityX, event.velocityY, diffX, diffY);
console.log('diff: ', vx / vy, 'lock: ', vx / vy < 5, vy > vx);
// if vy is greater than vx, user is swiping vertically. lock swiping.
if (vy > vx) locked.value = true;
// if dividend of vx/vy is less than 4, user is swiping diagonally. lock swiping
if (vx / vy < 4) locked.value = true;
startX.value = translateX.value;
})
.onChange(event => {
if (locked.value || forcedLock.value) return;
let value = translateX.value + event.changeX * -1;
if (value < 0 || currentTab.value === 2 || value > editorPosition) return;
translateX.value = value;
})
.onEnd(event => {
if (currentTab.value === 2) return;
let velocityX = event.velocityX < 0 ? event.velocityX * -1 : event.velocityX;
let isSwipeLeft = startX.value > translateX.value;
let finalValue = isSwipeLeft
? translateX.value - velocityX / 40.0
: translateX.value + velocityX / 40.0;
const animationConfig = {
velocity: event.velocityX,
overshootClamping: true,
stiffness: 200,
mass: 0.1
};
if (finalValue < homePosition) {
if (isSwipeLeft && finalValue < homePosition - 150) {
translateX.value = withSpring(0, animationConfig);
isDrawerOpen.value = true;
currentTab.value = 1;
runOnJS(onDrawerStateChange)(true);
return;
} else if (!isSwipeLeft && finalValue > 100) {
translateX.value = withSpring(homePosition, animationConfig);
isDrawerOpen.value = false;
currentTab.value = 1;
runOnJS(onDrawerStateChange)(false);
return;
} else if (!isSwipeLeft && finalValue < 150) {
translateX.value = withSpring(0, animationConfig);
isDrawerOpen.value = true;
currentTab.value = 1;
return;
}
}
if (finalValue > homePosition && currentTab.value === 1) {
const sizeOfEditorInView = finalValue - homePosition;
if (!isSwipeLeft && sizeOfEditorInView > 150) {
translateX.value = withSpring(editorPosition, animationConfig);
currentTab.value = 2;
isDrawerOpen.value = false;
return;
}
}
runOnJS(onDrawerStateChange)(false);
translateX.value = withSpring(homePosition, animationConfig);
currentTab.value = 1;
startX.value = 0;
});
const animatedStyles = useAnimatedStyle(() => {
return {
transform: [
{
translateX: translateX.value * -1
}
]
};
}, []);
return (
<GestureDetector gesture={gesture}>
<Animated.View
removeClippedSubviews={false}
collapsable={false}
style={[
{
flex: 1,
width: containerWidth,
flexDirection: 'row'
},
animatedStyles
]}
>
{children}
</Animated.View>
</GestureDetector>
);
}
);

2
apps/mobile/src/components/tip/index.tsx
View File

@@ -2,7 +2,7 @@ import React from 'react';
import { Image, TextStyle, View, ViewStyle } from 'react-native'; import { Image, TextStyle, View, ViewStyle } from 'react-native';
import { eSendEvent, presentSheet } from '../../services/event-manager'; import { eSendEvent, presentSheet } from '../../services/event-manager';
import { TTip } from '../../services/tip-manager'; import { TTip } from '../../services/tip-manager';
import { ThemeStore, useThemeStore } from '../../stores/theme'; import { ThemeStore, useThemeStore } from '../../stores/use-theme-store';
import { MMKV } from '../../utils/database/mmkv'; import { MMKV } from '../../utils/database/mmkv';
import { eCloseProgressDialog } from '../../utils/events'; import { eCloseProgressDialog } from '../../utils/events';
import { SIZE } from '../../utils/size'; import { SIZE } from '../../utils/size';

Some files were not shown because too many files have changed in this diff Show More