minor improvements

apps/mobile/App.js

@@ -7,11 +7,8 @@ import {
   View,
   DeviceEventEmitter,
   Platform,
-  Keyboard,
   Animated,
 } from 'react-native';
-import Icon from 'react-native-vector-icons/Ionicons';
-import ActionButton from 'react-native-action-button';
 import * as Animatable from 'react-native-animatable';
 import {h, w} from './src/utils/utils';
 import {Toast} from './src/components/Toast';
@@ -22,6 +19,7 @@ import StorageInterface from './src/utils/storage';
 import {AppProvider} from './src/provider';
 import {DeviceDetectionService} from './src/utils/deviceDetection';
 import {useAppContext} from './src/provider/useAppContext';
+
 export const DDS = new DeviceDetectionService();
 
 export const db = new Storage(StorageInterface);

apps/mobile/src/components/AddNotebookDialog/index.js

@@ -1,32 +1,17 @@
-import React, {useEffect, useState, createRef} from 'react';
+import React, {useState, createRef} from 'react';
 import {
-  ScrollView,
   View,
   Text,
   TouchableOpacity,
-  Dimensions,
-  Image,
-  SafeAreaView,
   Platform,
   Modal,
   KeyboardAvoidingView,
 } from 'react-native';
-import NavigationService from '../../services/NavigationService';
+import {SIZE, ph, pv, opacity, WEIGHT} from '../../common/common';
-import {
-  COLOR_SCHEME,
-  SIZE,
-  br,
-  ph,
-  pv,
-  opacity,
-  FONT,
-  WEIGHT,
-} from '../../common/common';
 import Icon from 'react-native-vector-icons/Feather';
 
-import {getElevation, h, w, timeSince, ToastEvent} from '../../utils/utils';
+import {getElevation, ToastEvent} from '../../utils/utils';
 import {FlatList, TextInput} from 'react-native-gesture-handler';
-import {useForceUpdate} from '../../views/ListsEditor';
 import {db, DDS} from '../../../App';
 import {useAppContext} from '../../provider/useAppContext';
 
