From f9997b9f8495db0756df1e09687e7d36745b88b7 Mon Sep 17 00:00:00 2001
From: ammarahm-ed <ammarahmed6506@gmail.com>
Date: Sat, 22 Feb 2020 17:36:18 +0500
Subject: [PATCH] minor fixes

---
 .../src/components/ActionSheet/index.js       | 17 +++---
 .../components/ActionSheetComponent/index.js  |  8 +--
 apps/mobile/src/components/Dialog/index.js    |  4 +-
 apps/mobile/src/components/Menu/index.js      | 29 ++++------
 apps/mobile/src/components/ModalMenu/index.js |  7 ++-
 apps/mobile/src/components/NotesList/index.js | 10 ++--
 apps/mobile/src/views/Editor/index.js         | 53 ++++++++-----------
 apps/mobile/src/views/Home/index.js           |  2 +-
 8 files changed, 57 insertions(+), 73 deletions(-)

diff --git a/apps/mobile/src/components/ActionSheet/index.js b/apps/mobile/src/components/ActionSheet/index.js
index 49bc15295..388e3da07 100644
--- a/apps/mobile/src/components/ActionSheet/index.js
+++ b/apps/mobile/src/components/ActionSheet/index.js
@@ -258,6 +258,9 @@ export default class ActionSheet extends Component {
               overScrollMode="always"
               style={[styles.scrollview]}>
               <Animated.View
+                onTouchStart={this._hideModal}
+                onTouchEnd={this._hideModal}
+                onTouchMove={this._hideModal}
                 style={{
                   height: '100%',
                   width: '100%',
@@ -267,6 +270,7 @@ export default class ActionSheet extends Component {
                   zIndex: 1,
                 }}
               />
+
               <View
                 onTouchMove={this._onTouchMove}
                 onTouchStart={this._onTouchStart}
@@ -274,17 +278,7 @@ export default class ActionSheet extends Component {
                 style={{
                   height: deviceHeight * 1.1,
                   width: '100%',
-                  zIndex: 10,
-                }}>
-                <TouchableOpacity
-                  onPress={this._hideModal}
-                  onLongPress={this._hideModal}
-                  style={{
-                    height: deviceHeight,
-                    width: '100%',
-                  }}
-                />
-              </View>
+                }}></View>
 
               <Animated.View
                 onLayout={this._showModal}
@@ -294,6 +288,7 @@ export default class ActionSheet extends Component {
                   {
                     ...getElevation(elevation),
                     zIndex: 11,
+
                     transform: [
                       {
                         translateY: this.transformValue,
diff --git a/apps/mobile/src/components/ActionSheetComponent/index.js b/apps/mobile/src/components/ActionSheetComponent/index.js
index 29ccfd212..21d7b8673 100644
--- a/apps/mobile/src/components/ActionSheetComponent/index.js
+++ b/apps/mobile/src/components/ActionSheetComponent/index.js
@@ -384,8 +384,8 @@ export const ActionSheetComponent = ({
       }}>
       <View
         style={{
-          width: DDS.isTab ? 500 / 10 : w / 10,
-          height: DDS.isTab ? 500 / 10 : w / 10,
+          width: DDS.isTab ? 400 / 10 : w / 10,
+          height: DDS.isTab ? 400 / 10 : w / 10,
           backgroundColor: color,
           borderRadius: 100,
           justifyContent: 'center',
@@ -405,7 +405,9 @@ export const ActionSheetComponent = ({
         key={rowItem.name}
         style={{
           alignItems: 'center',
-          width: (w - 24) / rowItems.length,
+          width: DDS.isTab
+            ? (400 - 24) / rowItems.length
+            : (w - 25) / rowItems.length,
         }}>
         <Icon
           style={{
diff --git a/apps/mobile/src/components/Dialog/index.js b/apps/mobile/src/components/Dialog/index.js
index 299e1dd70..f3823b3c9 100644
--- a/apps/mobile/src/components/Dialog/index.js
+++ b/apps/mobile/src/components/Dialog/index.js
@@ -78,6 +78,7 @@ export class Dialog extends Component {
         this.setState({
           visible: false,
         });
+        break;
       }
       case dialogActions.ACTION_TRASH: {
         db.trash.restore(item.id);
@@ -90,6 +91,7 @@ export class Dialog extends Component {
         );
         updateEvent({type: ACTIONS.TRASH});
         this.hide();
+        break;
       }
     }
   };
@@ -146,7 +148,7 @@ export class Dialog extends Component {
           <View
             style={{
               ...getElevation(5),
-              width: DDS.isTab ? '50%' : '80%',
+              width: DDS.isTab ? '40%' : '80%',
               maxHeight: 350,
               borderRadius: 5,
               backgroundColor: colors.bg,
diff --git a/apps/mobile/src/components/Menu/index.js b/apps/mobile/src/components/Menu/index.js
index d63cfc5ad..825a04ce7 100644
--- a/apps/mobile/src/components/Menu/index.js
+++ b/apps/mobile/src/components/Menu/index.js
@@ -130,7 +130,7 @@ export const Menu = ({
           minHeight: 2,
           width: '100%',
           paddingHorizontal: noTextMode ? 0 : ph,
-          height: DDS.isTab ? 50 : 0,
+          height: DDS.isTab && noTextMode ? 50 : 0,
           marginBottom: 0,
           alignItems: 'center',
           flexDirection: 'row',
@@ -144,21 +144,10 @@ export const Menu = ({
                 : 0
               : StatusBar.currentHeight,
         }}>
-        {noTextMode || !DDS.isTab ? null : (
-          <Text
-            style={{
-              fontSize: SIZE.xxl,
-              fontFamily: WEIGHT.bold,
-              color: colors.accent,
-            }}>
-            notesnook
-          </Text>
-        )}
-
-        {DDS.isTab ? (
+        {DDS.isTab && noTextMode ? (
           <TouchableOpacity
             onPress={() => {
-              noTextMode ? eSendEvent(eOpenModalMenu) : close();
+              eSendEvent(eOpenModalMenu);
             }}
             style={{
               alignItems: 'center',
@@ -169,8 +158,8 @@ export const Menu = ({
               style={{
                 marginTop: noTextMode ? 0 : 7.5,
               }}
-              name={noTextMode ? 'menu' : 'x'}
-              size={noTextMode ? SIZE.lg : SIZE.xxl}
+              name="menu"
+              size={SIZE.lg}
               color={colors.pri}
             />
           </TouchableOpacity>
@@ -629,17 +618,17 @@ export const Menu = ({
               justifyContent: noTextMode ? 'center' : 'flex-start',
               alignItems: 'center',
               flexDirection: 'row',
-              backgroundColor: colors.accent,
+              backgroundColor: noTextMode ? 'transparent' : colors.accent,
               borderRadius: 5,
-              paddingHorizontal: 6,
+              paddingHorizontal: noTextMode ? 0 : 6,
             }}>
             <Icon
               style={{
-                minWidth: 35,
+                minWidth: noTextMode ? 5 : 35,
                 textAlign: 'left',
               }}
               name="login"
-              color="white"
+              color={noTextMode ? colors.accent : 'white'}
               size={SIZE.lg}
             />
 
diff --git a/apps/mobile/src/components/ModalMenu/index.js b/apps/mobile/src/components/ModalMenu/index.js
index c74657644..852b751f8 100644
--- a/apps/mobile/src/components/ModalMenu/index.js
+++ b/apps/mobile/src/components/ModalMenu/index.js
@@ -44,7 +44,7 @@ export class ModalMenu extends Component {
           this.setState({
             visible: 'false',
           });
-        }, 200);
+        }, 100);
       },
     );
   };
@@ -56,7 +56,7 @@ export class ModalMenu extends Component {
       <Modal
         visible={visible}
         transparent={true}
-        animated
+        animated={false}
         onShow={() => {
           setTimeout(() => {
             this.setState({
@@ -64,7 +64,6 @@ export class ModalMenu extends Component {
             });
           }, 0);
         }}
-        animationType="fade"
         onRequestClose={() => this.setState({visible: false})}>
         <View
           style={{
@@ -94,7 +93,7 @@ export class ModalMenu extends Component {
               zIndex: 10,
               transform: [
                 {
-                  translateX: showMenu ? 0 : -(w * 0.3),
+                  translateX: showMenu ? 0 : -w,
                 },
               ],
             }}>
diff --git a/apps/mobile/src/components/NotesList/index.js b/apps/mobile/src/components/NotesList/index.js
index 7fb337ae9..d221dbe63 100644
--- a/apps/mobile/src/components/NotesList/index.js
+++ b/apps/mobile/src/components/NotesList/index.js
@@ -17,7 +17,7 @@ import {ToastEvent, hexToRGBA} from '../../utils/utils';
 import {NotesPlaceHolder} from '../ListPlaceholders';
 import NoteItem from '../NoteItem';
 import SelectionWrapper from '../SelectionWrapper';
-import {db} from '../../../App';
+import {db, DDS} from '../../../App';
 
 export const NotesList = ({isGrouped = false}) => {
   const [state, dispatch] = useTracked();
@@ -68,7 +68,9 @@ export const NotesList = ({isGrouped = false}) => {
         marginTop:
           Platform.OS == 'ios'
             ? notes[0] && !selectionMode
-              ? 135
+              ? DDS.isTab
+                ? 115
+                : 135
               : 135 - 60
             : notes[0] && !selectionMode
             ? 155
@@ -147,7 +149,9 @@ export const NotesList = ({isGrouped = false}) => {
         marginTop:
           Platform.OS == 'ios'
             ? notes[0]
-              ? 135
+              ? DDS.isTab
+                ? 115
+                : 135
               : 135 - 60
             : notes[0]
             ? 155
diff --git a/apps/mobile/src/views/Editor/index.js b/apps/mobile/src/views/Editor/index.js
index 54280b8a7..c687a80b7 100755
--- a/apps/mobile/src/views/Editor/index.js
+++ b/apps/mobile/src/views/Editor/index.js
@@ -50,8 +50,7 @@ const Editor = ({navigation, noMenu}) => {
   const [state, dispatch] = useTracked();
   const {colors} = state;
   const [loading, setLoading] = useState(true);
-
-  let fullscreen = false;
+  const [fullscreen, setFullscreen] = useState(false);
 
   // FUNCTIONS
 
@@ -105,14 +104,8 @@ const Editor = ({navigation, noMenu}) => {
     content = null;
     note = {};
     saveCounter = 0;
+    EditorWebView.reload();
 
-    post('clear');
-    post(
-      JSON.stringify({
-        type: 'title',
-        value: null,
-      }),
-    );
     post('focusTitle');
   };
 
@@ -377,28 +370,17 @@ const Editor = ({navigation, noMenu}) => {
             right: 0,
             top: 0,
           }}>
-          {DDS.isTab ? (
+          {DDS.isTab && !fullscreen ? (
             <TouchableOpacity
               onPress={() => {
-                if (fullscreen) {
-                  fullscreen = false;
-                  eSendEvent(eCloseFullscreenEditor);
-                  post(
-                    JSON.stringify({
-                      type: 'nomenu',
-                      value: true,
-                    }),
-                  );
-                } else {
-                  eSendEvent(eOpenFullscreenEditor);
-                  fullscreen = true;
-                  post(
-                    JSON.stringify({
-                      type: 'nomenu',
-                      value: false,
-                    }),
-                  );
-                }
+                eSendEvent(eOpenFullscreenEditor);
+                setFullscreen(true);
+                post(
+                  JSON.stringify({
+                    type: 'nomenu',
+                    value: false,
+                  }),
+                );
               }}
               style={{
                 width: 60,
@@ -408,7 +390,7 @@ const Editor = ({navigation, noMenu}) => {
                 paddingRight: 12,
                 zIndex: 800,
               }}>
-              <Icon name="square" color={colors.icon} size={SIZE.xxxl} />
+              <Icon name="fullscreen" color={colors.icon} size={SIZE.xxxl} />
             </TouchableOpacity>
           ) : null}
           <TouchableOpacity
@@ -505,8 +487,19 @@ const Editor = ({navigation, noMenu}) => {
     );
   };
 
+  const closeFullscreen = () => {
+    setFullscreen(false);
+  };
+
   // EFFECTS
 
+  useEffect(() => {
+    eSubscribeEvent(eCloseFullscreenEditor, closeFullscreen);
+
+    return () => {
+      eUnSubscribeEvent(eCloseFullscreenEditor, closeFullscreen);
+    };
+  });
   useEffect(() => {
     let handleBack;
     if (!noMenu && DDS.isTab) {
diff --git a/apps/mobile/src/views/Home/index.js b/apps/mobile/src/views/Home/index.js
index 380a047d8..fc3fdbb43 100755
--- a/apps/mobile/src/views/Home/index.js
+++ b/apps/mobile/src/views/Home/index.js
@@ -11,7 +11,7 @@ import {ACTIONS} from '../../provider/actions';
 import {eSendEvent} from '../../services/eventManager';
 import NavigationService from '../../services/NavigationService';
 import {SideMenuEvent} from '../../utils/utils';
-import {eScrollEvent} from '../../services/events';
+import {eScrollEvent, eOnLoadNote} from '../../services/events';
 let count = 0;
 export const AnimatedSafeAreaView = Animatable.createAnimatableComponent(
   SafeAreaView,