diff --git a/apps/mobile/src/components/ActionSheetComponent/index.js b/apps/mobile/src/components/ActionSheetComponent/index.js
index 5a4d04e70..56494a86d 100644
--- a/apps/mobile/src/components/ActionSheetComponent/index.js
+++ b/apps/mobile/src/components/ActionSheetComponent/index.js
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from 'react';
+import React, {useEffect, useState, createRef} from 'react';
import {
Dimensions,
StatusBar,
@@ -32,7 +32,7 @@ import NavigationService from '../../services/NavigationService';
const w = Dimensions.get('window').width;
const h = Dimensions.get('window').height;
-let tagsInputRef;
+const tagsInputRef = createRef();
export const ActionSheetComponent = ({
close = () => {},
item,
@@ -78,14 +78,16 @@ export const ActionSheetComponent = ({
let backPressCount = 0;
const _onSubmit = async () => {
- if (!tagToAdd || tagToAdd === '') return;
-
+ if (!tagToAdd || tagToAdd === '' || tagToAdd.trimStart().length == 0) {
+ ToastEvent.show('Empty Tag', 'success');
+ return;
+ }
let tag = tagToAdd;
if (tag.includes(' ')) {
tag = tag.replace(' ', '_');
}
- tagsInputRef.setNativeProps({
+ tagsInputRef.current?.setNativeProps({
text: '',
});
@@ -116,10 +118,20 @@ export const ActionSheetComponent = ({
setNote({...db.notes.note(note.id).data});
- tagsInputRef.setNativeProps({
+ tagsInputRef.current?.setNativeProps({
text: tagInputValue,
});
}
+ } else if (event.nativeEvent.key === ' ') {
+ _onSubmit();
+ tagsInputRef.current?.setNativeProps({
+ text: '',
+ });
+ } else if (event.nativeE.key === ',') {
+ _onSubmit();
+ tagsInputRef.current?.setNativeProps({
+ text: '',
+ });
}
};
@@ -333,9 +345,14 @@ export const ActionSheetComponent = ({
key={tag}
onPress={async () => {
let oldProps = {...note};
-
- await db.notes.note(note.id).untag(oldProps.tags.indexOf(tag));
- localRefresh(item.type);
+ try {
+ await db.notes
+ .note(note.id)
+ .untag(oldProps.tags[oldProps.tags.indexOf(tag)]);
+ localRefresh(oldProps.type);
+ } catch (e) {
+ localRefresh(oldProps.type);
+ }
}}
style={{
flexDirection: 'row',
@@ -680,11 +697,21 @@ export const ActionSheetComponent = ({
borderColor: focused ? colors.accent : colors.nav,
paddingVertical: 5,
}}>
+ {
+ tagsInputRef.current?.focus();
+ }}
+ style={{
+ position: 'absolute',
+ width: '100%',
+ height: '100%',
+ }}>
{note && note.tags ? note.tags.map(_renderTag) : null}
(tagsInputRef = ref)}
+ ref={tagsInputRef}
placeholderTextColor={colors.icon}
onFocus={() => {
setFocused(true);