@@ -36,28 +21,30 @@ export const AddNotebookDialog = ({visible, close}) => {
   const {colors} = useAppContext();
   const [topics, setTopics] = useState(['']);
   const [title, setTitle] = useState(null);
-  const forceUpdate = useForceUpdate();
 
   let listRef = createRef();
   let prevItem = null;
   let prevIndex = null;
-  let currentSelectedItem = null;
+  let currentSelectedInput = null;
 
   let description = 'my first notebook';
   const onSubmit = (text, index, willFocus = true) => {
-    let oldData = topics;
+    let prevTopics = topics;
-    oldData[index] = text;
+    prevTopics[index] = text;
 
     if (
-      oldData.length === index + 1 &&
+      prevTopics.length === index + 1 &&
       prevIndex !== null &&
       prevItem !== null
     ) {
-      oldData.push('');
+      prevTopics.push('');
     }
-    setTopics(oldData);
+
-    forceUpdate();
+    let nextTopics = [...prevTopics];
-    currentSelectedItem = null;
+
+    setTopics(nextTopics);
+
+    currentSelectedInput = null;
 
     //if (!willFocus) return;
     if (!refs[index + 1]) {
@@ -73,31 +60,39 @@ export const AddNotebookDialog = ({visible, close}) => {
     }
   };
   const onFocus = index => {
-    currentSelectedItem = index;
+    currentSelectedInput = index;
-    if (currentSelectedItem) {
+
-      let oldData = topics;
+    if (currentSelectedInput) {
-      oldData[prevIndex] = prevItem;
+      let prevTopics = topics;
-      if (oldData.length === prevIndex + 1) {
+
-        oldData.push('');
+      prevTopics[prevIndex] = prevItem;
+      if (prevTopics.length === prevIndex + 1) {
+        prevTopics.push('');
       }
       prevIndex = null;
       prevItem = null;
-      setTopics(oldData);
+
-      forceUpdate();
+      let nextTopics = [...prevTopics];
+
+      setTopics(nextTopics);
     }
   };
   const onChange = (text, index) => {
     prevIndex = index;
     prevItem = text;
   };
-  const onDelete = index => {
-    let listData = topics;
-    if (listData.length === 1) return;
-    refs.splice(index, 1);
-    listData.splice(index, 1);
 
-    setTopics(listData);
+  const onDelete = index => {
-    forceUpdate();
+    let prevTopics = topics;
+
+    if (prevTopics.length === 1) return;
+
+    refs = [];
+    prevTopics.splice(index, 1);
+
+    let nextTopics = [...prevTopics];
+
+    setTopics(nextTopics);
   };
 
   const addNewNotebook = async () => {
@@ -113,7 +108,7 @@ export const AddNotebookDialog = ({visible, close}) => {
     setTopics(['']);
     prevIndex = null;
     prevItem = null;
-    currentSelectedItem = null;
+    currentSelectedInput = null;
     refs = [];
     close(true);
   };
@@ -252,10 +247,12 @@ export const AddNotebookDialog = ({visible, close}) => {
               activeOpacity={opacity}
               onPress={() => {
                 setTopics(['']);
+
+                refs = [];
                 prevIndex = null;
                 prevItem = null;
-                currentSelectedItem = null;
+                currentSelectedInput = null;
-                refs = [];
+
                 close();
               }}
               style={{
@@ -313,7 +310,6 @@ const TopicItem = ({
         ref={topicRef}
         onFocus={() => {
           onFocus(index);
-
           setFocus(true);
         }}
         onBlur={() => {

apps/mobile/src/components/NotebookItem/index.js

@@ -126,7 +126,7 @@ export const NotebookItem = ({
             numberOfLines={1}
             style={{
               fontFamily: WEIGHT.bold,
-              fontSize: SIZE.sm,
+              fontSize: SIZE.md,
               color: colors.pri,
               maxWidth: '100%',
             }}>
@@ -137,9 +137,9 @@ export const NotebookItem = ({
               numberOfLines={numColumns === 2 ? 3 : 2}
               style={{
                 fontFamily: WEIGHT.regular,
-                fontSize: SIZE.xs,
+                fontSize: SIZE.xs + 1,
                 lineHeight: SIZE.sm,
-                color: colors.icon,
+                color: colors.pri,
                 maxWidth: '100%',
                 paddingVertical: 5,
                 height: numColumns === 2 ? SIZE.sm * 3.5 : null,

apps/mobile/src/views/Editor/index.js

@@ -33,12 +33,13 @@ let titleRef;
 let EditorWebView;
 
 const Editor = ({navigation}) => {
-  // STATE
+  // Global State
-
   const {colors} = useAppContext();
+
+  // Local State
+
   const [dialog, setDialog] = useState(false);
   const [isOpen, setOpen] = useState(false);
-  const [hide, setHide] = useState(true);
   const [sidebar, setSidebar] = useState(DDS.isTab ? true : false);
   // VARIABLES
   let updateInterval = null;
@@ -227,7 +228,6 @@ const Editor = ({navigation}) => {
       title = null;
       timestamp = null;
       content = null;
-
       handleBack.remove();
       handleBack = null;
     };
@@ -245,26 +245,15 @@ const Editor = ({navigation}) => {
   }, []);
 
   useEffect(() => {
-    DeviceEventEmitter.emit('hide');
-
-    return () => {
-      DeviceEventEmitter.emit('show');
-    };
-  }, []);
-
-  useEffect(() => {
-    null;
-
     return () => {
       DDS.isTab ? SideMenuEvent.open() : null;
-
       SideMenuEvent.enable();
     };
   });
 
   useEffect(() => {
     EditorWebView.reload();
-  }, [colors.bg]);
+  }, [colors]);
 
   return DDS.isTab ? (
     <View

apps/mobile/src/views/Folders/index.js

@@ -158,51 +158,9 @@ export const Folders = ({navigation}) => {
           ListHeaderComponent={
             <View
               style={{
-                marginTop: margin + 20,
+                marginTop: margin,
-                flexDirection: 'row',
+              }}
-                justifyContent: 'space-between',
+            />
-                width:
-                  numColumns === 2
-                    ? DDS.isTab
-                      ? w * 0.7 * 0.95
-                      : w * 0.95
-                    : w * 0.95,
-
-                alignSelf: 'center',
-                marginLeft:
-                  numColumns === 2 ? (DDS.isTab ? w * 0.7 * 0.025 : 0) : 0,
-                paddingHorizontal: ph + 5,
-              }}>
-              <View>
-                <Text
-                  transition="marginTop"
-                  delay={200}
-                  duration={200}
-                  style={{
-                    fontSize: SIZE.lg,
-                    fontFamily: WEIGHT.medium,
-                    color: colors.pri,
-                    paddingHorizontal: DDS.isTab ? '2.5%' : '5%',
-                    maxWidth: '100%',
-                  }}>
-                  <Text
-                    style={{
-                      color: colors.accent,
-                    }}></Text>
-                </Text>
-              </View>
-
-              <TouchableOpacity
-                onPress={() => {
-                  setNumColumns(numColumns === 1 ? 2 : 1);
-                }}
-                style={{
-                  justifyContent: 'center',
-                  alignItems: 'center',
-                }}>
-                <Icon name="list" size={SIZE.xl} color={colors.icon} />
-              </TouchableOpacity>
-            </View>
           }
           numColumns={numColumns}
           key={numColumns}