From 7dd65fca459d8fbe308e030486f984e2429971f3 Mon Sep 17 00:00:00 2001
From: ammarahm-ed <ammarahmed6506@gmail.com>
Date: Mon, 8 Feb 2021 13:53:31 +0500
Subject: [PATCH] add EditorSettings

---
 .../src/components/DialogManager/index.js     |  1 +
 .../mobile/src/views/Editor/EditorSettings.js | 84 +++++++++++++++++++
 2 files changed, 85 insertions(+)
 create mode 100644 apps/mobile/src/views/Editor/EditorSettings.js

diff --git a/apps/mobile/src/components/DialogManager/index.js b/apps/mobile/src/components/DialogManager/index.js
index b46d36db4..b9e234535 100644
--- a/apps/mobile/src/components/DialogManager/index.js
+++ b/apps/mobile/src/components/DialogManager/index.js
@@ -24,6 +24,7 @@ import {
   eShowGetPremium,
   eThemeUpdated,
 } from '../../utils/Events';
+import { EditorSettings } from '../../views/Editor/EditorSettings';
 import {ActionSheetComponent} from '../ActionSheetComponent';
 import ActionSheetWrapper from '../ActionSheetComponent/ActionSheetWrapper';
 import {AddNotebookDialog} from '../AddNotebookDialog';
diff --git a/apps/mobile/src/views/Editor/EditorSettings.js b/apps/mobile/src/views/Editor/EditorSettings.js
new file mode 100644
index 000000000..56daf8a1e
--- /dev/null
+++ b/apps/mobile/src/views/Editor/EditorSettings.js
@@ -0,0 +1,84 @@
+import React, {useEffect, useRef, useState} from 'react';
+import {View} from 'react-native';
+import ActionSheetWrapper from '../../components/ActionSheetComponent/ActionSheetWrapper';
+import BaseDialog from '../../components/Dialog/base-dialog';
+import DialogButtons from '../../components/Dialog/dialog-buttons';
+import DialogContainer from '../../components/Dialog/dialog-container';
+import DialogHeader from '../../components/Dialog/dialog-header';
+import Input from '../../components/Input';
+import Heading from '../../components/Typography/Heading';
+import {useTracked} from '../../provider';
+import {eSubscribeEvent, eUnSubscribeEvent} from '../../services/EventManager';
+import {SIZE} from '../../utils/SizeUtils';
+import {sleep} from '../../utils/TimeUtils';
+
+export const EditorSettings = () => {
+  const [state] = useTracked();
+  const {colors} = state;
+  const [visible, setVisible] = useState(false);
+  const [savePreset, setSavePreset] = useState(false);
+  const actionSheetRef = useRef();
+
+  const open = async () => {
+    console.log('called');
+    setVisible(true);
+    await sleep(1);
+    actionSheetRef.current?.setModalVisible(true);
+  };
+
+  const close = () => {
+    setVisible(false);
+  };
+
+  useEffect(() => {
+    eSubscribeEvent('openEditorSettings', open);
+    eSubscribeEvent('closeEditorSettings', close);
+    return () => {
+      eUnSubscribeEvent('openEditorSettings', open);
+      eUnSubscribeEvent('closeEditorSettings', close);
+    };
+  }, []);
+
+  return (
+    visible && (
+      <ActionSheetWrapper
+        fwdRef={actionSheetRef}
+        onClose={() => {
+          setVisible(false);
+        }}>
+        <View
+          style={{
+            paddingHorizontal: 12,
+          }}>
+          {savePreset && (
+            <BaseDialog visible={true}>
+              <DialogContainer>
+                <DialogHeader
+                  title="Save Preset"
+                  paragraph="Give this preset a name."
+                />
+                <Input placeholder="Preset name" />
+                <DialogButtons
+                  positiveTitle="Save"
+                  onPressPositive={() => {}}
+                  negativeTitle="Cancel"
+                />
+              </DialogContainer>
+            </BaseDialog>
+          )}
+
+          <DialogHeader
+            title="Editor Settings"
+            paragraph="Modify editor settings based on personal preference."
+            button={{
+              title: 'Save as Preset',
+              onPress: () => {},
+            }}
+          />
+
+		  
+        </View>
+      </ActionSheetWrapper>
+    )
+  );
+};