From e7edfd2cc03dfa2f54dbee28bdbd5c16ec293582 Mon Sep 17 00:00:00 2001
From: Nikolai <ni.tkachuk@yandex.ru>
Date: Sat, 1 Oct 2022 17:06:54 +0300
Subject: [PATCH] =?UTF-8?q?=D1=81=D1=81=D1=8B=D0=BB=D0=BA=D0=B8=20=D0=B2?=
 =?UTF-8?q?=20=D0=BB=D0=B5=D0=B2=D0=BE=D0=BC=20=D0=BC=D0=B5=D0=BD=D1=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                             |  2 +-
 package.json                                  |  2 +-
 .../Content/Tariffs/ModalMini/index.tsx       |  4 +--
 src/Components/LoggedIn/Menu/index.tsx        | 32 +++++++++++++------
 .../LoggedIn/ModalEntities/index.tsx          |  9 +++---
 src/Components/LoggedIn/ModalUser/index.tsx   |  9 +++---
 6 files changed, 37 insertions(+), 21 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 2562b25..b2246da 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,7 +29,7 @@
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-router-dom": "^6.3.0",
-        "react-scripts": "5.0.1",
+        "react-scripts": "^5.0.1",
         "styled-components": "^5.3.5",
         "typescript": "^4.8.2",
         "web-vitals": "^2.1.4",
diff --git a/package.json b/package.json
index 8e22967..c5063ca 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.3.0",
-    "react-scripts": "5.0.1",
+    "react-scripts": "^5.0.1",
     "styled-components": "^5.3.5",
     "typescript": "^4.8.2",
     "web-vitals": "^2.1.4",
