From 95b0da1239413be29e017039f61530e653e743cb Mon Sep 17 00:00:00 2001
From: danieldeng2 <danieldeng223@gmail.com>
Date: Wed, 5 Aug 2020 15:30:05 +0100
Subject: [PATCH] Change names for leftbar options

---
 frontend/src/components/App.tsx                      |  8 ++++----
 frontend/src/components/organisms/LeftBar/index.tsx  |  4 ++--
 .../components/organisms/LeftBar/style.module.scss   | 12 ++++++------
 frontend/src/components/pages/StandardView/index.tsx |  6 +++---
 .../src/components/pages/StandardView/style.scss     |  4 ++--
 5 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/frontend/src/components/App.tsx b/frontend/src/components/App.tsx
index f100fd5cc..2fd7a7bdf 100644
--- a/frontend/src/components/App.tsx
+++ b/frontend/src/components/App.tsx
@@ -12,19 +12,19 @@ import {
 import StandardView from "./pages/StandardView";
 
 type MyState = {
-  isToggled: boolean;
+  toggledLeft: boolean;
 };
 
 class App extends React.Component<{}, MyState> {
   constructor(props: {}) {
     super(props);
-    this.state = { isToggled: false };
+    this.state = { toggledLeft: false };
   }
 
   toggleLeftBar(e: React.MouseEvent<HTMLElement>) {
     e.preventDefault();
     this.setState((state) => ({
-      isToggled: !state.isToggled,
+      toggledLeft: !state.toggledLeft,
     }));
   }
 
@@ -45,7 +45,7 @@ class App extends React.Component<{}, MyState> {
 
         <StandardView
           pages={horizontalBarPages}
-					isToggled={this.state.isToggled}
+					toggledLeft={this.state.toggledLeft}
 					onOverlayClick={(e) => this.toggleLeftBar(e)}
         />
 
diff --git a/frontend/src/components/organisms/LeftBar/index.tsx b/frontend/src/components/organisms/LeftBar/index.tsx
index 9e7203e78..cb28f83a4 100644
--- a/frontend/src/components/organisms/LeftBar/index.tsx
+++ b/frontend/src/components/organisms/LeftBar/index.tsx
@@ -4,8 +4,8 @@ import styles from "./style.module.scss"
 
 const LeftBar: React.FC = () => {
   return (
-    <div id={styles.sidebarWrapper}>
-      <p className={styles.sidebarStatus}>1 UPDATE</p>
+    <div id={styles.leftbarWrapper}>
+      <p className={styles.leftbarStatus}>1 UPDATE</p>
       <LeftBarTabGroup />
     </div>
   );
diff --git a/frontend/src/components/organisms/LeftBar/style.module.scss b/frontend/src/components/organisms/LeftBar/style.module.scss
index 142018d6d..9c44843eb 100644
--- a/frontend/src/components/organisms/LeftBar/style.module.scss
+++ b/frontend/src/components/organisms/LeftBar/style.module.scss
@@ -1,6 +1,6 @@
 @import "assets/scss/custom";
 
-#sidebarWrapper {
+#leftbarWrapper {
   position: fixed;
   left: 250px;
   width: 0;
@@ -18,13 +18,13 @@
 	z-index: 5000;
 }
 
-:global(#wrapper.toggled) #sidebarWrapper {
+:global(#wrapper.toggledLeft) #leftbarWrapper {
 	width: 250px;
 }
 
 
 @media (max-width: 992px) {
-  .sidebarStatus {
+  .leftbarStatus {
     margin-top: 30px;
     margin-left: 16px;
     margin-right: 16px;
@@ -40,7 +40,7 @@
 }
 
 @media (min-width: 992px) {
-  .sidebarStatus {
+  .leftbarStatus {
     margin-top: 30px;
     margin-left: 32px;
     margin-right: 32px;
@@ -52,11 +52,11 @@
     width: max-content;
 	}
 	
-	#sidebarWrapper {
+	#leftbarWrapper {
     width: 250px;
 	}
 	
-	:global(#wrapper.toggled) #sidebarWrapper{
+	:global(#wrapper.toggledLeft) #leftbarWrapper{
     width: 0;
   }
 }
diff --git a/frontend/src/components/pages/StandardView/index.tsx b/frontend/src/components/pages/StandardView/index.tsx
index a51093335..e7739f2d5 100644
--- a/frontend/src/components/pages/StandardView/index.tsx
+++ b/frontend/src/components/pages/StandardView/index.tsx
@@ -9,13 +9,13 @@ interface StandardViewProps {
     name: string;
     path: string;
   }[];
-	isToggled: boolean;
+	toggledLeft: boolean;
   onOverlayClick: (event: React.MouseEvent<HTMLElement>) => void;
 }
 
 const StandardView: React.FC<StandardViewProps> = ({
   pages,
-	isToggled,
+	toggledLeft,
 	onOverlayClick,
 }: StandardViewProps) => {
   const topBarRoutes = pages.map(({ name, path }) => (
@@ -25,7 +25,7 @@ const StandardView: React.FC<StandardViewProps> = ({
   ));
 
   return (
-    <div id="wrapper" className={isToggled ? "toggled" : ""}>
+    <div id="wrapper" className={toggledLeft ? "toggledLeft" : ""}>
       <LeftBar />
 			<div id="sidenav-overlay" onClick={e => onOverlayClick(e)}></div>
       <Switch>
diff --git a/frontend/src/components/pages/StandardView/style.scss b/frontend/src/components/pages/StandardView/style.scss
index 89bbb12f7..752b81140 100644
--- a/frontend/src/components/pages/StandardView/style.scss
+++ b/frontend/src/components/pages/StandardView/style.scss
@@ -27,13 +27,13 @@
     padding-left: 250px;
   }
 
-  #wrapper.toggled {
+  #wrapper.toggledLeft {
     padding-left: 0;
   }
 }
 
 @media (max-width: 992px) {
-  #wrapper.toggled #sidenav-overlay {
+  #wrapper.toggledLeft #sidenav-overlay {
 		visibility:visible;
 		background-color: rgba(0, 0, 0, 0.3);
   }
-- 
GitLab