From 9d4e3dba74945e309df2bf525bba020d37ebef32 Mon Sep 17 00:00:00 2001
From: Ammielle WB <61096548+ammiellewb@users.noreply.github.com>
Date: Mon, 22 Jul 2024 21:33:43 -0400
Subject: [PATCH 1/3] Update SideBar.tsx

---
 frontend/src/components/common/SideBar.tsx | 40 +++++++++-------------
 1 file changed, 16 insertions(+), 24 deletions(-)

diff --git a/frontend/src/components/common/SideBar.tsx b/frontend/src/components/common/SideBar.tsx
index 5f91076a..d8166bc0 100644
--- a/frontend/src/components/common/SideBar.tsx
+++ b/frontend/src/components/common/SideBar.tsx
@@ -101,29 +101,14 @@ const SideBar: React.FC = () => {
         pt={10}
         pr={4}
         pl={4}
+        display="flex"
+        flexDirection="column"
+        justifyContent="space-between"
       >
         <Flex flexDir="column" alignItems="space-between" h="100%">
           <Flex flexDir="column" h="100%">
-            <Flex flexDir="column" alignItems="flex-start" w="100%">
-              <Box
-                border="solid"
-                borderColor="gray.300"
-                borderRadius="8px"
-                pl={2}
-                pr={2}
-                w="100%"
-              >
-                <Flex align="center">
-                  {/* <Avatar name="Jane Doe" src="https://bit.ly/2k1H1t6" /> */}
-                  <Flex flexDir="column" ml={4}>
-                    <Heading size="sm" mt={4}>
-                      {authenticatedUser?.firstName}{" "}
-                      {authenticatedUser?.lastName}
-                    </Heading>
-                    <Text>Administrative Staff</Text>
-                  </Flex>
-                </Flex>
-              </Box>
+            <Flex flexDir="column" alignItems="column" maxW="250px" ml={4}>
+              <Logo width="75%" />
             </Flex>
 
             <Tabs
@@ -144,10 +129,17 @@ const SideBar: React.FC = () => {
             </Tabs>
           </Flex>
 
-          <Flex alignItems="center">
-            <Logo width="75%" />
-            <Button variant="primary" ml={3} onClick={onLogOutClick}>
-              Logout
+          <Flex flexDirection="column" alignItems="left" mb={10}>
+          <Text fontWeight="bold" mb="3">Administrative Staff</Text>
+            
+            <Button 
+              variant="outline"
+              borderColor="gray.400"
+              color="red.500"
+              onClick={onLogOutClick}
+              width="fit-content"
+            >
+              Sign out
             </Button>
           </Flex>
         </Flex>

From 0d20bc62fee8e0707be4bc0ea89257e0bdf67ead Mon Sep 17 00:00:00 2001
From: KathleenX7 <kxiong1210@gmail.com>
Date: Wed, 24 Jul 2024 21:02:12 -0400
Subject: [PATCH 2/3] further update sidebar

---
 frontend/src/assets/marillacPlaceLogo.svg  |  2 +-
 frontend/src/components/common/SideBar.tsx | 35 ++++++++++++----------
 2 files changed, 21 insertions(+), 16 deletions(-)

diff --git a/frontend/src/assets/marillacPlaceLogo.svg b/frontend/src/assets/marillacPlaceLogo.svg
index c87e075d..604b5fc6 100644
--- a/frontend/src/assets/marillacPlaceLogo.svg
+++ b/frontend/src/assets/marillacPlaceLogo.svg
@@ -1,4 +1,4 @@
-<svg width="253" height="122" viewBox="0 0 253 122" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="253" viewBox="0 0 253 122" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <path d="M0 0H253V122H0V0Z" fill="url(#pattern0)"/>
 <path d="M185 68H234V107H185V68Z" fill="url(#pattern1)"/>
 <defs>
diff --git a/frontend/src/components/common/SideBar.tsx b/frontend/src/components/common/SideBar.tsx
index d8166bc0..1a9e1d33 100644
--- a/frontend/src/components/common/SideBar.tsx
+++ b/frontend/src/components/common/SideBar.tsx
@@ -41,6 +41,8 @@ const SideBarTab: React.FC<{ label: string; handleClick: () => void }> = ({
     <Tab
       borderRadius="8px"
       textAlign="left"
+      fontWeight={500}
+      color="black"
       justifyContent="stretch"
       onClick={handleClick}
       pt={1}
@@ -85,20 +87,21 @@ const SideBar: React.FC = () => {
     (page) => page.route === window.location.pathname,
   );
 
-  const sidebarWidth = useBreakpointValue({
-    base: "100%",
-    md: "50%",
-    lg: "30%",
-    xl: "18.5%",
-  });
+  // const sidebarWidth = useBreakpointValue({
+  //   base: "100%",
+  //   md: "100%",
+  //   lg: "10%",
+  //   xl: "10%",
+  // });
 
   return (
-    <Flex flexDir="column" w={sidebarWidth}>
+    <Flex flexDir="column" w="100%" maxW="240px">
       <Box
         h="100vh"
         borderRight="solid"
         borderRightColor="gray.300"
-        pt={10}
+        pt={6}
+        pb={6}
         pr={4}
         pl={4}
         display="flex"
@@ -107,8 +110,8 @@ const SideBar: React.FC = () => {
       >
         <Flex flexDir="column" alignItems="space-between" h="100%">
           <Flex flexDir="column" h="100%">
-            <Flex flexDir="column" alignItems="column" maxW="250px" ml={4}>
-              <Logo width="75%" />
+            <Flex flexDir="column" alignItems="column" maxW="250px">
+              <Logo width="85%" />
             </Flex>
 
             <Tabs
@@ -129,14 +132,16 @@ const SideBar: React.FC = () => {
             </Tabs>
           </Flex>
 
-          <Flex flexDirection="column" alignItems="left" mb={10}>
-          <Text fontWeight="bold" mb="3">Administrative Staff</Text>
+          <Flex flexDirection="column" alignItems="left">
+            <Text whiteSpace="nowrap" fontWeight="bold" mb="3">Administrative Staff</Text>
             
             <Button 
-              variant="outline"
-              borderColor="gray.400"
-              color="red.500"
+              variant="del"
               onClick={onLogOutClick}
+              border="1px solid #C5C8D8"
+              color="#B21D2F"
+              fontWeight={400}
+              fontSize="14px"
               width="fit-content"
             >
               Sign out

From 11de6948521233052e078cbe6130e60b10030ecc Mon Sep 17 00:00:00 2001
From: Jesse Huang <87463074+jeessh@users.noreply.github.com>
Date: Fri, 20 Sep 2024 14:03:24 -0400
Subject: [PATCH 3/3] updated sidebar to new design (removed approvals)

---
 frontend/src/App.tsx                                  |  9 ---------
 frontend/src/components/common/SideBar.tsx            |  9 +++++----
 .../src/components/pages/approvals/ApprovalsPage.tsx  | 11 -----------
 frontend/src/constants/Routes.ts                      |  2 --
 4 files changed, 5 insertions(+), 26 deletions(-)
 delete mode 100644 frontend/src/components/pages/approvals/ApprovalsPage.tsx

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 4e361f4d..565b789f 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -30,7 +30,6 @@ import SignupPage from "./components/auth/SignupPage";
 import ResetPasswordPage from "./components/auth/ResetPasswordPage";
 import AnnouncementsPage from "./components/pages/announcements/AnnouncementsPage";
 import TasksPage from "./components/pages/tasks/TasksPage";
-import ApprovalsPage from "./components/pages/approvals/ApprovalsPage";
 import SchedulePage from "./components/pages/schedule/SchedulePage";
 import ResidentsPage from "./components/pages/residents/ResidentsPage";
 import InsightsPage from "./components/pages/insights/InsightsPage";
@@ -96,14 +95,6 @@ const App = (): React.ReactElement => {
                     </PrivateRoute>
                   }
                 />
-                <Route
-                  path={Routes.APPROVALS_PAGE}
-                  element={
-                    <PrivateRoute>
-                      <ApprovalsPage />
-                    </PrivateRoute>
-                  }
-                />
                 <Route
                   path={Routes.SCHEDULE_PAGE}
                   element={
diff --git a/frontend/src/components/common/SideBar.tsx b/frontend/src/components/common/SideBar.tsx
index 1a9e1d33..1d6630ca 100644
--- a/frontend/src/components/common/SideBar.tsx
+++ b/frontend/src/components/common/SideBar.tsx
@@ -77,7 +77,6 @@ const SideBar: React.FC = () => {
     { label: "Home", route: Routes.HOME_PAGE }, // NEED NEW HOME PAGE
     { label: "Schedule", route: Routes.SCHEDULE_PAGE },
     { label: "Announcements", route: Routes.HOME_PAGE }, // NEED NEW NAME
-    { label: "Approvals", route: Routes.APPROVALS_PAGE },
     { label: "Participants", route: Routes.RESIDENTS_PAGE }, // RESIDENTS/PARTICIPANTS
     { label: "Task List", route: Routes.TASKS_PAGE },
     // { label: "Insights", route: Routes.INSIGHTS_PAGE },
@@ -133,9 +132,11 @@ const SideBar: React.FC = () => {
           </Flex>
 
           <Flex flexDirection="column" alignItems="left">
-            <Text whiteSpace="nowrap" fontWeight="bold" mb="3">Administrative Staff</Text>
-            
-            <Button 
+            <Text whiteSpace="nowrap" fontWeight="bold" mb="3">
+              Administrative Staff
+            </Text>
+
+            <Button
               variant="del"
               onClick={onLogOutClick}
               border="1px solid #C5C8D8"
diff --git a/frontend/src/components/pages/approvals/ApprovalsPage.tsx b/frontend/src/components/pages/approvals/ApprovalsPage.tsx
deleted file mode 100644
index 92f5a416..00000000
--- a/frontend/src/components/pages/approvals/ApprovalsPage.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from "react";
-
-const ApprovalsPage = (): React.ReactElement => {
-  return (
-    <div>
-      <h1>Approvals Page</h1>
-    </div>
-  );
-};
-
-export default ApprovalsPage;
diff --git a/frontend/src/constants/Routes.ts b/frontend/src/constants/Routes.ts
index 7b1fd83f..90c8ccad 100644
--- a/frontend/src/constants/Routes.ts
+++ b/frontend/src/constants/Routes.ts
@@ -8,8 +8,6 @@ export const RESET_PASSWORD_PAGE = "/reset-password";
 
 export const TASKS_PAGE = "/tasks";
 
-export const APPROVALS_PAGE = "/approvals";
-
 export const SCHEDULE_PAGE = "/schedule";
 
 export const RESIDENTS_PAGE = "/residents";