diff --git a/src/Components/LoggedIn/Content/Tariffs/ModalMini/index.tsx b/src/Components/LoggedIn/Content/Tariffs/ModalMini/index.tsx
index 43d8e8e..2649ed7 100644
--- a/src/Components/LoggedIn/Content/Tariffs/ModalMini/index.tsx
+++ b/src/Components/LoggedIn/Content/Tariffs/ModalMini/index.tsx
@@ -31,8 +31,8 @@ const ModalMini = ({open, variant, close}: MWProps ) =>  {
             top: "50%",
             left: "50%",
             transform: "translate(-50%, -50%)",
-            width: "30%",
-            height: "25%",
+            width: "350px",
+            height: "220px",
             bgcolor: theme.palette.menu.main,
             boxShadow: 24,
             color: theme.palette.secondary.main,
diff --git a/src/Components/LoggedIn/Menu/index.tsx b/src/Components/LoggedIn/Menu/index.tsx
index 86e0f00..d4b6a40 100644
--- a/src/Components/LoggedIn/Menu/index.tsx
+++ b/src/Components/LoggedIn/Menu/index.tsx
@@ -1,5 +1,6 @@
 import * as React from "react";
 import { Box } from "@mui/material";
+import { useNavigate  } from "react-router-dom";
 import MenuOutlinedIcon from '@mui/icons-material/MenuOutlined';
 import PersonOutlineOutlinedIcon from '@mui/icons-material/PersonOutlineOutlined';
 import SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined';
@@ -13,6 +14,11 @@ import theme from "../../../theme";
 
 
 const Menu: React.FC = () =>  {
+  const navigate = useNavigate();
+  const pages = [ null, "users", "entities", "tariffs", "discounts", "promocode", null, null, "support" ];
+
+  const changePage = (page:number) => { navigate(`/${pages[ page ]}`); }
+
   return (
     <React.Fragment>
       <Box sx={{
@@ -20,7 +26,7 @@ const Menu: React.FC = () =>  {
         width: "96px",
         height: "100vh",
         borderRight: "1px solid #45494c",
-        overflow: "hidden"
+        overflow: "auto"
       }}>
         <Box sx={{
           width: "100%",
@@ -55,7 +61,8 @@ const Menu: React.FC = () =>  {
               <PersonOutlineOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }} 
+              onClick={ () => changePage( 1 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -69,7 +76,8 @@ const Menu: React.FC = () =>  {
               <SettingsOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }}
+              onClick={ () => changePage( 2 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -83,7 +91,8 @@ const Menu: React.FC = () =>  {
               <BathtubOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }} 
+              onClick={ () => changePage( 3 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -97,7 +106,8 @@ const Menu: React.FC = () =>  {
               <AddPhotoAlternateOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }}
+              onClick={ () => changePage( 4 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -111,7 +121,8 @@ const Menu: React.FC = () =>  {
               <NaturePeopleOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }}
+              onClick={ () => changePage( 5 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -125,7 +136,8 @@ const Menu: React.FC = () =>  {
               <SettingsIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }} />
+              }}
+              onClick={ () => changePage( 6 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -138,7 +150,8 @@ const Menu: React.FC = () =>  {
           }}>
               <CameraIcon sx={{
                 transform: "scale(1.2)"
-              }} />
+              }}
+              onClick={ () => changePage( 7 ) } />
           </Box>
           <Box sx={{
             width: "100%",
@@ -152,7 +165,8 @@ const Menu: React.FC = () =>  {
               <HeadsetMicOutlinedIcon sx={{
                 color: theme.palette.golden.main,
                 transform: "scale(1.2)"
-              }}/>
+              }}
+              onClick={ () => changePage( 8 ) } />
           </Box>
         </Box>
 
diff --git a/src/Components/LoggedIn/ModalEntities/index.tsx b/src/Components/LoggedIn/ModalEntities/index.tsx
index 8eceeb1..ef1cba7 100644
--- a/src/Components/LoggedIn/ModalEntities/index.tsx
+++ b/src/Components/LoggedIn/ModalEntities/index.tsx
@@ -85,8 +85,8 @@ const ModalEntities = ({open}: MWProps ) =>  {
             top: "50%",
             left: "50%",
             transform: "translate(-50%, -50%)",
-            width: "72%",
-            height: "60%",
+            width: "980px",
+            height: "480px",
             bgcolor: theme.palette.menu.main,
             boxShadow: 24,
             color: theme.palette.secondary.main,
@@ -153,8 +153,9 @@ const ModalEntities = ({open}: MWProps ) =>  {
                     disableSelectionOnClick
                     experimentalFeatures={{ newEditingApi: true }}
                     sx={{
-                      width: "700px",
-                      height: "400px",
+                      width: "720px",
+                      height: "350px",
+                      overflowY: "auto",
                       color: theme.palette.secondary.main,
                       "& .MuiDataGrid-iconSeparator": {
                         display: "none"
diff --git a/src/Components/LoggedIn/ModalUser/index.tsx b/src/Components/LoggedIn/ModalUser/index.tsx
index 37b98de..eba80ff 100644
--- a/src/Components/LoggedIn/ModalUser/index.tsx
+++ b/src/Components/LoggedIn/ModalUser/index.tsx
@@ -85,8 +85,8 @@ const ModalUser = ({open}: MWProps ) =>  {
             top: "50%",
             left: "50%",
             transform: "translate(-50%, -50%)",
-            width: "72%",
-            height: "60%",
+            width: "980px",
+            height: "480px",
             bgcolor: theme.palette.menu.main,
             boxShadow: 24,
             color: theme.palette.secondary.main,
@@ -153,9 +153,10 @@ const ModalUser = ({open}: MWProps ) =>  {
                     disableSelectionOnClick
                     experimentalFeatures={{ newEditingApi: true }}
                     sx={{
-                      width: "700px",
-                      height: "400px",
                       color: theme.palette.secondary.main,
+                      width: "720px",
+                      height: "350px",
+                      overflowY: "auto",
                       "& .MuiDataGrid-iconSeparator": {
                         display: "none"
                       },