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

improve navigation

Browse Source
This commit is contained in:
ammarahm-ed
2021-06-08 12:26:55 +05:00
parent b676dc5a87
commit 0f7844de67
19 changed files with 754 additions and 633 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/mobile/App.js
View File

@@ -9,7 +9,7 @@ import {RootView} from './initializer.root';
import AppLoader from './src/components/AppLoader'; import AppLoader from './src/components/AppLoader';
import {useTracked} from './src/provider'; import {useTracked} from './src/provider';
import {Actions} from './src/provider/Actions'; import {Actions} from './src/provider/Actions';
import {initialize, useNoteStore, useSettingStore} from './src/provider/stores'; import {initialize, useMessageStore, useNoteStore, useSettingStore} from './src/provider/stores';
import BiometricService from './src/services/BiometricService'; import BiometricService from './src/services/BiometricService';
import {DDS} from './src/services/DeviceDetection'; import {DDS} from './src/services/DeviceDetection';
import { import {
@@ -28,6 +28,8 @@ const App = () => {
const [, dispatch] = useTracked(); const [, dispatch] = useTracked();
const setDeviceMode = useSettingStore(state => state.setDeviceMode); const setDeviceMode = useSettingStore(state => state.setDeviceMode);
useEffect(() => { useEffect(() => {
useMessageStore.getState().setAnnouncement();
(async () => { (async () => {
try { try {
Orientation.getOrientation((e, r) => { Orientation.getOrientation((e, r) => {

130
apps/mobile/initializer.root.js
View File

@@ -43,7 +43,7 @@ let currentTab = 0;
const onChangeTab = async obj => { const onChangeTab = async obj => {
console.log(obj.i); console.log(obj.i);
if (obj.i === 1) { if (obj.i === 1) {
console.log('going to editor') console.log('going to editor');
console.log('making note'); console.log('making note');
eSendEvent(eCloseSideMenu); eSendEvent(eCloseSideMenu);
editing.movedAway = false; editing.movedAway = false;
@@ -71,7 +71,9 @@ const onChangeTab = async obj => {
} }
eSendEvent('showTooltip'); eSendEvent('showTooltip');
editing.movedAway = true; editing.movedAway = true;
tiny.call(EditorWebView, tiny.blur); if (editing.currentlyEditing) {
tiny.call(EditorWebView, tiny.blur);
}
} }
editing.isFocused = false; editing.isFocused = false;
currentTab = 0; currentTab = 0;
@@ -101,9 +103,10 @@ const NativeStack = React.memo(
const deviceMode = useSettingStore(state => state.deviceMode); const deviceMode = useSettingStore(state => state.deviceMode);
const setFullscreen = useSettingStore(state => state.setFullscreen); const setFullscreen = useSettingStore(state => state.setFullscreen);
const fullscreen = useSettingStore(state => state.fullscreen);
const setDeviceModeState = useSettingStore(state => state.setDeviceMode); const setDeviceModeState = useSettingStore(state => state.setDeviceMode);
const dimensions = useSettingStore(state => state.dimensions);
const [dimensions, setDimensions] = useState({width, height}); const setDimensions = useSettingStore(state => state.setDimensions);
const animatedOpacity = useValue(0); const animatedOpacity = useValue(0);
const animatedTranslateY = useValue(-9999); const animatedTranslateY = useValue(-9999);
const overlayRef = useRef(); const overlayRef = useRef();
@@ -112,10 +115,12 @@ const NativeStack = React.memo(
setFullscreen(true); setFullscreen(true);
editorRef.current?.setNativeProps({ editorRef.current?.setNativeProps({
style: { style: {
position: 'absolute',
width: dimensions.width, width: dimensions.width,
zIndex: 999, zIndex: 999,
paddingHorizontal: dimensions.width * 0.15, paddingHorizontal:
deviceMode === 'smallTablet'
? dimensions.width * 0
: dimensions.width * 0.15,
backgroundColor: colors.bg, backgroundColor: colors.bg,
}, },
}); });
@@ -125,8 +130,10 @@ const NativeStack = React.memo(
setFullscreen(false); setFullscreen(false);
editorRef.current?.setNativeProps({ editorRef.current?.setNativeProps({
style: { style: {
position: 'relative', width:
width: dimensions.width * 0.55, deviceMode === 'smallTablet'
? dimensions.width * 0.6
: dimensions.width * 0.55,
zIndex: null, zIndex: null,
paddingHorizontal: 0, paddingHorizontal: 0,
}, },
@@ -142,7 +149,7 @@ const NativeStack = React.memo(
eUnSubscribeEvent(eOpenFullscreenEditor, showFullScreenEditor); eUnSubscribeEvent(eOpenFullscreenEditor, showFullScreenEditor);
eUnSubscribeEvent(eCloseFullscreenEditor, closeFullScreenEditor); eUnSubscribeEvent(eCloseFullscreenEditor, closeFullScreenEditor);
}; };
}, []); }, [deviceMode]);
const _onLayout = async event => { const _onLayout = async event => {
if (layoutTimer) { if (layoutTimer) {
@@ -154,8 +161,7 @@ const NativeStack = React.memo(
updatedDimensions = size; updatedDimensions = size;
if (!size || (size.width === dimensions.width && deviceMode !== null)) { if (!size || (size.width === dimensions.width && deviceMode !== null)) {
DDS.setSize(size); DDS.setSize(size);
//console.log(deviceMode, 'MODE__'); setDeviceMode(deviceMode, size);
setDeviceMode(current, size);
return; return;
} }
@@ -192,25 +198,44 @@ const NativeStack = React.memo(
function setDeviceMode(current, size) { function setDeviceMode(current, size) {
eSendEvent(current !== 'mobile' ? eCloseSideMenu : eOpenSideMenu); eSendEvent(current !== 'mobile' ? eCloseSideMenu : eOpenSideMenu);
setDeviceModeState(current); setDeviceModeState(current);
setFullscreen(false); if (fullscreen) {
editorRef.current?.setNativeProps({
editorRef.current?.setNativeProps({ style: {
style: { width: size.width,
position: 'relative', zIndex: 999,
width: current === 'tablet' ? size.width * 0.55 : size.width, paddingHorizontal:
zIndex: null, current === 'smallTablet' ? size.width * 0 : size.width * 0.15,
paddingHorizontal: 0, backgroundColor: colors.bg,
}, },
}); });
if (current === 'tablet') {
tabBarRef.current?.goToIndex(0);
} else { } else {
if (!editing.movedAway) { editorRef.current?.setNativeProps({
tabBarRef.current?.goToIndex(2); style: {
} else { position: 'relative',
tabBarRef.current?.goToIndex(current === 'smallTablet' ? 0 : 1); width:
} current === 'tablet'
? size.width * 0.55
: current === 'smallTablet'
? size.width * 0.6
: size.width,
zIndex: null,
paddingHorizontal: 0,
},
});
} }
console.log('resetting tabs');
setTimeout(() => {
if (current === 'tablet') {
tabBarRef.current?.goToIndex(0);
} else {
if (!editing.movedAway) {
tabBarRef.current?.goToIndex(2);
} else {
tabBarRef.current?.goToIndex(1);
}
}
}, 1);
} }
const onScroll = scrollOffset => { const onScroll = scrollOffset => {
@@ -226,7 +251,7 @@ const NativeStack = React.memo(
op = 1 - o; op = 1 - o;
} }
animatedOpacity.setValue(op); animatedOpacity.setValue(op);
toggleView(op < 0.05 ? false : true); toggleView(op < 0.05 ? false : true);
} }
}; };
@@ -242,15 +267,33 @@ const NativeStack = React.memo(
c: dimensions.width * 2 + dimensions.width * 0.75, c: dimensions.width * 2 + dimensions.width * 0.75,
}, },
smallTablet: { smallTablet: {
a: dimensions.width, a: fullscreen ? 0 : dimensions.width * 0.2,
b: dimensions.width, b: fullscreen ? 0 : dimensions.width + dimensions.width * 0.2,
c: dimensions.width * 2, c: fullscreen ? 0 : dimensions.width + dimensions.width * 0.2,
}, },
tablet: { tablet: {
a: dimensions.width, a: 0,
b: 0,
c: 0,
},
};
const widths = {
mobile: {
a: dimensions.width * 0.75,
b: dimensions.width, b: dimensions.width,
c: dimensions.width, c: dimensions.width,
}, },
smallTablet: {
a: dimensions.width * 0.2,
b: dimensions.width * 0.4,
c: dimensions.width * 0.6,
},
tablet: {
a: dimensions.width * 0.15,
b: dimensions.width * 0.3,
c: dimensions.width * 0.55,
},
}; };
return ( return (
@@ -278,24 +321,14 @@ const NativeStack = React.memo(
<View <View
style={{ style={{
height: '100%', height: '100%',
width: width: fullscreen ? 0 : widths[deviceMode].a,
deviceMode === 'smallTablet'
? dimensions.width * 0.35
: deviceMode === 'smallTablet'
? dimensions.width * 0.15
: dimensions.width * 0.75,
}}> }}>
<Menu /> <Menu />
</View>, </View>,
<View <View
style={{ style={{
height: '100%', height: '100%',
width: width: fullscreen ? 0 : widths[deviceMode].b,
deviceMode === 'mobile'
? dimensions.width
: deviceMode === 'tablet'
? dimensions.width * 0.3
: dimensions.width * 0.65,
}}> }}>
{deviceMode === 'mobile' && ( {deviceMode === 'mobile' && (
<Animated.View <Animated.View
@@ -312,14 +345,13 @@ const NativeStack = React.memo(
}, },
], ],
}} }}
ref={overlayRef}> ref={overlayRef}
/>
</Animated.View>
)} )}
<NavigatorStack /> <NavigatorStack />
</View>, </View>,
<EditorWrapper dimensions={dimensions} />, <EditorWrapper width={widths} dimensions={dimensions} />,
]} ]}
onScroll={onScroll} onScroll={onScroll}
onChangeTab={onChangeTab} onChangeTab={onChangeTab}

453
apps/mobile/ios/Podfile.lock
View File

@@ -2,14 +2,14 @@ PODS:
- Base64 (1.1.2) - Base64 (1.1.2)
- boost-for-react-native (1.63.0) - boost-for-react-native (1.63.0)
- DoubleConversion (1.1.6) - DoubleConversion (1.1.6)
- FBLazyVector (0.64.0) - FBLazyVector (0.64.2)
- FBReactNativeSpec (0.64.0): - FBReactNativeSpec (0.64.2):
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTRequired (= 0.64.0) - RCTRequired (= 0.64.2)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core (= 0.64.0) - React-Core (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- glog (0.3.5) - glog (0.3.5)
- hermes-engine (0.7.2) - hermes-engine (0.7.2)
- libevent (2.1.12) - libevent (2.1.12)
@@ -42,200 +42,200 @@ PODS:
- DoubleConversion - DoubleConversion
- glog - glog
- libevent - libevent
- RCTRequired (0.64.0) - RCTRequired (0.64.2)
- RCTTypeSafety (0.64.0): - RCTTypeSafety (0.64.2):
- FBLazyVector (= 0.64.0) - FBLazyVector (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTRequired (= 0.64.0) - RCTRequired (= 0.64.2)
- React-Core (= 0.64.0) - React-Core (= 0.64.2)
- React (0.64.0): - React (0.64.2):
- React-Core (= 0.64.0) - React-Core (= 0.64.2)
- React-Core/DevSupport (= 0.64.0) - React-Core/DevSupport (= 0.64.2)
- React-Core/RCTWebSocket (= 0.64.0) - React-Core/RCTWebSocket (= 0.64.2)
- React-RCTActionSheet (= 0.64.0) - React-RCTActionSheet (= 0.64.2)
- React-RCTAnimation (= 0.64.0) - React-RCTAnimation (= 0.64.2)
- React-RCTBlob (= 0.64.0) - React-RCTBlob (= 0.64.2)
- React-RCTImage (= 0.64.0) - React-RCTImage (= 0.64.2)
- React-RCTLinking (= 0.64.0) - React-RCTLinking (= 0.64.2)
- React-RCTNetwork (= 0.64.0) - React-RCTNetwork (= 0.64.2)
- React-RCTSettings (= 0.64.0) - React-RCTSettings (= 0.64.2)
- React-RCTText (= 0.64.0) - React-RCTText (= 0.64.2)
- React-RCTVibration (= 0.64.0) - React-RCTVibration (= 0.64.2)
- React-callinvoker (0.64.0) - React-callinvoker (0.64.2)
- React-Core (0.64.0): - React-Core (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default (= 0.64.0) - React-Core/Default (= 0.64.2)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/CoreModulesHeaders (0.64.0): - React-Core/CoreModulesHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/Default (0.64.0): - React-Core/Default (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/DevSupport (0.64.0): - React-Core/DevSupport (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default (= 0.64.0) - React-Core/Default (= 0.64.2)
- React-Core/RCTWebSocket (= 0.64.0) - React-Core/RCTWebSocket (= 0.64.2)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-jsinspector (= 0.64.0) - React-jsinspector (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/Hermes (0.64.0): - React-Core/Hermes (0.64.2):
- glog - glog
- hermes-engine - hermes-engine
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCT-Folly/Futures - RCT-Folly/Futures
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTActionSheetHeaders (0.64.0): - React-Core/RCTActionSheetHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTAnimationHeaders (0.64.0): - React-Core/RCTAnimationHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTBlobHeaders (0.64.0): - React-Core/RCTBlobHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTImageHeaders (0.64.0): - React-Core/RCTImageHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTLinkingHeaders (0.64.0): - React-Core/RCTLinkingHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTNetworkHeaders (0.64.0): - React-Core/RCTNetworkHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTSettingsHeaders (0.64.0): - React-Core/RCTSettingsHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTTextHeaders (0.64.0): - React-Core/RCTTextHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTVibrationHeaders (0.64.0): - React-Core/RCTVibrationHeaders (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default - React-Core/Default
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-Core/RCTWebSocket (0.64.0): - React-Core/RCTWebSocket (0.64.2):
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/Default (= 0.64.0) - React-Core/Default (= 0.64.2)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsiexecutor (= 0.64.0) - React-jsiexecutor (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- Yoga - Yoga
- React-CoreModules (0.64.0): - React-CoreModules (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core/CoreModulesHeaders (= 0.64.0) - React-Core/CoreModulesHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-RCTImage (= 0.64.0) - React-RCTImage (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-cxxreact (0.64.0): - React-cxxreact (0.64.2):
- boost-for-react-native (= 1.63.0) - boost-for-react-native (= 1.63.0)
- DoubleConversion - DoubleConversion
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-callinvoker (= 0.64.0) - React-callinvoker (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-jsinspector (= 0.64.0) - React-jsinspector (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- React-runtimeexecutor (= 0.64.0) - React-runtimeexecutor (= 0.64.2)
- React-jsi (0.64.0): - React-jsi (0.64.2):
- boost-for-react-native (= 1.63.0) - boost-for-react-native (= 1.63.0)
- DoubleConversion - DoubleConversion
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-jsi/Default (= 0.64.0) - React-jsi/Default (= 0.64.2)
- React-jsi/Default (0.64.0): - React-jsi/Default (0.64.2):
- boost-for-react-native (= 1.63.0) - boost-for-react-native (= 1.63.0)
- DoubleConversion - DoubleConversion
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-jsiexecutor (0.64.0): - React-jsiexecutor (0.64.2):
- DoubleConversion - DoubleConversion
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- React-jsinspector (0.64.0) - React-jsinspector (0.64.2)
- react-native-background-actions (2.6.0): - react-native-background-actions (2.6.0):
- React-Core - React-Core
- react-native-begin-background-task (0.1.0): - react-native-begin-background-task (0.1.0):
@@ -244,8 +244,8 @@ PODS:
- React-Core - React-Core
- react-native-fingerprint-scanner (5.0.0): - react-native-fingerprint-scanner (5.0.0):
- React-Core - React-Core
- react-native-get-random-values (1.5.0): - react-native-get-random-values (1.7.0):
- React - React-Core
- react-native-html-to-pdf-lite (0.9.1): - react-native-html-to-pdf-lite (0.9.1):
- React - React
- react-native-image-picker (3.2.1): - react-native-image-picker (3.2.1):
@@ -265,81 +265,79 @@ PODS:
- React - React
- react-native-splash-screen (3.2.0): - react-native-splash-screen (3.2.0):
- React - React
- react-native-viewpager (4.2.2):
- React-Core
- react-native-webview (11.4.0): - react-native-webview (11.4.0):
- React-Core - React-Core
- React-perflogger (0.64.0) - React-perflogger (0.64.2)
- React-RCTActionSheet (0.64.0): - React-RCTActionSheet (0.64.2):
- React-Core/RCTActionSheetHeaders (= 0.64.0) - React-Core/RCTActionSheetHeaders (= 0.64.2)
- React-RCTAnimation (0.64.0): - React-RCTAnimation (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core/RCTAnimationHeaders (= 0.64.0) - React-Core/RCTAnimationHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTBlob (0.64.0): - React-RCTBlob (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/RCTBlobHeaders (= 0.64.0) - React-Core/RCTBlobHeaders (= 0.64.2)
- React-Core/RCTWebSocket (= 0.64.0) - React-Core/RCTWebSocket (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-RCTNetwork (= 0.64.0) - React-RCTNetwork (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTImage (0.64.0): - React-RCTImage (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core/RCTImageHeaders (= 0.64.0) - React-Core/RCTImageHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-RCTNetwork (= 0.64.0) - React-RCTNetwork (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTLinking (0.64.0): - React-RCTLinking (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- React-Core/RCTLinkingHeaders (= 0.64.0) - React-Core/RCTLinkingHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTNetwork (0.64.0): - React-RCTNetwork (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core/RCTNetworkHeaders (= 0.64.0) - React-Core/RCTNetworkHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTSettings (0.64.0): - React-RCTSettings (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- RCTTypeSafety (= 0.64.0) - RCTTypeSafety (= 0.64.2)
- React-Core/RCTSettingsHeaders (= 0.64.0) - React-Core/RCTSettingsHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-RCTText (0.64.0): - React-RCTText (0.64.2):
- React-Core/RCTTextHeaders (= 0.64.0) - React-Core/RCTTextHeaders (= 0.64.2)
- React-RCTVibration (0.64.0): - React-RCTVibration (0.64.2):
- FBReactNativeSpec (= 0.64.0) - FBReactNativeSpec (= 0.64.2)
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-Core/RCTVibrationHeaders (= 0.64.0) - React-Core/RCTVibrationHeaders (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (= 0.64.0) - ReactCommon/turbomodule/core (= 0.64.2)
- React-runtimeexecutor (0.64.0): - React-runtimeexecutor (0.64.2):
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- ReactCommon/turbomodule/core (0.64.0): - ReactCommon/turbomodule/core (0.64.2):
- DoubleConversion - DoubleConversion
- glog - glog
- RCT-Folly (= 2020.01.13.00) - RCT-Folly (= 2020.01.13.00)
- React-callinvoker (= 0.64.0) - React-callinvoker (= 0.64.2)
- React-Core (= 0.64.0) - React-Core (= 0.64.2)
- React-cxxreact (= 0.64.0) - React-cxxreact (= 0.64.2)
- React-jsi (= 0.64.0) - React-jsi (= 0.64.2)
- React-perflogger (= 0.64.0) - React-perflogger (= 0.64.2)
- rn-extensions-share (2.4.0): - rn-extensions-share (2.4.0):
- React-Core - React-Core
- rn-fetch-blob (0.12.0): - rn-fetch-blob (0.12.0):
- React-Core - React-Core
- RNCCheckbox (0.5.6): - RNCCheckbox (0.5.6):
- React-Core - React-Core
- RNCMaskedView (0.1.10): - RNCMaskedView (0.1.11):
- React - React
- RNDeviceInfo (8.0.0): - RNDeviceInfo (8.0.0):
- React-Core - React-Core
@@ -363,22 +361,23 @@ PODS:
- React-Core - React-Core
- RNPrivacySnapshot (1.0.0): - RNPrivacySnapshot (1.0.0):
- React-Core - React-Core
- RNReanimated (1.13.2): - RNReanimated (1.13.3):
- React-Core - React-Core
- RNScreens (2.18.1): - RNScreens (3.3.0):
- React-Core - React-Core
- React-RCTImage
- RNSecureRandom (1.0.0): - RNSecureRandom (1.0.0):
- React - React
- RNShare (3.8.5): - RNShare (3.8.5):
- React-Core - React-Core
- RNSVG (12.1.0): - RNSVG (12.1.0):
- React - React
- RNTooltips (1.0.2): - RNTooltips (1.0.3):
- pop (~> 1.0) - pop (~> 1.0)
- React - React
- SexyTooltip - SexyTooltip
- RNVectorIcons (7.1.0): - RNVectorIcons (8.1.0):
- React - React-Core
- SDWebImage (5.11.0): - SDWebImage (5.11.0):
- SDWebImage/Core (= 5.11.0) - SDWebImage/Core (= 5.11.0)
- SDWebImage/Core (5.11.0) - SDWebImage/Core (5.11.0)
@@ -429,7 +428,6 @@ DEPENDENCIES:
- react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`) - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
- react-native-sodium (from `../node_modules/react-native-sodium`) - react-native-sodium (from `../node_modules/react-native-sodium`)
- react-native-splash-screen (from `../node_modules/react-native-splash-screen`) - react-native-splash-screen (from `../node_modules/react-native-splash-screen`)
- "react-native-viewpager (from `../node_modules/@react-native-community/viewpager`)"
- react-native-webview (from `../node_modules/react-native-webview`) - react-native-webview (from `../node_modules/react-native-webview`)
- React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`) - React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`)
- React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`) - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`)
@@ -542,8 +540,6 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-sodium" :path: "../node_modules/react-native-sodium"
react-native-splash-screen: react-native-splash-screen:
:path: "../node_modules/react-native-splash-screen" :path: "../node_modules/react-native-splash-screen"
react-native-viewpager:
:path: "../node_modules/@react-native-community/viewpager"
react-native-webview: react-native-webview:
:path: "../node_modules/react-native-webview" :path: "../node_modules/react-native-webview"
React-perflogger: React-perflogger:
@@ -627,10 +623,10 @@ CHECKOUT OPTIONS:
SPEC CHECKSUMS: SPEC CHECKSUMS:
Base64: cecfb41a004124895a7bcee567a89bae5a89d49b Base64: cecfb41a004124895a7bcee567a89bae5a89d49b
boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c
DoubleConversion: cde416483dac037923206447da6e1454df403714 DoubleConversion: cf9b38bf0b2d048436d9a82ad2abe1404f11e7de
FBLazyVector: 49cbe4b43e445b06bf29199b6ad2057649e4c8f5 FBLazyVector: e686045572151edef46010a6f819ade377dfeb4b
FBReactNativeSpec: 0dbfb4e1873b058cd9f25e5af95ee37ad357727a FBReactNativeSpec: 10138b08c441040e15bd78818340ab6fe45d73ac
glog: 40a13f7840415b9a77023fbcae0f1e6f43192af3 glog: 73c2498ac6884b13ede40eda8228cb1eee9d9d62
hermes-engine: 7d97ba46a1e29bacf3e3c61ecb2804a5ddd02d4f hermes-engine: 7d97ba46a1e29bacf3e3c61ecb2804a5ddd02d4f
libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913 libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
libwebp: e90b9c01d99205d03b6bb8f2c8c415e5a4ef66f0 libwebp: e90b9c01d99205d03b6bb8f2c8c415e5a4ef66f0
@@ -639,21 +635,21 @@ SPEC CHECKSUMS:
Permission-PhotoLibrary: cb9cdc1e3744e26ab404297a8e289d50c8ee27e8 Permission-PhotoLibrary: cb9cdc1e3744e26ab404297a8e289d50c8ee27e8
pop: d582054913807fd11fd50bfe6a539d91c7e1a55a pop: d582054913807fd11fd50bfe6a539d91c7e1a55a
RCT-Folly: ec7a233ccc97cc556cf7237f0db1ff65b986f27c RCT-Folly: ec7a233ccc97cc556cf7237f0db1ff65b986f27c
RCTRequired: 2f8cb5b7533219bf4218a045f92768129cf7050a RCTRequired: 6d3e854f0e7260a648badd0d44fc364bc9da9728
RCTTypeSafety: 512728b73549e72ad7330b92f3d42936f2a4de5b RCTTypeSafety: c1f31d19349c6b53085766359caac425926fafaa
React: 98eac01574128a790f0bbbafe2d1a8607291ac24 React: bda6b6d7ae912de97d7a61aa5c160db24aa2ad69
React-callinvoker: def3f7fae16192df68d9b69fd4bbb59092ee36bc React-callinvoker: 9840ea7e8e88ed73d438edb725574820b29b5baa
React-Core: 70a52aa5dbe9b83befae82038451a7df9fd54c5a React-Core: b5e385da7ce5f16a220fc60fd0749eae2c6120f0
React-CoreModules: 052edef46117862e2570eb3a0f06d81c61d2c4b8 React-CoreModules: 17071a4e2c5239b01585f4aa8070141168ab298f
React-cxxreact: c1dc71b30653cfb4770efdafcbdc0ad6d388baab React-cxxreact: 9be7b6340ed9f7c53e53deca7779f07cd66525ba
React-jsi: 74341196d9547cbcbcfa4b3bbbf03af56431d5a1 React-jsi: 67747b9722f6dab2ffe15b011bcf6b3f2c3f1427
React-jsiexecutor: 06a9c77b56902ae7ffcdd7a4905f664adc5d237b React-jsiexecutor: 80c46bd381fd06e418e0d4f53672dc1d1945c4c3
React-jsinspector: 0ae35a37b20d5e031eb020a69cc5afdbd6406301 React-jsinspector: cc614ec18a9ca96fd275100c16d74d62ee11f0ae
react-native-background-actions: 38b3f9e94c92349acf27873c952793e09a92cbb1 react-native-background-actions: 38b3f9e94c92349acf27873c952793e09a92cbb1
react-native-begin-background-task: 3b889e07458afc5822a7277cf9cbc7cd077e39ee react-native-begin-background-task: 3b889e07458afc5822a7277cf9cbc7cd077e39ee
react-native-document-picker: c9cbeb5445188a805ab19fa4061115d38fe1ea63 react-native-document-picker: c9cbeb5445188a805ab19fa4061115d38fe1ea63
react-native-fingerprint-scanner: be63e626b31fb951780a5fac5328b065a61a3d6e react-native-fingerprint-scanner: be63e626b31fb951780a5fac5328b065a61a3d6e
react-native-get-random-values: 1404bd5cc0ab0e287f75ee1c489555688fc65f89 react-native-get-random-values: 237bffb1c7e05fb142092681531810a29ba53015
react-native-html-to-pdf-lite: 21bfb169bf4cbcd7bec9f736975ee1b3f5292d4a react-native-html-to-pdf-lite: 21bfb169bf4cbcd7bec9f736975ee1b3f5292d4a
react-native-image-picker: 64d12e81f3d9dad0af107fe6536b295d51932ec0 react-native-image-picker: 64d12e81f3d9dad0af107fe6536b295d51932ec0
react-native-keep-awake: e63964d58c890de02bfb6519dedb7d90b5c782de react-native-keep-awake: e63964d58c890de02bfb6519dedb7d90b5c782de
@@ -663,24 +659,23 @@ SPEC CHECKSUMS:
react-native-safe-area-context: b6e0e284002381d2ff29fa4fff42b4d8282e3c94 react-native-safe-area-context: b6e0e284002381d2ff29fa4fff42b4d8282e3c94
react-native-sodium: c7587732667e1cdb7d0d77c2aa2e98420aad2036 react-native-sodium: c7587732667e1cdb7d0d77c2aa2e98420aad2036
react-native-splash-screen: 200d11d188e2e78cea3ad319964f6142b6384865 react-native-splash-screen: 200d11d188e2e78cea3ad319964f6142b6384865
react-native-viewpager: ea945e2881ce9a4a8bcdc84de4ec65ff23c90f6e
react-native-webview: 4dfb534e9600b87fe667c5ca4fe09149383218b9 react-native-webview: 4dfb534e9600b87fe667c5ca4fe09149383218b9
React-perflogger: 9c547d8f06b9bf00cb447f2b75e8d7f19b7e02af React-perflogger: 25373e382fed75ce768a443822f07098a15ab737
React-RCTActionSheet: 3080b6e12e0e1a5b313c8c0050699b5c794a1b11 React-RCTActionSheet: af7796ba49ffe4ca92e7277a5d992d37203f7da5
React-RCTAnimation: 3f96f21a497ae7dabf4d2f150ee43f906aaf516f React-RCTAnimation: 6a2e76ab50c6f25b428d81b76a5a45351c4d77aa
React-RCTBlob: 283b8e5025e7f954176bc48164f846909002f3ed React-RCTBlob: 02a2887023e0eed99391b6445b2e23a2a6f9226d
React-RCTImage: 5088a484faac78f2d877e1b79125d3bb1ea94a16 React-RCTImage: ce5bf8e7438f2286d9b646a05d6ab11f38b0323d
React-RCTLinking: 5e8fbb3e9a8bc2e4e3eb15b1eb8bda5fcac27b8c React-RCTLinking: ccd20742de14e020cb5f99d5c7e0bf0383aefbd9
React-RCTNetwork: 38ec277217b1e841d5e6a1fa78da65b9212ccb28 React-RCTNetwork: dfb9d089ab0753e5e5f55fc4b1210858f7245647
React-RCTSettings: 242d6e692108c3de4f3bb74b7586a8799e9ab070 React-RCTSettings: b14aef2d83699e48b410fb7c3ba5b66cd3291ae2
React-RCTText: 8746736ac8eb5a4a74719aa695b7a236a93a83d2 React-RCTText: 41a2e952dd9adc5caf6fb68ed46b275194d5da5f
React-RCTVibration: 0fd6b21751a33cb72fce1a4a33ab9678416d307a React-RCTVibration: 24600e3b1aaa77126989bc58b6747509a1ba14f3
React-runtimeexecutor: cad74a1eaa53ee6e7a3620231939d8fe2c6afcf0 React-runtimeexecutor: a9904c6d0218fb9f8b19d6dd88607225927668f9
ReactCommon: cfe2b7fd20e0dbd2d1185cd7d8f99633fbc5ff05 ReactCommon: 149906e01aa51142707a10665185db879898e966
rn-extensions-share: 3f0ecce20dfbca1f0358deb4ebfb9ee121a6d92a rn-extensions-share: 3f0ecce20dfbca1f0358deb4ebfb9ee121a6d92a
rn-fetch-blob: f065bb7ab7fb48dd002629f8bdcb0336602d3cba rn-fetch-blob: f065bb7ab7fb48dd002629f8bdcb0336602d3cba
RNCCheckbox: 80ee60cd2e67b46986e8e244db520655372deab4 RNCCheckbox: 80ee60cd2e67b46986e8e244db520655372deab4
RNCMaskedView: 5a8ec07677aa885546a0d98da336457e2bea557f RNCMaskedView: 0e1bc4bfa8365eba5fbbb71e07fbdc0555249489
RNDeviceInfo: 87d2d175c760f6bcf58acd036f887e8b2392802c RNDeviceInfo: 87d2d175c760f6bcf58acd036f887e8b2392802c
RNExitApp: c4e052df2568b43bec8a37c7cd61194d4cfee2c3 RNExitApp: c4e052df2568b43bec8a37c7cd61194d4cfee2c3
RNFastImage: d4870d58f5936111c56218dbd7fcfc18e65b58ff RNFastImage: d4870d58f5936111c56218dbd7fcfc18e65b58ff
@@ -691,18 +686,18 @@ SPEC CHECKSUMS:
RNKeychain: 840f8e6f13be0576202aefcdffd26a4f54bfe7b5 RNKeychain: 840f8e6f13be0576202aefcdffd26a4f54bfe7b5
RNPermissions: 99dd8d4a30ff13509b949ca63cd1f69edc461775 RNPermissions: 99dd8d4a30ff13509b949ca63cd1f69edc461775
RNPrivacySnapshot: 8eaf571478a353f2e5184f5c803164f22428b023 RNPrivacySnapshot: 8eaf571478a353f2e5184f5c803164f22428b023
RNReanimated: e03f7425cb7a38dcf1b644d680d1bfc91c3337ad RNReanimated: 514a11da3a2bcc6c3dfd9de32b38e2b9bf101926
RNScreens: f7ad633b2e0190b77b6a7aab7f914fad6f198d8d RNScreens: bf59f17fbf001f1025243eeed5f19419d3c11ef2
RNSecureRandom: 0dcee021fdb3d50cd5cee5db0ebf583c42f5af0e RNSecureRandom: 0dcee021fdb3d50cd5cee5db0ebf583c42f5af0e
RNShare: 7e22ba3bf66294ff7c122a1f2da8a8ec642091a0 RNShare: 7e22ba3bf66294ff7c122a1f2da8a8ec642091a0
RNSVG: ce9d996113475209013317e48b05c21ee988d42e RNSVG: ce9d996113475209013317e48b05c21ee988d42e
RNTooltips: e13180e4339e2a85daabd09507f62a5a32d3dc8a RNTooltips: 47a992eb7b12f624e5a8a40f0990fbef49dcb83e
RNVectorIcons: bc69e6a278b14842063605de32bec61f0b251a59 RNVectorIcons: 31cebfcf94e8cf8686eb5303ae0357da64d7a5a4
SDWebImage: 7acbb57630ac7db4a495547fb73916ff3e432f6b SDWebImage: 7acbb57630ac7db4a495547fb73916ff3e432f6b
SDWebImageWebPCoder: d0dac55073088d24b2ac1b191a71a8f8d0adac21 SDWebImageWebPCoder: d0dac55073088d24b2ac1b191a71a8f8d0adac21
SexyTooltip: 5c9b4dec52bfb317938cb0488efd9da3717bb6fd SexyTooltip: 5c9b4dec52bfb317938cb0488efd9da3717bb6fd
toolbar-android: 85f3ef4d691469f2d304e7dee4bca013aa1ba1ff toolbar-android: 85f3ef4d691469f2d304e7dee4bca013aa1ba1ff
Yoga: 8c8436d4171c87504c648ae23b1d81242bdf3bbf Yoga: 575c581c63e0d35c9a83f4b46d01d63abc1100ac
PODFILE CHECKSUM: b0855a87f6220ed2901b0f35ebbd45aa7795a696 PODFILE CHECKSUM: b0855a87f6220ed2901b0f35ebbd45aa7795a696

4
apps/mobile/src/components/Container/ContainerBottomButton.js
View File

@@ -10,6 +10,7 @@ import {editing, getElevation, showContext, showTooltip, TOOLTIP_POSITIONS} from
import {normalize, SIZE} from '../../utils/SizeUtils'; import {normalize, SIZE} from '../../utils/SizeUtils';
import {PressableButton} from '../PressableButton'; import {PressableButton} from '../PressableButton';
import RNTooltips from 'react-native-tooltips'; import RNTooltips from 'react-native-tooltips';
import { useSettingStore } from '../../provider/stores';
const translateY = new Animated.Value(0); const translateY = new Animated.Value(0);
export const ContainerBottomButton = ({ export const ContainerBottomButton = ({
@@ -19,6 +20,7 @@ export const ContainerBottomButton = ({
shouldShow = false, shouldShow = false,
}) => { }) => {
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
const deviceMode = useSettingStore(state => state.deviceMode)
function animate(translate) { function animate(translate) {
Animated.timing(translateY, { Animated.timing(translateY, {
@@ -51,7 +53,7 @@ export const ContainerBottomButton = ({
}; };
}, []); }, []);
return DDS.isLargeTablet() && !shouldShow ? null : ( return deviceMode !== "mobile" && !shouldShow ? null : (
<Animated.View <Animated.View
style={{ style={{
position: 'absolute', position: 'absolute',

430
apps/mobile/src/components/CustomTabs/index.js
View File

@@ -1,211 +1,241 @@
import React, { Component, createRef } from 'react'; import React, {Component, createRef} from 'react';
import { FlatList, TextInput, View } from 'react-native'; import {Platform} from 'react-native';
import { editing } from '../../utils'; import {FlatList, TextInput, View} from 'react-native';
import {editing} from '../../utils';
export default class CustomTabs extends Component { export default class CustomTabs extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.listRef = createRef(); this.listRef = createRef();
this.scrollOffset = props.initialIndex === 0 ? 0 : this.props.offsets.a; this.scrollOffset = this.props.offsets.a;
this.page = 0; this.page = 0;
this.nextPage = 0; this.nextPage = 0;
this.currentDrawerState = false; this.currentDrawerState = false;
this.inputElement = createRef(); this.inputElement = createRef();
this.keyboardState = false; this.keyboardState = false;
this.scrollTimeout = null; this.scrollTimeout = null;
this.scrollEnabled = true; this.scrollEnabled = true;
this.responderAllowedScroll = false; this.responderAllowedScroll = false;
} this.moved = false;
this.lastOffset = this.props.offsets.a;
}
renderItem = ({item, index}) => this.props.items[index];
renderItem = ({item, index}) => this.props.items[index];
onMoveShouldSetResponder = event => {
if (this.responderAllowedScroll) return; onMoveShouldSetResponder = event => {
let x = event.nativeEvent.pageX; if (this.responderAllowedScroll) return;
let y = event.nativeEvent.pageY; this.lastOffset = this.scrollOffset;
this.hideKeyboardIfVisible(); let x = event.nativeEvent.pageX;
let cOffset = this.scrollOffset.toFixed(0); let y = event.nativeEvent.pageY;
let pOffset = this.props.offsets.b.toFixed(0); this.hideKeyboardIfVisible();
let heightCheck = !editing.tooltip let cOffset = this.scrollOffset.toFixed(0);
? this.props.dimensions.height - 70 let pOffset = this.props.offsets.b.toFixed(0);
: this.props.dimensions.height - 140; let heightCheck = !editing.tooltip
? this.props.dimensions.height - 70
if (cOffset > pOffset - 50) { : this.props.dimensions.height - 140;
if (x > 50 || y > heightCheck) {
this.responderAllowedScroll = false; if (cOffset > pOffset - 50) {
this.setScrollEnabled(false); if (x > 50 || y > heightCheck) {
return; this.responderAllowedScroll = false;
} else { this.setScrollEnabled(false);
this.responderAllowedScroll = true; return;
this.setScrollEnabled(true); } else {
return; this.responderAllowedScroll = true;
} this.setScrollEnabled(true);
return;
} }
this.responderAllowedScroll = true; }
}; this.responderAllowedScroll = true;
};
openDrawer = () => {
if (this.page === 0) { openDrawer = () => {
if (this.page === 0) {
if (this.scrollOffset === 0) {
this.goToIndex(1);
} else {
this.goToIndex(0); this.goToIndex(0);
} }
};
closeDrawer = () => {
if (this.page === 0) {
this.goToIndex(1);
}
};
hideKeyboardIfVisible() {
if (this.nextPage === 1) return;
if ((editing.keyboardState || editing.isFocused) && this.scrollOffset < this.props.offsets.b - 50) {
editing.isFocused = false;
editing.keyboardState = false;
this.inputElement.current?.focus();
this.inputElement.current?.blur();
}
} }
};
goToIndex(index, animated = true) {
if (index === 1) { closeDrawer = () => {
this.nextPage = 0; if (this.page === 0) {
} else if (index === 2) { this.goToIndex(1);
this.nextPage = 1
} else {
this.nextPage = 0;
}
this.listRef.current?.scrollToIndex({
animated: animated,
index: index,
viewOffset: 0,
viewPosition: 0,
});
} }
};
setScrollEnabled = enabled => {
this.scrollEnabled = enabled; hideKeyboardIfVisible(close) {
this.listRef.current?.getNativeScrollRef().setNativeProps({ if (!close && this.nextPage === 1) return;
scrollEnabled: enabled, if (Platform.OS === 'ios') return;
});
}; if (
(editing.keyboardState || editing.isFocused) &&
onTouchEnd = () => { this.scrollOffset < this.props.offsets.b - 50
this.responderAllowedScroll = false; ) {
this.setScrollEnabled(true) editing.isFocused = false;
editing.keyboardState = false;
}; this.inputElement.current?.focus();
this.inputElement.current?.blur();
onScroll = event => {
this.scrollOffset = event.nativeEvent.contentOffset.x;
if (this.page === 1) {
this.hideKeyboardIfVisible();
}
this.props.onScroll(this.scrollOffset);
if (this.scrollTimeout) {
clearTimeout(this.scrollTimeout);
this.scrollTimeout = null;
}
this.scrollTimeout = setTimeout(() => {
if (
this.scrollOffset !== this.props.offsets.a &&
this.page === 1 &&
!this.scrollEnabled
) {
this.goToIndex(2, false);
}
}, 300);
};
goToPage = page => {
this.nextPage = page;
if (page === 0) {
this.scrollOffset = this.props.offsets.a;
this.hideKeyboardIfVisible();
this.goToIndex(1);
} else if (page === 1) {
this.goToIndex(2);
}
if (this.page !== page) {
this.props.onChangeTab({i: page, from: this.page});
this.page = page;
}
};
keyExtractor = (item, index) => item;
onScrollEnd = event => {
this.responderAllowedScroll = false;
let page = 0;
if (this.scrollOffset > this.props.offsets.b - 50) {
page = 1;
} else {
this.hideKeyboardIfVisible();
}
let drawerState = page === 0 && this.scrollOffset < 10;
if (drawerState !== this.currentDrawerState) {
this.currentDrawerState = drawerState;
this.props.onDrawerStateChange(this.currentDrawerState);
}
if (this.page !== page) {
this.props.onChangeTab({i: page, from: this.page});
this.page = page;
}
};
render() {
return (
<View
onTouchEnd={this.onTouchEnd}
onMoveShouldSetResponderCapture={this.onMoveShouldSetResponder}
onStartShouldSetResponderCapture={this.onMoveShouldSetResponder}
style={{
flex: 1,
}}>
<TextInput
ref={this.inputElement}
style={{height: 1, padding: 0, width: 1, position: 'absolute'}}
blurOnSubmit={false}
/>
<FlatList
ref={this.listRef}
horizontal
onMomentumScrollEnd={this.onScrollEnd}
onScrollAnimationEnd={this.onScrollEnd}
keyExtractor={this.keyExtractor}
onScroll={this.onScroll}
bounces={false}
bouncesZoom={false}
initialNumToRender={100}
alwaysBounceHorizontal={false}
scrollToOverflowEnabled={false}
scrollsToTop={false}
scrollEventThrottle={1}
directionalLockEnabled
maintainVisibleContentPosition={true}
overScrollMode="never"
maxToRenderPerBatch={100}
removeClippedSubviews={false}
keyboardDismissMode="none"
keyboardShouldPersistTaps="always"
showsHorizontalScrollIndicator={false}
disableIntervalMomentum={true}
snapToOffsets={[
this.props.offsets.a,
this.props.offsets.b,
this.props.offsets.c,
]}
initialScrollIndex={this.props.initialIndex}
data={['drawer', 'navigation', 'editor']}
renderItem={this.renderItem}
/>
</View>
);
} }
} }
CustomTabs.defaultProps = { goToIndex(index, animated = true) {
onDrawerStateChange:() => {} let offset = 0;
if (index === 1) {
this.nextPage = 0;
offset = this.props.offsets.a;
} else if (index === 2) {
this.nextPage = 1;
offset = this.props.offsets.b;
} else {
offset = 0;
this.nextPage = 0;
}
this.listRef.current?.scrollToOffset({
offset: offset,
animated: animated,
});
} }
setScrollEnabled = enabled => {
this.scrollEnabled = enabled;
this.listRef.current?.getNativeScrollRef().setNativeProps({
scrollEnabled: enabled,
});
};
onTouchEnd = () => {
this.responderAllowedScroll = false;
this.setScrollEnabled(true);
};
onScroll = event => {
this.moved = true;
this.scrollOffset = event.nativeEvent.contentOffset.x;
this.props.onScroll(this.scrollOffset);
if (this.scrollTimeout) {
clearTimeout(this.scrollTimeout);
this.scrollTimeout = null;
}
this.scrollTimeout = setTimeout(() => {
if (
this.scrollOffset !== this.props.offsets.a &&
this.page === 1 &&
!this.scrollEnabled
) {
this.goToIndex(2, false);
}
}, 300);
};
goToPage = page => {
this.nextPage = page;
if (page === 0) {
this.scrollOffset = this.props.offsets.a;
this.hideKeyboardIfVisible();
this.goToIndex(1);
} else if (page === 1) {
this.goToIndex(2);
}
if (this.page !== page) {
this.props.onChangeTab({i: page, from: this.page});
this.page = page;
}
};
keyExtractor = (item, index) => item;
onScrollEnd = event => {
this.moved = false;
this.responderAllowedScroll = false;
let page = 0;
if (this.scrollOffset > this.props.offsets.b - 50) {
page = 1;
} else {
this.nextPage = 0;
this.hideKeyboardIfVisible();
}
let drawerState = page === 0 && this.scrollOffset < 10;
if (drawerState !== this.currentDrawerState) {
this.currentDrawerState = drawerState;
this.props.onDrawerStateChange(this.currentDrawerState);
}
console.log(this.scrollOffset, this.props.offsets.a);
this.props.toggleOverlay(
Math.floor(this.scrollOffset) < Math.floor(this.props.offsets.a - 10)
? true
: false,
);
if (this.page !== page) {
this.props.onChangeTab({i: page, from: this.page});
this.page = page;
}
};
onListTouchEnd = event => {
if (this.lastOffset < 30 && event) {
if (event.nativeEvent.pageX > this.props.dimensions.width * 0.75) {
this.goToIndex(1);
}
}
};
render() {
return (
<View
onTouchEnd={this.onTouchEnd}
onMoveShouldSetResponderCapture={this.onMoveShouldSetResponder}
onStartShouldSetResponderCapture={this.onMoveShouldSetResponder}
style={{
flex: 1,
}}>
<TextInput
ref={this.inputElement}
style={{height: 1, padding: 0, width: 1, position: 'absolute'}}
blurOnSubmit={false}
/>
<FlatList
ref={this.listRef}
horizontal
onMomentumScrollEnd={this.onScrollEnd}
onScrollAnimationEnd={this.onScrollEnd}
keyExtractor={this.keyExtractor}
onScroll={this.onScroll}
bounces={false}
bouncesZoom={false}
onTouchEnd={this.onListTouchEnd}
initialNumToRender={100}
alwaysBounceHorizontal={false}
scrollToOverflowEnabled={false}
scrollsToTop={false}
scrollEventThrottle={1}
directionalLockEnabled
overScrollMode="never"
maxToRenderPerBatch={100}
removeClippedSubviews={false}
keyboardDismissMode="none"
keyboardShouldPersistTaps="always"
showsHorizontalScrollIndicator={false}
disableIntervalMomentum={true}
decelerationRate="fast"
snapToAlignment="start"
snapToOffsets={[
this.props.offsets.a,
this.props.offsets.b,
this.props.offsets.c,
]}
contentOffset={{
x: this.props.offsets.a,
}}
data={['drawer', 'navigation', 'editor']}
renderItem={this.renderItem}
/>
</View>
);
}
}
CustomTabs.defaultProps = {
onDrawerStateChange: () => {},
};

2
apps/mobile/src/components/Header/HeaderLeftMenu.js
View File

@@ -23,7 +23,7 @@ export const HeaderLeftMenu = ({currentScreen,headerMenuState}) => {
return ( return (
<> <>
{deviceMode === 'mobile' || {deviceMode !== "tablet" ||
currentScreen === 'Search' || currentScreen === 'Search' ||
!headerMenuState ? ( !headerMenuState ? (
<ActionIcon <ActionIcon

21
apps/mobile/src/components/Header/HeaderRightMenu.js
View File

@@ -1,18 +1,19 @@
import React from 'react'; import React from 'react';
import { ActivityIndicator, StyleSheet, View } from 'react-native'; import {ActivityIndicator, StyleSheet, View} from 'react-native';
import { notesnook } from '../../../e2e/test.ids'; import {notesnook} from '../../../e2e/test.ids';
import { useTracked } from '../../provider'; import {useTracked} from '../../provider';
import { useUserStore } from '../../provider/stores'; import {useSettingStore, useUserStore} from '../../provider/stores';
import { DDS } from '../../services/DeviceDetection'; import {DDS} from '../../services/DeviceDetection';
import Navigation from '../../services/Navigation'; import Navigation from '../../services/Navigation';
import { SIZE } from '../../utils/SizeUtils'; import {SIZE} from '../../utils/SizeUtils';
import { ActionIcon } from '../ActionIcon'; import {ActionIcon} from '../ActionIcon';
import { Button } from '../Button'; import {Button} from '../Button';
export const HeaderRightMenu = ({currentScreen,action}) => { export const HeaderRightMenu = ({currentScreen, action}) => {
const [state] = useTracked(); const [state] = useTracked();
const {colors} = state; const {colors} = state;
const syncing = useUserStore(state => state.syncing); const syncing = useUserStore(state => state.syncing);
const deviceMode = useSettingStore(state => state.deviceMode);
return ( return (
<View style={styles.rightBtnContainer}> <View style={styles.rightBtnContainer}>
@@ -33,7 +34,7 @@ export const HeaderRightMenu = ({currentScreen,action}) => {
/> />
)} )}
{DDS.isLargeTablet() ? ( {deviceMode !== "mobile" ? (
<Button <Button
onPress={action} onPress={action}
testID={notesnook.ids.default.addBtn} testID={notesnook.ids.default.addBtn}

6
apps/mobile/src/components/SimpleList/announcement.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 { useTracked } from '../../provider'; import { useTracked } from '../../provider';
import { useSelectionStore } from '../../provider/stores'; import { useMessageStore, useSelectionStore } from '../../provider/stores';
import { eSendEvent } from '../../services/EventManager'; import { eSendEvent } from '../../services/EventManager';
import { eOpenPremiumDialog } from '../../utils/Events'; import { eOpenPremiumDialog } from '../../utils/Events';
import { openLinkInBrowser } from '../../utils/functions'; import { openLinkInBrowser } from '../../utils/functions';
@@ -11,9 +11,11 @@ import Seperator from '../Seperator';
import Heading from '../Typography/Heading'; import Heading from '../Typography/Heading';
import Paragraph from '../Typography/Paragraph'; import Paragraph from '../Typography/Paragraph';
export const Announcement = ({announcement,remove}) => { export const Announcement = () => {
const [state] = useTracked(); const [state] = useTracked();
const colors = state.colors; const colors = state.colors;
const announcement = useMessageStore().announcement;
const remove = useMessageStore().remove;
const selectionMode = useSelectionStore(state => state.selectionMode); const selectionMode = useSelectionStore(state => state.selectionMode);

3
apps/mobile/src/components/SimpleList/card.js
View File

@@ -8,9 +8,10 @@ import { getElevation } from '../../utils';
import { SIZE } from '../../utils/SizeUtils'; import { SIZE } from '../../utils/SizeUtils';
import Paragraph from '../Typography/Paragraph'; import Paragraph from '../Typography/Paragraph';
export const Card = ({color, announcement}) => {; export const Card = ({color}) => {;
const selectionMode = useSelectionStore(state => state.selectionMode); const selectionMode = useSelectionStore(state => state.selectionMode);
const messageBoardState = useMessageStore(state => state.message); const messageBoardState = useMessageStore(state => state.message);
const announcement = useMessageStore().announcement;
return !messageBoardState.visible || selectionMode || announcement ? null : ( return !messageBoardState.visible || selectionMode || announcement ? null : (
<TouchableOpacity <TouchableOpacity

19
apps/mobile/src/components/SimpleList/header.js
View File

@@ -1,6 +1,7 @@
import React from 'react'; import React from 'react';
import {View} from 'react-native'; import {View} from 'react-native';
import {useTracked} from '../../provider'; import {useTracked} from '../../provider';
import {useMessageStore} from '../../provider/stores';
import {DDS} from '../../services/DeviceDetection'; import {DDS} from '../../services/DeviceDetection';
import {COLORS_NOTE} from '../../utils/Colors'; import {COLORS_NOTE} from '../../utils/Colors';
import {hexToRGBA} from '../../utils/ColorUtils'; import {hexToRGBA} from '../../utils/ColorUtils';
@@ -9,6 +10,7 @@ import {Button} from '../Button';
import {Placeholder} from '../ListPlaceholders'; import {Placeholder} from '../ListPlaceholders';
import Heading from '../Typography/Heading'; import Heading from '../Typography/Heading';
import Paragraph from '../Typography/Paragraph'; import Paragraph from '../Typography/Paragraph';
import {Announcement} from './announcement';
import {Card} from './card'; import {Card} from './card';
export const Header = React.memo( export const Header = React.memo(
@@ -22,13 +24,14 @@ export const Header = React.memo(
shouldShow = false, shouldShow = false,
icon, icon,
screen, screen,
announcement,
}) => { }) => {
const [state] = useTracked(); const [state] = useTracked();
const {colors} = state; const {colors} = state;
const announcement = useMessageStore().announcement;
return type === 'search' ? null : (DDS.isLargeTablet() && !shouldShow) || return announcement ? (
announcement ? ( <Announcement color={color || colors.accent} />
) : type === 'search' ? null : DDS.isLargeTablet() && !shouldShow ? (
<View <View
style={{ style={{
minHeight: 50, minHeight: 50,
@@ -39,10 +42,7 @@ export const Header = React.memo(
alignItems: 'center', alignItems: 'center',
}}> }}>
{messageCard && ( {messageCard && (
<Card <Card color={COLORS_NOTE[title.toLowerCase()] || colors.accent} />
announcement={announcement}
color={COLORS_NOTE[title.toLowerCase()] || colors.accent}
/>
)} )}
</View> </View>
) : ( ) : (
@@ -51,10 +51,7 @@ export const Header = React.memo(
width: '100%', width: '100%',
}}> }}>
{messageCard && ( {messageCard && (
<Card <Card color={COLORS_NOTE[title.toLowerCase()] || colors.accent} />
announcement={announcement}
color={COLORS_NOTE[title.toLowerCase()] || colors.accent}
/>
)} )}
<View <View
style={{ style={{

54
apps/mobile/src/components/SimpleList/index.js
View File

@@ -1,21 +1,21 @@
import React, { useEffect, useRef, useState } from 'react'; import React, {useEffect, useRef, useState} from 'react';
import { FlatList, RefreshControl } from 'react-native'; import {FlatList, RefreshControl} from 'react-native';
import { useTracked } from '../../provider'; import {useTracked} from '../../provider';
import { eSendEvent } from '../../services/EventManager'; import {eSendEvent} from '../../services/EventManager';
import SettingsService from '../../services/SettingsService'; import SettingsService from '../../services/SettingsService';
import Sync from '../../services/Sync'; import Sync from '../../services/Sync';
import { COLORS_NOTE } from '../../utils/Colors'; import {COLORS_NOTE} from '../../utils/Colors';
import { eScrollEvent } from '../../utils/Events'; import {eScrollEvent} from '../../utils/Events';
import useAnnouncement from '../../utils/useAnnouncement'; import useAnnouncement from '../../utils/useAnnouncement';
import JumpToDialog from '../JumpToDialog'; import JumpToDialog from '../JumpToDialog';
import { NotebookWrapper } from '../NotebookItem/wrapper'; import {NotebookWrapper} from '../NotebookItem/wrapper';
import { NoteWrapper } from '../NoteItem/wrapper'; import {NoteWrapper} from '../NoteItem/wrapper';
import TagItem from '../TagItem'; import TagItem from '../TagItem';
import { Announcement } from './announcement'; import {Announcement} from './announcement';
import { Empty } from './empty'; import {Empty} from './empty';
import { Footer } from './footer'; import {Footer} from './footer';
import { Header } from './header'; import {Header} from './header';
import { SectionHeader } from './section-header'; import {SectionHeader} from './section-header';
const heights = { const heights = {
note: 100, note: 100,
@@ -62,7 +62,6 @@ const SimpleList = ({
const [dataProvider, setDataProvider] = useState([]); const [dataProvider, setDataProvider] = useState([]);
const scrollRef = useRef(); const scrollRef = useRef();
const [announcement, remove] = useAnnouncement();
const [_loading, _setLoading] = useState(true); const [_loading, _setLoading] = useState(true);
const RenderItem = renderItems[type]; const RenderItem = renderItems[type];
const refreshing = false; const refreshing = false;
@@ -172,25 +171,14 @@ const SimpleList = ({
} }
ListFooterComponent={<Footer />} ListFooterComponent={<Footer />}
ListHeaderComponent={ ListHeaderComponent={
announcement ? ( <Header
<Announcement title={headerProps.heading}
announcement={announcement} paragraph={headerProps.paragraph}
remove={remove} onPress={headerProps.onPress}
color={ icon={headerProps.icon}
COLORS_NOTE[headerProps.heading?.toLowerCase()] || colors.accent type={type}
} screen={screen}
/> />
) : (
<Header
title={headerProps.heading}
paragraph={headerProps.paragraph}
onPress={headerProps.onPress}
icon={headerProps.icon}
type={type}
announcement={announcement}
screen={screen}
/>
)
} }
/> />

130
apps/mobile/src/components/SimpleList/sectionheader.js
View File

@@ -1,73 +1,67 @@
import React from 'react'; import React from 'react';
import { import {TouchableOpacity, useWindowDimensions, View} from 'react-native';
TouchableOpacity, import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
useWindowDimensions, import {useTracked} from '../../provider';
View import {eSendEvent} from '../../services/EventManager';
} from 'react-native'; import {eOpenJumpToDialog} from '../../utils/Events';
import { TouchableWithoutFeedback } from 'react-native-gesture-handler'; import {SIZE} from '../../utils/SizeUtils';
import { useTracked } from '../../provider'; import {HeaderMenu} from '../Header/HeaderMenu';
import {
eSendEvent
} from '../../services/EventManager';
import { eOpenJumpToDialog } from '../../utils/Events';
import { SIZE } from '../../utils/SizeUtils';
import { HeaderMenu } from '../Header/HeaderMenu';
import Heading from '../Typography/Heading'; import Heading from '../Typography/Heading';
export const SectionHeader = ({ export const SectionHeader = ({
item, item,
index, index,
headerProps, headerProps,
jumpToDialog, jumpToDialog,
sortMenuButton, sortMenuButton,
}) => { }) => {
const [state] = useTracked(); const [state] = useTracked();
const {colors} = state; const {colors} = state;
const {fontScale} = useWindowDimensions(); const {fontScale} = useWindowDimensions();
return ( return (
<View <View
style={{ style={{
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
width: '100%', width: '100%',
justifyContent: 'space-between', justifyContent: 'space-between',
paddingHorizontal: 12, paddingHorizontal: 12,
height: 30 * fontScale, height: 30 * fontScale,
backgroundColor: backgroundColor:
index === 0 index === 0
? headerProps.color ? headerProps.color
? colors[headerProps.color] ? colors[headerProps.color]
: colors.shade : colors.shade
: colors.nav, : colors.nav,
marginTop: index === 0 ? 0 : 5 * fontScale, marginTop: index === 0 ? 0 : 5 * fontScale,
}}> }}>
<TouchableOpacity <TouchableOpacity
onPress={() => { onPress={() => {
console.log('called') console.log('called');
if (jumpToDialog) { if (jumpToDialog) {
console.log('sending event') console.log('sending event');
eSendEvent(eOpenJumpToDialog); eSendEvent(eOpenJumpToDialog);
} }
}} }}
activeOpacity={0.9} activeOpacity={0.9}
hitSlop={{top: 10, left: 10, right: 30, bottom: 15}} hitSlop={{top: 10, left: 10, right: 30, bottom: 15}}
style={{ style={{
height: '100%', height: '100%',
justifyContent: 'center', justifyContent: 'center',
}}> }}>
<Heading <Heading
color={colors.accent} color={colors.accent}
size={SIZE.sm} size={SIZE.sm}
style={{ style={{
minWidth: 60, minWidth: 60,
alignSelf: 'center', alignSelf: 'center',
textAlignVertical: 'center', textAlignVertical: 'center',
}}> }}>
{!item.title || item.title === '' ? 'Pinned' : item.title} {!item.title || item.title === '' ? 'Pinned' : item.title}
</Heading> </Heading>
</TouchableOpacity> </TouchableOpacity>
{index === 0 && sortMenuButton ? <HeaderMenu /> : null} {index === 0 && sortMenuButton ? <HeaderMenu /> : null}
</View> </View>
); );
}; };

27
apps/mobile/src/components/SplashScreen/index.js
View File

@@ -27,7 +27,7 @@ import {openLinkInBrowser} from '../../utils/functions';
import {Modal} from 'react-native'; import {Modal} from 'react-native';
import {SafeAreaView} from 'react-native'; import {SafeAreaView} from 'react-native';
import {SvgToPngView} from '../ListPlaceholders'; import {SvgToPngView} from '../ListPlaceholders';
import { MMKV } from '../../utils/mmkv'; import {MMKV} from '../../utils/mmkv';
const features = [ const features = [
{ {
@@ -42,7 +42,7 @@ const features = [
'Your data is encrypted on your device. No one but you can read your notes.', 'Your data is encrypted on your device. No one but you can read your notes.',
icon: PRIVACY_SVG, icon: PRIVACY_SVG,
link: 'https://notesnook.com', link: 'https://notesnook.com',
img:"privacy" img: 'privacy',
}, },
{ {
icon: SYNC_SVG, icon: SYNC_SVG,
@@ -50,7 +50,7 @@ const features = [
description: description:
'Everything is automatically synced to all your devices in a safe and secure way. Notesnook is available on all major platforms.', 'Everything is automatically synced to all your devices in a safe and secure way. Notesnook is available on all major platforms.',
link: 'https://notesnook.com', link: 'https://notesnook.com',
img:'sync' img: 'sync',
}, },
{ {
icon: ORGANIZE_SVG, icon: ORGANIZE_SVG,
@@ -58,7 +58,7 @@ const features = [
description: description:
'Add your notes in notebooks and topics or simply assign tags or colors to find them easily.', 'Add your notes in notebooks and topics or simply assign tags or colors to find them easily.',
link: 'https://notesnook.com', link: 'https://notesnook.com',
img:"sync" img: 'sync',
}, },
{ {
icon: COMMUNITY_SVG, icon: COMMUNITY_SVG,
@@ -66,7 +66,7 @@ const features = [
description: description:
'We are not ghosts, chat with us and share your experience. Give suggestions, report issues and meet other people using Notesnook', 'We are not ghosts, chat with us and share your experience. Give suggestions, report issues and meet other people using Notesnook',
link: 'https://discord.gg/zQBK97EE22', link: 'https://discord.gg/zQBK97EE22',
img:'community' img: 'community',
}, },
]; ];
let currentIndex = 0; let currentIndex = 0;
@@ -82,7 +82,7 @@ const SplashScreen = () => {
const translateY2 = useValue(0); const translateY2 = useValue(0);
useEffect(() => { useEffect(() => {
MMKV.getStringAsync('introCompleted').then(async (r) => { MMKV.getStringAsync('introCompleted').then(async r => {
setTimeout(() => { setTimeout(() => {
if (!r) { if (!r) {
setVisible(true); setVisible(true);
@@ -97,11 +97,11 @@ const SplashScreen = () => {
easing: Easing.in(Easing.ease), easing: Easing.in(Easing.ease),
}).start(); }).start();
} }
},1); }, 1);
}); });
}, []); }, []);
const hide = async () => { const hide = async () => {
timing(translateY2, { timing(translateY2, {
toValue: dHeight * 2, toValue: dHeight * 2,
duration: 500, duration: 500,
@@ -249,18 +249,14 @@ const SplashScreen = () => {
<View <View
style={{ style={{
flexDirection: 'row',
justifyContent: 'space-between',
width: '100%', width: '100%',
position: 'absolute', position: 'absolute',
bottom: 25, bottom: 25,
}}> }}>
<View />
<Button <Button
fontSize={SIZE.md} fontSize={SIZE.md}
height={50} height={50}
width={isNext ? null : '100%'} width={isNext ? null : DDS.isTab ? 250 : '100%'}
onPress={async () => { onPress={async () => {
if (isNext) { if (isNext) {
carouselRef.current?.snapToItem( carouselRef.current?.snapToItem(
@@ -277,7 +273,10 @@ const SplashScreen = () => {
await Storage.write('introCompleted', 'true'); await Storage.write('introCompleted', 'true');
} }
}} }}
style={{paddingHorizontal: 24}} style={{
paddingHorizontal: 24,
alignSelf: !isNext ? 'center' : 'flex-end',
}}
type="accent" type="accent"
title={isNext ? 'Next' : 'Start taking notes'} title={isNext ? 'Next' : 'Start taking notes'}
/> />

3
apps/mobile/src/provider/interfaces.ts
View File

@@ -137,6 +137,9 @@ export type Message = {
export interface MessageStore extends State { export interface MessageStore extends State {
message: Message message: Message
setMessage: (message: Message) => void setMessage: (message: Message) => void
announcement:any,
setAnnouncement:() => Promise<void>
remove:() => void
} }

70
apps/mobile/src/provider/stores.ts
View File

@@ -1,9 +1,12 @@
import { Platform } from 'react-native';
import { Dimensions } from 'react-native'; import { Dimensions } from 'react-native';
import create, { State } from 'zustand'; import create, { State } from 'zustand';
import { eSendEvent } from '../services/EventManager'; import { eSendEvent } from '../services/EventManager';
import { history, SORT, sortSettings } from '../utils'; import PremiumService from '../services/PremiumService';
import { history, SORT, sortSettings, SUBSCRIPTION_STATUS } from '../utils';
import { db } from '../utils/DB'; import { db } from '../utils/DB';
import { eOpenSideMenu } from '../utils/Events'; import { eOpenSideMenu } from '../utils/Events';
import { MMKV } from '../utils/mmkv';
import { import {
MenuStore, MenuStore,
MessageStore, MessageStore,
@@ -237,6 +240,28 @@ export const useMessageStore = create<MessageStore>((set, get) => ({
icon: 'account-outline', icon: 'account-outline',
}, },
setMessage: message => set({ message: { ...message } }), setMessage: message => set({ message: { ...message } }),
announcement:null,
remove:async () => {
await MMKV.setStringAsync('removedAnnouncement', get().announcement.id);
set({announcement:null})
},
setAnnouncement:async function () {
try {
let announcement = await db.announcement()
if (
!announcement ||
(await MMKV.getStringAsync('removedAnnouncement')) ===
announcement.id ||
!shouldShowAnnouncement(announcement)
) {
announcement = null;
return;
}
set({announcement:announcement})
} catch (e) {
set({announcement:null})
}
}
})); }));
export function initialize() { export function initialize() {
@@ -257,3 +282,46 @@ export function clearAllStores() {
useNoteStore.getState().clearNotes(); useNoteStore.getState().clearNotes();
} }
const allowedPlatforms = ['all', 'mobile', Platform.OS];
function shouldShowAnnouncement(announcement) {
let show = allowedPlatforms.indexOf(announcement.platform) > -1;
console.log(show);
if (!show) return;
const subStatus = PremiumService.getUser()?.subscription?.type;
switch (announcement.userType) {
case 'pro':
show = PremiumService.get()
break;
case 'trial':
show = subStatus === SUBSCRIPTION_STATUS.TRIAL;
break;
case 'trialExpired':
show = subStatus === SUBSCRIPTION_STATUS.BASIC;
break;
case 'loggedOut':
show = !PremiumService.getUser();
break;
case 'verified':
show = PremiumService.getUser()?.isEmailVerified;
break;
case 'loggedIn':
show = !!PremiumService.getUser();
break;
case 'unverified':
show = !PremiumService.getUser()?.isEmailVerified;
break;
case 'proExpired':
show =
subStatus === SUBSCRIPTION_STATUS.PREMIUM_EXPIRED ||
subStatus === SUBSCRIPTION_STATUS.PREMIUM_CANCELED;
break;
case 'any':
default:
break;
}
return show;
}

15
apps/mobile/src/views/Editor/EditorHeader.js
View File

@@ -36,6 +36,7 @@ import { toolbarRef } from './tiny/toolbar/constants';
const EditorHeader = () => { const EditorHeader = () => {
const [state] = useTracked(); const [state] = useTracked();
const {colors} = state; const {colors} = state;
const deviceMode = useSettingStore(state => state.deviceMode)
const fullscreen = useSettingStore(state => state.fullscreen); const fullscreen = useSettingStore(state => state.fullscreen);
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
@@ -44,6 +45,10 @@ const EditorHeader = () => {
setColors(colors); setColors(colors);
}, [colors.bg]); }, [colors.bg]);
const isLargeTablet = () => {
return deviceMode === "tablet"
}
const _onBackPress = async () => { const _onBackPress = async () => {
eSendEvent('showTooltip'); eSendEvent('showTooltip');
toolbarRef.current?.scrollTo({ toolbarRef.current?.scrollTo({
@@ -53,12 +58,12 @@ const EditorHeader = () => {
}); });
editing.isFocused = false; editing.isFocused = false;
editing.currentlyEditing = false; editing.currentlyEditing = false;
if (DDS.isLargeTablet()) { if (deviceMode !== "mobile") {
if (fullscreen) { if (fullscreen) {
eSendEvent(eCloseFullscreenEditor); eSendEvent(eCloseFullscreenEditor);
} }
} else { } else {
if (DDS.isPhone || DDS.isSmallTab) { if (deviceMode === "mobile") {
tabBarRef.current?.goToPage(0); tabBarRef.current?.goToPage(0);
} }
eSendEvent('historyEvent', { eSendEvent('historyEvent', {
@@ -99,7 +104,7 @@ const EditorHeader = () => {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
}}> }}>
{DDS.isLargeTablet() && !fullscreen ? null : ( {deviceMode !== "mobile" && !fullscreen ? null : (
<ActionIcon <ActionIcon
onLongPress={async () => { onLongPress={async () => {
await _onBackPress(); await _onBackPress();
@@ -118,7 +123,7 @@ const EditorHeader = () => {
/> />
)} )}
{fullscreen && <View style={{width: 20}} />} {fullscreen && <View style={{width: 20}} />}
{DDS.isLargeTablet() && <EditorTitle />} {deviceMode !== "mobile" && <EditorTitle />}
</View> </View>
<View <View
style={{ style={{
@@ -138,7 +143,7 @@ const EditorHeader = () => {
}} }}
/> />
{DDS.isLargeTablet() && !fullscreen ? ( {deviceMode !== "mobile" && !fullscreen ? (
<ActionIcon <ActionIcon
name="fullscreen" name="fullscreen"
color={colors.heading} color={colors.heading}

2
apps/mobile/src/views/Editor/EditorRoot.js
View File

@@ -22,6 +22,8 @@ import {
clearEditor, clearEditor,
clearTimer, clearTimer,
EditorWebView,
isNotedEdited, isNotedEdited,
loadNote loadNote
} from './Functions'; } from './Functions';

10
apps/mobile/src/views/Editor/EditorWrapper.js
View File

@@ -7,7 +7,7 @@ import Editor from '.';
import { GetPremium } from '../../components/ActionSheetComponent/GetPremium'; import { GetPremium } from '../../components/ActionSheetComponent/GetPremium';
import Paragraph from '../../components/Typography/Paragraph'; import Paragraph from '../../components/Typography/Paragraph';
import { useTracked } from '../../provider'; import { useTracked } from '../../provider';
import { useNoteStore } from '../../provider/stores'; import { useNoteStore, useSettingStore } from '../../provider/stores';
import { DDS } from '../../services/DeviceDetection'; import { DDS } from '../../services/DeviceDetection';
import { eSendEvent } from '../../services/EventManager'; import { eSendEvent } from '../../services/EventManager';
import { eOnLoadNote } from '../../utils/Events'; import { eOnLoadNote } from '../../utils/Events';
@@ -89,10 +89,10 @@ const AnimatedKeyboardView = Animated.createAnimatedComponent(
KeyboardAvoidingView, KeyboardAvoidingView,
); );
export const EditorWrapper = ({dimensions}) => { export const EditorWrapper = ({width,dimensions}) => {
const [state] = useTracked(); const [state] = useTracked();
const {colors} = state; const {colors} = state;
const deviceMode = useSettingStore(state => state.deviceMode)
const loading = useNoteStore(state => state.loading); const loading = useNoteStore(state => state.loading);
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
@@ -102,11 +102,11 @@ export const EditorWrapper = ({dimensions}) => {
<View <View
ref={editorRef} ref={editorRef}
style={{ style={{
width: DDS.isLargeTablet() ? dimensions.width * 0.55 : dimensions.width, width: width[deviceMode].c,
height: '100%', height: '100%',
backgroundColor: colors.bg, backgroundColor: colors.bg,
borderLeftWidth: 1, borderLeftWidth: 1,
borderLeftColor: DDS.isLargeTablet() ? colors.nav : 'transparent', borderLeftColor: DDS.isTab ? colors.nav : 'transparent',
}}> }}>
<SafeAreaView <SafeAreaView
style={{ style={{

4
apps/mobile/src/views/Editor/index.js
View File

@@ -47,6 +47,8 @@ const style = {
backgroundColor: 'transparent', backgroundColor: 'transparent',
}; };
const CustomView = Platform.OS === 'ios' ? ScrollView : View;
const Editor = React.memo( const Editor = React.memo(
() => { () => {
const premiumUser = useUserStore(state => state.premium); const premiumUser = useUserStore(state => state.premium);
@@ -87,7 +89,6 @@ const Editor = React.memo(
}; };
}, []); }, []);
const CustomView = Platform.OS === 'ios' ? ScrollView : View;
return resetting ? null : ( return resetting ? null : (
<> <>
@@ -112,7 +113,6 @@ const Editor = React.memo(
showsVerticalScrollIndicator={false} showsVerticalScrollIndicator={false}
scrollEnabled={false} scrollEnabled={false}
nestedScrollEnabled nestedScrollEnabled
contentContainerStyle={{ contentContainerStyle={{
width: '100%', width: '100%',
height: '100%', height: '100%',