From 13b22af5a56175a5532bb6fafe405e0ecf49e68a Mon Sep 17 00:00:00 2001
From: Robson Tenorio <robson.tenorio@gmail.com>
Date: Tue, 5 Apr 2022 11:27:12 -0300
Subject: [PATCH] Iniciar com o menu lateral fechado

---
 .../20200904070004-create-default-settings.ts |   6 +
 frontend/src/layout/index.js                  |  19 ++-
 frontend/src/pages/Settings/index.js          | 137 +++++++++++-------
 frontend/src/translate/languages/en.js        |   8 +
 frontend/src/translate/languages/es.js        |   8 +
 frontend/src/translate/languages/pt.js        |   8 +
 6 files changed, 131 insertions(+), 55 deletions(-)

diff --git a/backend/src/database/seeds/20200904070004-create-default-settings.ts b/backend/src/database/seeds/20200904070004-create-default-settings.ts
index 95f81393..a14810b0 100644
--- a/backend/src/database/seeds/20200904070004-create-default-settings.ts
+++ b/backend/src/database/seeds/20200904070004-create-default-settings.ts
@@ -23,6 +23,12 @@ module.exports = {
           createdAt: new Date(),
           updatedAt: new Date()
         },
+        {
+          key: "sideMenu",
+          value: "disabled",
+          createdAt: new Date(),
+          updatedAt: new Date()
+        },
         {
           key: "timeCreateNewTicket",
           value: "10",
diff --git a/frontend/src/layout/index.js b/frontend/src/layout/index.js
index bb7bc580..9c3ae7b4 100644
--- a/frontend/src/layout/index.js
+++ b/frontend/src/layout/index.js
@@ -25,6 +25,8 @@ import { AuthContext } from "../context/Auth/AuthContext";
 import BackdropLoading from "../components/BackdropLoading";
 import { i18n } from "../translate/i18n";
 
+import api from "../services/api";
+import toastError from "../errors/toastError";
 import logodash from "../assets/logo-dash.png";
 
 const drawerWidth = 240;
@@ -122,8 +124,21 @@ const LoggedInLayout = ({ children }) => {
   const { user } = useContext(AuthContext);
 
   useEffect(() => {
-    if (document.body.offsetWidth < 100) {
-      setDrawerOpen(true);
+    if (document.body.offsetWidth > 600) {
+      const fetchDrawerState = async () => {
+        try {
+          const { data } = await api.get("/settings");
+
+          const settingIndex = data.filter(s => s.key === 'sideMenu');
+
+          setDrawerOpen(settingIndex[0].value === "disabled" ? false : true);
+
+        } catch (err) {
+          setDrawerOpen(true);
+          toastError(err);
+        }
+      };
+      fetchDrawerState();
     }
   }, []);
 
diff --git a/frontend/src/pages/Settings/index.js b/frontend/src/pages/Settings/index.js
index db90dc72..40266ba4 100644
--- a/frontend/src/pages/Settings/index.js
+++ b/frontend/src/pages/Settings/index.js
@@ -124,7 +124,90 @@ const Settings = () => {
 						</option>
 					</Select>
 				</Paper>
-							
+
+				<Typography variant="body2" gutterBottom></Typography>
+				<Tooltip title={i18n.t("settings.settings.call.note")}>
+					<Paper className={classes.paper}>
+
+						<Typography variant="body1">
+							{i18n.t("settings.settings.call.name")}
+						</Typography>
+						<Select
+							margin="dense"
+							variant="outlined"
+							native
+							id="call-setting"
+							name="call"
+							value={
+								settings && settings.length > 0 && getSettingValue("call")
+							}
+							className={classes.settingOption}
+							onChange={handleChangeSetting}
+						>
+							<option value="enabled">
+								{i18n.t("settings.settings.call.options.enabled")}
+							</option>
+							<option value="disabled">
+								{i18n.t("settings.settings.call.options.disabled")}
+							</option>
+						</Select>
+					</Paper>
+				</Tooltip>
+
+				<Typography variant="body2" gutterBottom></Typography>
+				<Paper className={classes.paper}>
+					<Typography variant="body1">
+						{i18n.t("settings.settings.CheckMsgIsGroup.name")}
+					</Typography>
+					<Select
+						margin="dense"
+						variant="outlined"
+						native
+						id="CheckMsgIsGroup-setting"
+						name="CheckMsgIsGroup"
+						value={
+							settings && settings.length > 0 && getSettingValue("CheckMsgIsGroup")
+						}
+						className={classes.settingOption}
+						onChange={handleChangeSetting}
+					>
+						<option value="enabled">
+							{i18n.t("settings.settings.CheckMsgIsGroup.options.enabled")}
+						</option>
+						<option value="disabled">
+							{i18n.t("settings.settings.CheckMsgIsGroup.options.disabled")}
+						</option>
+					</Select>
+				</Paper>
+
+				<Typography variant="body2" gutterBottom></Typography>
+				<Tooltip title={i18n.t("settings.settings.sideMenu.note")}>
+					<Paper className={classes.paper} elevation={3}>
+						<Typography variant="body1">
+							{i18n.t("settings.settings.sideMenu.name")}
+						</Typography>
+						<Select
+							margin="dense"
+							variant="outlined"
+							native
+							id="sideMenu-setting"
+							name="sideMenu"
+							value={
+								settings && settings.length > 0 && getSettingValue("sideMenu")
+							}
+							className={classes.settingOption}
+							onChange={handleChangeSetting}
+						>
+							<option value="enabled">
+								{i18n.t("settings.settings.sideMenu.options.enabled")}
+							</option>
+							<option value="disabled">
+								{i18n.t("settings.settings.sideMenu.options.disabled")}
+							</option>
+						</Select>
+					</Paper>
+				</Tooltip>
+
 				<Typography variant="body2" gutterBottom></Typography>
 				<Tooltip title={i18n.t("settings.settings.timeCreateNewTicket.note")}>
 					<Paper className={classes.paper} elevation={3}>
@@ -174,58 +257,6 @@ const Settings = () => {
 					</Paper>
 				</Tooltip>
 
-				<Typography variant="body2" gutterBottom></Typography>
-				<Paper className={classes.paper}>
-
-					<Typography variant="body1">
-						{i18n.t("settings.settings.call.name")}
-					</Typography>
-					<Select
-						margin="dense"
-						variant="outlined"
-						native
-						id="call-setting"
-						name="call"
-						value={
-							settings && settings.length > 0 && getSettingValue("call")
-						}
-						className={classes.settingOption}
-						onChange={handleChangeSetting}
-					>
-						<option value="enabled">
-							{i18n.t("settings.settings.call.options.enabled")}
-						</option>
-						<option value="disabled">
-							{i18n.t("settings.settings.call.options.disabled")}
-						</option>
-					</Select>
-				</Paper>
-
-				<Paper className={classes.paper}>
-					<Typography variant="body1">
-						{i18n.t("settings.settings.CheckMsgIsGroup.name")}
-					</Typography>
-					<Select
-						margin="dense"
-						variant="outlined"
-						native
-						id="CheckMsgIsGroup-setting"
-						name="CheckMsgIsGroup"
-						value={
-							settings && settings.length > 0 && getSettingValue("CheckMsgIsGroup")
-						}
-						className={classes.settingOption}
-						onChange={handleChangeSetting}
-					>
-						<option value="enabled">
-							{i18n.t("settings.settings.CheckMsgIsGroup.options.enabled")}
-						</option>
-						<option value="disabled">
-							{i18n.t("settings.settings.CheckMsgIsGroup.options.disabled")}
-						</option>
-					</Select>
-				</Paper>
-
 			</Container>
 		</div>
 	);
diff --git a/frontend/src/translate/languages/en.js b/frontend/src/translate/languages/en.js
index 6bd44343..f40ee753 100644
--- a/frontend/src/translate/languages/en.js
+++ b/frontend/src/translate/languages/en.js
@@ -395,6 +395,14 @@ const messages = {
           disabled: "Disabled",
         },
       },
+      sideMenu: {
+        name: "Home Side Menu",
+        note: "If enabled, the side menu will start closed",
+        options: {
+          enabled: "Open",
+          disabled: "Closed",
+        },
+      },
       messagesList: {
         header: {
           assignedTo: "Assigned to:",
diff --git a/frontend/src/translate/languages/es.js b/frontend/src/translate/languages/es.js
index 521e3c71..64f495ec 100644
--- a/frontend/src/translate/languages/es.js
+++ b/frontend/src/translate/languages/es.js
@@ -385,6 +385,14 @@ const messages = {
           disabled: "Deshabilitado",
         },
       },
+      sideMenu: {
+        name: "Menú lateral de inicio",
+        note: "Si está habilitado, el menú lateral comenzará cerrado",
+        options: {
+          enabled: "Abrir",
+          disabled: "Cerrado",
+        },
+      },
       timeCreateNewTicket: {
         name: "Crear nuevo ticket después",
         note: "Selecciona el tiempo que tardará en abrir un nuevo ticket si el cliente te vuelve a contactar",
diff --git a/frontend/src/translate/languages/pt.js b/frontend/src/translate/languages/pt.js
index af7a71da..026385cd 100644
--- a/frontend/src/translate/languages/pt.js
+++ b/frontend/src/translate/languages/pt.js
@@ -401,6 +401,14 @@ const messages = {
               disabled: "Desativado",
             },
           },
+          sideMenu: {
+            name: "Menu Lateral Inicial",
+            note: "Se habilitado, o menu lateral irá iniciar fechado",
+            options: {
+              enabled: "Aberto",
+              disabled: "Fechado",
+            },
+          },
           timeCreateNewTicket: {
             name: "Cria novo ticket após",
             note: "Selecione o tempo que será necessário para abrir um novo ticket, caso o cliente entre em contatos novamente",