diff --git a/apps/mobile/src/components/ActionSheetComponent/index.js b/apps/mobile/src/components/ActionSheetComponent/index.js
new file mode 100644
index 000000000..8cdaad46a
--- /dev/null
+++ b/apps/mobile/src/components/ActionSheetComponent/index.js
@@ -0,0 +1,490 @@
+import React, {useState} from 'react';
+import {
+ View,
+ Text,
+ TouchableOpacity,
+ Dimensions,
+ TextInput,
+ FlatList,
+} from 'react-native';
+import {SIZE, pv, WEIGHT, opacity} from '../../common/common';
+import Icon from 'react-native-vector-icons/Feather';
+import NavigationService from '../../services/NavigationService';
+
+import {db} from '../../../App';
+
+import {useAppContext} from '../../provider/useAppContext';
+
+const w = Dimensions.get('window').width;
+const h = Dimensions.get('window').height;
+
+let tagsInputRef;
+export const ActionSheetComponent = ({
+ close = () => {},
+ item = {},
+ setWillRefresh = value => {},
+}) => {
+ const {colors} = useAppContext();
+ const [focused, setFocused] = useState(false);
+ const [note, setNote] = useState(item ? item : {});
+
+ let tagToAdd = null;
+ let backPressCount = 0;
+
+ const _onSubmit = () => {
+ if (!tagToAdd || tagToAdd === '#') return;
+
+ let tag = tagToAdd;
+ if (tag[0] !== '#') {
+ tag = '#' + tag;
+ }
+ if (tag.includes(' ')) {
+ tag = tag.replace(' ', '_');
+ }
+ let oldProps = {...note};
+
+ if (oldProps.tags.includes(tag)) {
+ return;
+ } else {
+ oldProps.tags.push(tag);
+ }
+
+ tagsInputRef.setNativeProps({
+ text: '#',
+ });
+ db.addNote({
+ dateCreated: note.dateCreated,
+ content: note.content,
+ title: note.title,
+ tags: oldProps.tags,
+ });
+ setNote({...db.getNote(note.dateCreated)});
+ tagToAdd = '';
+ setTimeout(() => {
+ //tagsInputRef.focus();
+ }, 300);
+ };
+
+ const _onKeyPress = event => {
+ if (event.nativeEvent.key === 'Backspace') {
+ if (backPressCount === 0 && !tagToAdd) {
+ backPressCount = 1;
+
+ return;
+ }
+ if (backPressCount === 1 && !tagToAdd) {
+ backPressCount = 0;
+
+ let tagInputValue = note.tags[note.tags.length - 1];
+ let oldProps = {...note};
+ if (oldProps.tags.length === 1) return;
+
+ oldProps.tags.splice(oldProps.tags.length - 1);
+
+ db.addNote({
+ dateCreated: note.dateCreated,
+ content: note.content,
+ title: note.title,
+ tags: oldProps.tags,
+ });
+ setNote({...db.getNote(note.dateCreated)});
+
+ tagsInputRef.setNativeProps({
+ text: tagInputValue,
+ });
+
+ setTimeout(() => {
+ tagsInputRef.focus();
+ }, 300);
+ }
+ }
+ };
+
+ return (
+
+
+ {
+ close();
+ NavigationService.push('Folders', {
+ note: note,
+ title: 'Choose a notebook',
+ isMove: true,
+ hideMore: true,
+ canGoBack: true,
+ });
+ }}
+ style={{
+ alignItems: 'center',
+ }}>
+
+
+
+ Move to
+
+
+ {
+ close();
+ }}
+ style={{
+ alignItems: 'center',
+ }}>
+
+
+ Share
+
+
+ {
+ close();
+ }}
+ style={{
+ alignItems: 'center',
+ }}>
+
+
+
+ Export
+
+
+ {
+ close('delete');
+ }}
+ style={{
+ alignItems: 'center',
+ }}>
+
+
+
+ Delete
+
+
+
+
+ {['red', 'yellow', 'green', 'blue', 'purple', 'orange', 'gray'].map(
+ color => (
+ {
+ let noteColors = note.colors;
+
+ if (noteColors.includes(color)) {
+ noteColors.splice(color, 1);
+ } else {
+ noteColors.push(color);
+ }
+
+ db.addNote({
+ dateCreated: note.dateCreated,
+ colors: noteColors,
+ content: note.content,
+ title: note.title,
+ });
+ setNote({...db.getNote(note.dateCreated)});
+ setWillRefresh(true);
+ }}
+ style={{
+ flexDirection: 'row',
+ justifyContent: 'flex-start',
+ alignItems: 'center',
+ borderColor: colors.nav,
+ }}>
+
+ {note.colors.includes(color) ? (
+
+ ) : null}
+
+
+ ),
+ )}
+
+
+
+ {note.tags.map(tag => (
+ {
+ let oldProps = {...note};
+
+ oldProps.tags.splice(oldProps.tags.indexOf(tag), 1);
+ db.addNote({
+ dateCreated: note.dateCreated,
+ content: note.content,
+ title: note.title,
+ tags: oldProps.tags,
+ });
+ setNote({...db.getNote(note.dateCreated)});
+ }}
+ style={{
+ flexDirection: 'row',
+ justifyContent: 'flex-start',
+ alignItems: 'center',
+ margin: 1,
+ paddingHorizontal: 5,
+ paddingVertical: 2.5,
+ }}>
+
+
+ {tag.slice(0, 1)}
+
+ {tag.slice(1)}
+
+
+ ))}
+ (tagsInputRef = ref)}
+ placeholderTextColor={colors.icon}
+ onFocus={() => {
+ setFocused(true);
+ }}
+ selectionColor={colors.accent}
+ onBlur={() => {
+ setFocused(false);
+ }}
+ placeholder="#hashtag"
+ onChangeText={value => {
+ tagToAdd = value;
+ if (tagToAdd.length > 0) backPressCount = 0;
+ }}
+ onSubmitEditing={_onSubmit}
+ onKeyPress={_onKeyPress}
+ />
+
+
+ {
+ db.pinItem(note.type, note.dateCreated);
+ setNote({...db.getNote(note.dateCreated)});
+ setWillRefresh(true);
+ },
+ close: false,
+ check: true,
+ on: note.pinned,
+ },
+
+ {
+ name: 'Favorite',
+ icon: 'star',
+ func: () => {
+ db.favoriteItem(note.type, note.dateCreated);
+ setNote({...db.getNote(note.dateCreated)});
+ setWillRefresh(true);
+ },
+ close: false,
+ check: true,
+ on: note.favorite,
+ },
+ {
+ name: 'Add to Vault',
+ icon: 'lock',
+ func: () => {
+ note.locked ? close('unlock') : close('lock');
+ },
+ close: true,
+ check: true,
+ on: note.locked,
+ },
+ ]}
+ keyExtractor={(item, index) => item.name}
+ renderItem={({item, index}) => (
+ {
+ item.func();
+ }}
+ style={{
+ width: '100%',
+ alignSelf: 'center',
+ flexDirection: 'row',
+ justifyContent: 'space-between',
+ alignItems: 'flex-end',
+ paddingHorizontal: 12,
+ paddingVertical: pv + 5,
+ paddingTop: index === 0 ? 5 : pv + 5,
+ }}>
+
+
+
+ {item.name}
+
+
+ {item.switch ? (
+
+ ) : (
+ undefined
+ )}
+ {item.check ? (
+
+ {item.on ? (
+
+ ) : null}
+
+ ) : null}
+
+ )}
+ />
+
+ );
+};
diff --git a/apps/mobile/src/components/NoteItem/index.js b/apps/mobile/src/components/NoteItem/index.js
index c29c79ee5..2953097e8 100644
--- a/apps/mobile/src/components/NoteItem/index.js
+++ b/apps/mobile/src/components/NoteItem/index.js
@@ -34,6 +34,7 @@ import {db} from '../../../App';
import {DDS} from '../../../App';
import {useAppContext} from '../../provider/useAppContext';
import ActionSheet from '../ActionSheet';
+import {ActionSheetComponent} from '../ActionSheetComponent';
const w = Dimensions.get('window').width;
const h = Dimensions.get('window').height;
@@ -500,475 +501,3 @@ const NoteItem = props => {
};
export default NoteItem;
-
-let tagsInputRef;
-
-const ActionSheetComponent = ({
- close = () => {},
- item = {},
- setWillRefresh = value => {},
-}) => {
- const {colors} = useAppContext();
- const [focused, setFocused] = useState(false);
- const [note, setNote] = useState(item ? item : {});
-
- let tagToAdd = null;
- let backPressCount = 0;
-
- const _onSubmit = () => {
- if (!tagToAdd || tagToAdd === '#') return;
-
- let tag = tagToAdd;
- if (tag[0] !== '#') {
- tag = '#' + tag;
- }
- if (tag.includes(' ')) {
- tag = tag.replace(' ', '_');
- }
- let oldProps = {...note};
-
- if (oldProps.tags.includes(tag)) {
- return;
- } else {
- oldProps.tags.push(tag);
- }
-
- tagsInputRef.setNativeProps({
- text: '#',
- });
- db.addNote({
- dateCreated: note.dateCreated,
- content: note.content,
- title: note.title,
- tags: oldProps.tags,
- });
- setNote({...db.getNote(note.dateCreated)});
- tagToAdd = '';
- setTimeout(() => {
- //tagsInputRef.focus();
- }, 300);
- };
-
- const _onKeyPress = event => {
- if (event.nativeEvent.key === 'Backspace') {
- if (backPressCount === 0 && !tagToAdd) {
- backPressCount = 1;
-
- return;
- }
- if (backPressCount === 1 && !tagToAdd) {
- backPressCount = 0;
-
- let tagInputValue = note.tags[note.tags.length - 1];
- let oldProps = {...note};
- if (oldProps.tags.length === 1) return;
-
- oldProps.tags.splice(oldProps.tags.length - 1);
-
- db.addNote({
- dateCreated: note.dateCreated,
- content: note.content,
- title: note.title,
- tags: oldProps.tags,
- });
- setNote({...db.getNote(note.dateCreated)});
-
- tagsInputRef.setNativeProps({
- text: tagInputValue,
- });
-
- setTimeout(() => {
- tagsInputRef.focus();
- }, 300);
- }
- }
- };
-
- return (
-
-
- {
- close();
- NavigationService.push('Folders', {
- note: note,
- title: 'Choose a notebook',
- isMove: true,
- hideMore: true,
- canGoBack: true,
- });
- }}
- style={{
- alignItems: 'center',
- }}>
-
-
-
- Move to
-
-
- {
- close();
- }}
- style={{
- alignItems: 'center',
- }}>
-
-
- Share
-
-
- {
- close();
- }}
- style={{
- alignItems: 'center',
- }}>
-
-
-
- Export
-
-
- {
- close('delete');
- }}
- style={{
- alignItems: 'center',
- }}>
-
-
-
- Delete
-
-
-
-
- {['red', 'yellow', 'green', 'blue', 'purple', 'orange', 'gray'].map(
- color => (
- {
- let noteColors = note.colors;
-
- if (noteColors.includes(color)) {
- noteColors.splice(color, 1);
- } else {
- noteColors.push(color);
- }
-
- db.addNote({
- dateCreated: note.dateCreated,
- colors: noteColors,
- content: note.content,
- title: note.title,
- });
- setNote({...db.getNote(note.dateCreated)});
- setWillRefresh(true);
- }}
- style={{
- flexDirection: 'row',
- justifyContent: 'flex-start',
- alignItems: 'center',
- borderColor: colors.nav,
- }}>
-
- {note.colors.includes(color) ? (
-
- ) : null}
-
-
- ),
- )}
-
-
-
- {note.tags.map(tag => (
- {
- let oldProps = {...note};
-
- oldProps.tags.splice(oldProps.tags.indexOf(tag), 1);
- db.addNote({
- dateCreated: note.dateCreated,
- content: note.content,
- title: note.title,
- tags: oldProps.tags,
- });
- setNote({...db.getNote(note.dateCreated)});
- }}
- style={{
- flexDirection: 'row',
- justifyContent: 'flex-start',
- alignItems: 'center',
- margin: 1,
- paddingHorizontal: 5,
- paddingVertical: 2.5,
- }}>
-
-
- {tag.slice(0, 1)}
-
- {tag.slice(1)}
-
-
- ))}
- (tagsInputRef = ref)}
- placeholderTextColor={colors.icon}
- onFocus={() => {
- setFocused(true);
- }}
- selectionColor={colors.accent}
- onBlur={() => {
- setFocused(false);
- }}
- placeholder="#hashtag"
- onChangeText={value => {
- tagToAdd = value;
- if (tagToAdd.length > 0) backPressCount = 0;
- }}
- onSubmitEditing={_onSubmit}
- onKeyPress={_onKeyPress}
- />
-
-
- {
- db.pinItem(note.type, note.dateCreated);
- setNote({...db.getNote(note.dateCreated)});
- setWillRefresh(true);
- },
- close: false,
- check: true,
- on: note.pinned,
- },
-
- {
- name: 'Favorite',
- icon: 'star',
- func: () => {
- db.favoriteItem(note.type, note.dateCreated);
- setNote({...db.getNote(note.dateCreated)});
- setWillRefresh(true);
- },
- close: false,
- check: true,
- on: note.favorite,
- },
- {
- name: 'Add to Vault',
- icon: 'lock',
- func: () => {
- note.locked ? close('unlock') : close('lock');
- },
- close: true,
- check: true,
- on: note.locked,
- },
- ]}
- keyExtractor={(item, index) => item.name}
- renderItem={({item, index}) => (
- {
- item.func();
- }}
- style={{
- width: '100%',
- alignSelf: 'center',
- flexDirection: 'row',
- justifyContent: 'space-between',
- alignItems: 'flex-end',
- paddingHorizontal: 12,
- paddingVertical: pv + 5,
- paddingTop: index === 0 ? 5 : pv + 5,
- }}>
-
-
-
- {item.name}
-
-
- {item.switch ? (
-
- ) : (
- undefined
- )}
- {item.check ? (
-
- {item.on ? (
-
- ) : null}
-
- ) : null}
-
- )}
- />
-
- );
-};