diff --git a/apps/mobile/src/components/MoveNoteDialog/index.js b/apps/mobile/src/components/MoveNoteDialog/index.js
index 8a5453bc9..6a26b9eff 100644
--- a/apps/mobile/src/components/MoveNoteDialog/index.js
+++ b/apps/mobile/src/components/MoveNoteDialog/index.js
@@ -1,14 +1,7 @@
-import React, {createRef, useEffect, useState} from 'react';
-import {
- FlatList,
- KeyboardAvoidingView,
- Modal,
- SafeAreaView,
- TextInput,
- TouchableOpacity,
- View,
-} from 'react-native';
-import {useSafeAreaInsets} from 'react-native-safe-area-context';
+import React, {createRef, useEffect, useRef, useState} from 'react';
+import {Keyboard} from 'react-native';
+import {ScrollView} from 'react-native';
+import {FlatList, TextInput, TouchableOpacity, View} from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import {notesnook} from '../../../e2e/test.ids';
import {useTracked} from '../../provider';
@@ -20,7 +13,7 @@ import {
eUnSubscribeEvent,
ToastEvent,
} from '../../services/EventManager';
-import {getElevation} from '../../utils';
+import {dHeight} from '../../utils';
import {db} from '../../utils/DB';
import {
eOnNewTopicAdded,
@@ -28,7 +21,8 @@ import {
refreshNotesPage,
} from '../../utils/Events';
import {pv, SIZE, WEIGHT} from '../../utils/SizeUtils';
-import DialogButtons from '../Dialog/dialog-buttons';
+import {ActionIcon} from '../ActionIcon';
+import ActionSheet from '../ActionSheet';
import DialogHeader from '../Dialog/dialog-header';
import {PressableButton} from '../PressableButton';
import {Toast} from '../Toast';
@@ -42,27 +36,30 @@ const topicInput = createRef();
const MoveNoteDialog = () => {
const [state, dispatch] = useTracked();
- const {colors, selectedItemsList} = state;
+ const {colors} = state;
const [visible, setVisible] = useState(false);
- const [expanded, setExpanded] = useState('');
- const [notebookInputFocused, setNotebookInputFocused] = useState(false);
- const [topicInputFocused, setTopicInputFocused] = useState(false);
const [note, setNote] = useState(null);
-
- function open() {
- if (selectedItemsList.length === 1) {
- console.log('setting note');
- setNote(selectedItemsList[0]);
- }
+ const actionSheetRef = useRef();
+ function open(note) {
+ setNote(note);
setVisible(true);
+ actionSheetRef.current?._setModalVisible(true);
}
const close = () => {
+ actionSheetRef.current?._setModalVisible(false);
+ };
+
+ useEffect(() => {
+ eSubscribeEvent(eOpenMoveNoteDialog, open);
+ return () => {
+ eUnSubscribeEvent(eOpenMoveNoteDialog, open);
+ };
+ }, []);
+
+ const _onClose = () => {
setVisible(false);
- setExpanded(false);
newTopicTitle = null;
newNotebookTitle = null;
- setNotebookInputFocused(false);
- setTopicInputFocused(false);
setNote(null);
eSendEvent(refreshNotesPage);
eSendEvent(eOnNewTopicAdded);
@@ -71,16 +68,41 @@ const MoveNoteDialog = () => {
dispatch({type: Actions.NOTES});
};
- useEffect(() => {
- if (selectedItemsList.length === 1) {
- console.log('setting note effect');
- setNote(selectedItemsList[0]);
- }
- eSubscribeEvent(eOpenMoveNoteDialog, open);
- return () => {
- eUnSubscribeEvent(eOpenMoveNoteDialog, open);
+ const style = React.useMemo(() => {
+ return {
+ width: DDS.isLargeTablet() ? 500 : '100%',
+ height: DDS.isLargeTablet() ? 500 : null,
+ maxHeight: DDS.isLargeTablet() ? 500 : '90%',
+ borderTopRightRadius: DDS.isLargeTablet() ? 5 : 10,
+ borderTopLeftRadius: DDS.isLargeTablet() ? 5 : 10,
+ backgroundColor: colors.bg,
+ padding: DDS.isLargeTablet() ? 8 : 0,
+ zIndex: 10,
+ paddingVertical: 12,
};
- }, []);
+ }, [colors.bg]);
+
+ return !visible ? null : (
+
+
+
+ );
+};
+
+export default MoveNoteDialog;
+
+const IntComponent = ({close, note}) => {
+ const [state, dispatch] = useTracked();
+ const {colors, selectedItemsList} = state;
+ const [expanded, setExpanded] = useState('');
+ const [notebookInputFocused, setNotebookInputFocused] = useState(false);
+ const [topicInputFocused, setTopicInputFocused] = useState(false);
const addNewNotebook = async () => {
if (!newNotebookTitle || newNotebookTitle.trim().length === 0)
@@ -88,7 +110,7 @@ const MoveNoteDialog = () => {
await db.notebooks.add({
title: newNotebookTitle,
- description: 'this.description',
+ description: null,
topics: [],
id: null,
});
@@ -101,356 +123,307 @@ const MoveNoteDialog = () => {
if (!newTopicTitle || newTopicTitle.trim().length === 0) {
return ToastEvent.show('Title is required', 'error', 'local');
}
- let res = await db.notebooks.notebook(expanded).topics.add(newTopicTitle);
+ await db.notebooks.notebook(expanded).topics.add(newTopicTitle);
dispatch({type: Actions.NOTEBOOKS});
topicInput.current?.clear();
topicInput.current?.blur();
newTopicTitle = null;
};
- return !visible ? null : (
-
-
-
+
+ {
+ Keyboard.dismiss();
+ }}
+ />
+
-
+
-
+
+
-
-
-
-
-
- {
- newNotebookTitle = value;
- }}
- testID={notesnook.ids.dialogs.addTo.addNotebook}
- blurOnSubmit={false}
- onFocus={() => {
- setNotebookInputFocused(true);
- }}
- onBlur={() => {
- setNotebookInputFocused(false);
- }}
- onSubmitEditing={addNewNotebook}
- style={[
- {
- color: colors.pri,
- width: '85%',
- maxWidth: '85%',
- paddingHorizontal: 0,
- borderRadius: 5,
- minHeight: 45,
- fontSize: SIZE.md,
- fontFamily: WEIGHT.regular,
- padding: pv - 2,
- },
- ]}
- placeholder="Add a notebook"
- placeholderTextColor={colors.icon}
- />
-
-
-
-
-
- }
- renderItem={({item, index}) => (
-
- {
- setExpanded(item.id === expanded ? null : item.id);
- }}
- type={expanded === item.id ? 'shade' : 'transparent'}
- customStyle={{
- height: 50,
- width: '100%',
- borderRadius: 0,
- alignItems: 'flex-start',
- paddingHorizontal: 12,
- marginBottom: 5,
- }}>
-
-
- {item.title}
- {'\n'}
-
- {item.totalNotes +
- ' notes' +
- ' & ' +
- item.topics.length +
- ' topics'}
-
-
-
-
-
- {expanded === item.id ? (
-
-
- {
- newTopicTitle = value;
- }}
- testID={notesnook.ids.dialogs.addTo.addTopic}
- blurOnSubmit={false}
- onFocus={() => {
- setTopicInputFocused(true);
- }}
- onBlur={() => {
- setTopicInputFocused(false);
- }}
- onSubmitEditing={addNewTopic}
- style={[
- {
- color: colors.pri,
- width: '85%',
- maxWidth: '85%',
- paddingHorizontal: 0,
- borderRadius: 5,
- height: 40,
- fontSize: SIZE.sm,
- fontFamily: WEIGHT.regular,
- padding: pv - 2,
- },
- ]}
- placeholder="Add a Topic"
- placeholderTextColor={colors.icon}
- />
-
-
-
-
-
- }
- renderItem={({item, index}) => (
- {
-
- if (
- note &&
- note.notebooks &&
- note.notebooks.findIndex((o) =>
- o.topics.findIndex((e) => e === item.id),
- )
- ) {
- await db.notebooks
- .notebook(item.notebookId)
- .topics.topic(item.id)
- .delete(note.id);
-
- if (note && note.id) {
- console.log('updating note');
- setNote({...db.notes.note(note.id).data});
- }
-
- dispatch({type: Actions.NOTEBOOKS});
- return;
- }
-
- let noteIds = [];
- selectedItemsList.forEach((i) =>
- noteIds.push(i.id),
- );
- await db.notes.move(
- {
- topic: item.id,
- id: item.notebookId,
- },
- ...noteIds,
- );
- console.log(item.id,item.notebookId);
- if (note && note.id) {
- console.log('updating note');
- setNote({...db.notes.note(note.id).data});
- }
- dispatch({type: Actions.NOTEBOOKS});
- }}
- type="gray"
- customStyle={{
- height: 50,
- borderTopWidth: index === 0 ? 0 : 1,
- borderTopColor: colors.nav,
- width: '87%',
- alignSelf: 'flex-end',
- borderRadius: 0,
- alignItems: 'center',
- marginRight: 12,
- flexDirection: 'row',
- justifyContent: 'space-between',
- }}>
-
-
- {item.title}
- {'\n'}
-
- {item.totalNotes + ' notes'}
-
-
-
- {note?.notebooks?.findIndex(
- (o) => o.topics.indexOf(item.id) > -1,
- ) > -1 ? (
-
- Remove
-
- ) : null}
-
- )}
- />
- ) : null}
-
- )}
- />
-
-
- {
+ newNotebookTitle = value;
+ }}
+ testID={notesnook.ids.dialogs.addTo.addNotebook}
+ blurOnSubmit={false}
+ onFocus={() => {
+ setNotebookInputFocused(true);
+ }}
+ onBlur={() => {
+ setNotebookInputFocused(false);
+ }}
+ onSubmitEditing={addNewNotebook}
+ style={[
+ {
+ color: colors.pri,
+ width: '90%',
+ maxWidth: '90%',
+ paddingHorizontal: 0,
+ borderRadius: 5,
+ minHeight: 45,
+ fontSize: SIZE.md,
+ fontFamily: WEIGHT.regular,
+ padding: pv - 2,
+ },
+ ]}
+ placeholder="Create a new notebook"
+ placeholderTextColor={colors.icon}
/>
+
+
+
-
-
-
-
+
+ {state.notebooks.map((item) => (
+
+ {
+ setExpanded(item.id === expanded ? null : item.id);
+ setTopicInputFocused(false);
+ setNotebookInputFocused(false);
+ }}
+ type="gray"
+ customStyle={{
+ height: 50,
+ width: '100%',
+ borderRadius: 0,
+ alignItems: 'flex-start',
+ marginBottom: 5,
+ borderBottomWidth: 1,
+ borderBottomColor:
+ expanded === item.id ? colors.accent : colors.nav,
+ }}>
+
+
+
+ {item.title}
+
+
+ Notebook{' '}
+ {item.totalNotes +
+ ' notes' +
+ ' & ' +
+ item.topics.length +
+ ' topics'}
+
+
+
+
+
+
+
+ {expanded === item.id ? (
+
+
+ {
+ newTopicTitle = value;
+ }}
+ testID={notesnook.ids.dialogs.addTo.addTopic}
+ blurOnSubmit={false}
+ onFocus={() => {
+ setTopicInputFocused(true);
+ }}
+ onBlur={() => {
+ setTopicInputFocused(false);
+ }}
+ onSubmitEditing={addNewTopic}
+ style={[
+ {
+ color: colors.pri,
+ width: '90%',
+ maxWidth: '90%',
+ paddingHorizontal: 0,
+ borderRadius: 5,
+ height: 40,
+ fontSize: SIZE.sm,
+ fontFamily: WEIGHT.regular,
+ padding: pv - 2,
+ },
+ ]}
+ placeholder="Add a topic"
+ placeholderTextColor={colors.icon}
+ />
+
+
+
+
+
+ }
+ renderItem={({item, index}) => (
+ {
+ if (
+ note &&
+ note.notebooks &&
+ note.notebooks.findIndex((o) =>
+ o.topics.findIndex((e) => e === item.id),
+ )
+ ) {
+ await db.notebooks
+ .notebook(item.notebookId)
+ .topics.topic(item.id)
+ .delete(note.id);
+
+ if (note && note.id) {
+ console.log('updating note');
+ setNote({...db.notes.note(note.id).data});
+ }
+
+ dispatch({type: Actions.NOTEBOOKS});
+ return;
+ }
+
+ let noteIds = [];
+ selectedItemsList.forEach((i) => noteIds.push(i.id));
+ await db.notes.move(
+ {
+ topic: item.id,
+ id: item.notebookId,
+ },
+ ...noteIds,
+ );
+ console.log(item.id, item.notebookId);
+ if (note && note.id) {
+ console.log('updating note');
+ setNote({...db.notes.note(note.id).data});
+ }
+ dispatch({type: Actions.NOTEBOOKS});
+ }}
+ type="gray"
+ customStyle={{
+ height: 50,
+ borderTopWidth: index === 0 ? 0 : 1,
+ borderTopColor: colors.nav,
+ width: '100%',
+ borderRadius: 0,
+ alignItems: 'center',
+ flexDirection: 'row',
+ paddingHorizontal: 12,
+ justifyContent: 'space-between',
+ }}>
+
+
+ {item.title}
+ {'\n'}
+
+ {item.totalNotes + ' notes'}
+
+
+
+ {note?.notebooks?.findIndex(
+ (o) => o.topics.indexOf(item.id) > -1,
+ ) > -1 ? (
+
+ Remove Note
+
+ ) : null}
+
+ )}
+ />
+ ) : null}
+
+ ))}
+
+
+
+
+
);
};
-
-export default MoveNoteDialog;