From b84cf7c15de4117b829e3dd8a4519a20e9d49019 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Mon, 25 Mar 2024 15:14:52 -0500
Subject: [PATCH 01/12] fix: font weight added

---
 src/views/components/PopupMain.tsx               | 2 +-
 src/views/components/calendar/CalenderHeader.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/components/PopupMain.tsx b/src/views/components/PopupMain.tsx
index fe040933..abb485ea 100644
--- a/src/views/components/PopupMain.tsx
+++ b/src/views/components/PopupMain.tsx
@@ -112,7 +112,7 @@ export default function PopupMain(): JSX.Element {
                         <CourseStatus status='CANCELLED' size='mini' />
                     </div>
                     <div className='inline-flex items-center self-center gap-1'>
-                        <Text variant='mini' className='text-ut-gray'>
+                        <Text variant='mini' className='text-ut-gray font-normal'>
                             DATA LAST UPDATED: {getUpdatedAtDateTimeString(activeSchedule.updatedAt)}
                         </Text>
                         <button
diff --git a/src/views/components/calendar/CalenderHeader.tsx b/src/views/components/calendar/CalenderHeader.tsx
index 57a97bca..252efa05 100644
--- a/src/views/components/calendar/CalenderHeader.tsx
+++ b/src/views/components/calendar/CalenderHeader.tsx
@@ -51,7 +51,7 @@ export default function CalendarHeader({ onSidebarToggle }: CalendarHeaderProps)
                     totalCourses={activeSchedule.courses.length}
                 />
                 <div className='flex items-center gap-1 screenshot:hidden'>
-                    <Text variant='mini' className='text-ut-gray'>
+                    <Text variant='mini' className='text-ut-gray font-normal'>
                         DATA LAST UPDATED: {getUpdatedAtDateTimeString(activeSchedule.updatedAt)}
                     </Text>
                     <button className='inline-block h-4 w-4 bg-transparent p-0 btn'>

From 35b0d01c51b7e7f7034dfccd95bda604c34aee85 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Mon, 25 Mar 2024 15:16:30 -0500
Subject: [PATCH 02/12] fix: change color hex

---
 src/shared/types/ThemeColors.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/shared/types/ThemeColors.ts b/src/shared/types/ThemeColors.ts
index 318f8fac..179e2ad2 100644
--- a/src/shared/types/ThemeColors.ts
+++ b/src/shared/types/ThemeColors.ts
@@ -15,7 +15,7 @@ export const colors = {
         gray: '#9CADB7',
         offwhite: '#D6D2C4',
         concrete: '#95A5A6',
-        red: '#B91C1C', //   Not sure if this should be here, but it's used for remove course, and add course is ut-green
+        red: '#BF0000', //   Not sure if this should be here, but it's used for remove course, and add course is ut-green
     },
     theme: {
         red: '#AF2E2D',

From 5a73c8ee6c8d4184639d793176f7ce7642d3f9f9 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Mon, 25 Mar 2024 15:17:40 -0500
Subject: [PATCH 03/12] fix: change color again

---
 src/shared/types/ThemeColors.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/shared/types/ThemeColors.ts b/src/shared/types/ThemeColors.ts
index 179e2ad2..441b68d9 100644
--- a/src/shared/types/ThemeColors.ts
+++ b/src/shared/types/ThemeColors.ts
@@ -15,10 +15,10 @@ export const colors = {
         gray: '#9CADB7',
         offwhite: '#D6D2C4',
         concrete: '#95A5A6',
-        red: '#BF0000', //   Not sure if this should be here, but it's used for remove course, and add course is ut-green
+        red: '#B91C1C', //   Not sure if this should be here, but it's used for remove course, and add course is ut-green
     },
     theme: {
-        red: '#AF2E2D',
+        red: '#BF0000',
         black: '#1A2024',
     },
 } as const satisfies Record<string, Record<string, string>>;

From aeb19cff54a3b5508c16c081466f243601360463 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Mon, 25 Mar 2024 15:50:59 -0500
Subject: [PATCH 04/12] fix: text-ut-burntorange

---
 src/views/components/common/LogoIcon.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/components/common/LogoIcon.tsx b/src/views/components/common/LogoIcon.tsx
index a1e88030..19ce6817 100644
--- a/src/views/components/common/LogoIcon.tsx
+++ b/src/views/components/common/LogoIcon.tsx
@@ -30,7 +30,7 @@ export function SmallLogo({ className }: { className?: string }): JSX.Element {
             <LogoIcon />
             <div className='flex flex-col text-lg font-medium leading-[1em]'>
                 <p className='text-nowrap text-ut-burntorange'>UT Registration</p>
-                <p className='text-ut-orange'>
+                <p className='text-ut-burntorange'>
                     Plus{' '}
                     <span className='text-xs'>
                         {import.meta.env.VITE_BETA_BUILD ? `(${import.meta.env.VITE_PACKAGE_VERSION})` : ''}
@@ -53,7 +53,7 @@ export function LargeLogo({ className }: { className?: string }): JSX.Element {
             <LogoIcon className='h-12 w-12' />
             <div className='hidden flex-col text-[1.35rem] font-medium leading-[1em] md:flex screenshot:flex'>
                 <p className='text-nowrap text-ut-burntorange'>UT Registration</p>
-                <p className='text-ut-orange'>
+                <p className='text-ut-burntorange'>
                     Plus{' '}
                     <span className='text-sm'>
                         {import.meta.env.VITE_BETA_BUILD ? `(${import.meta.env.VITE_PACKAGE_VERSION})` : ''}

From 74cc6e6da1b704a92e121226dadf87bb3401f0ed Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Fri, 29 Mar 2024 00:51:25 -0500
Subject: [PATCH 05/12] fix: importance (tailwind wise)

---
 src/views/components/PopupMain.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/components/PopupMain.tsx b/src/views/components/PopupMain.tsx
index abb485ea..b84164b6 100644
--- a/src/views/components/PopupMain.tsx
+++ b/src/views/components/PopupMain.tsx
@@ -112,7 +112,7 @@ export default function PopupMain(): JSX.Element {
                         <CourseStatus status='CANCELLED' size='mini' />
                     </div>
                     <div className='inline-flex items-center self-center gap-1'>
-                        <Text variant='mini' className='text-ut-gray font-normal'>
+                        <Text variant='mini' className='text-ut-gray !font-normal'>
                             DATA LAST UPDATED: {getUpdatedAtDateTimeString(activeSchedule.updatedAt)}
                         </Text>
                         <button

From 4397dfb1c5dd4494f0b65c5cc80a51947d5552b4 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 12:25:16 -0500
Subject: [PATCH 06/12] feat: switch button initial test

---
 .../components/ToggleSwitch.stories.tsx       | 16 +++++++++++
 src/views/components/common/SwitchButton.tsx  | 28 +++++++++++++++++++
 2 files changed, 44 insertions(+)
 create mode 100644 src/stories/components/ToggleSwitch.stories.tsx
 create mode 100644 src/views/components/common/SwitchButton.tsx

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
new file mode 100644
index 00000000..8065427d
--- /dev/null
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import SwitchButton from 'src/views/components/common/SwitchButton';
+
+const meta = {
+    title: 'Components/Common/SwitchButton',
+    component: SwitchButton,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+    },
+} satisfies Meta<typeof SwitchButton>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};
diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
new file mode 100644
index 00000000..2ef94cc7
--- /dev/null
+++ b/src/views/components/common/SwitchButton.tsx
@@ -0,0 +1,28 @@
+import React, { useState } from 'react';
+import { Switch } from '@headlessui/react';
+
+interface ToggleSwitchProps {
+    label: string;
+    isChecked: boolean;
+    onChange: (checked: boolean) => void;
+}
+
+const SwitchButton: React.FC = () => {
+    const [enabled, setEnabled] = useState(true);
+
+    return (
+        <Switch
+            checked={enabled}
+            onChange={setEnabled}
+            className={`${enabled ? 'bg-[#579D42]' : 'bg-gray-400'} 
+          relative inline-flex items-center h-8 w-12 rounded-full transition-colors ease-in-out duration-200`}
+        >
+            <span
+                className={`${enabled ? 'translate-x-6' : 'translate-x-1'} 
+            inline-block w-6 h-6 transform bg-white rounded-full transition-transform ease-in-out duration-200`}
+            />
+        </Switch>
+    );
+};
+
+export default SwitchButton;

From b9358803ddbb6e3346a9d9825ae5be8d583d02e7 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 12:27:12 -0500
Subject: [PATCH 07/12] feat: look at how this switch goes back and forth very
 mindful very demure

---
 src/views/components/common/SwitchButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
index 2ef94cc7..ea6926ef 100644
--- a/src/views/components/common/SwitchButton.tsx
+++ b/src/views/components/common/SwitchButton.tsx
@@ -15,7 +15,7 @@ const SwitchButton: React.FC = () => {
             checked={enabled}
             onChange={setEnabled}
             className={`${enabled ? 'bg-[#579D42]' : 'bg-gray-400'} 
-          relative inline-flex items-center h-8 w-12 rounded-full transition-colors ease-in-out duration-200`}
+          relative inline-flex items-center h-8 w-13 rounded-full transition-colors ease-in-out duration-200`}
         >
             <span
                 className={`${enabled ? 'translate-x-6' : 'translate-x-1'} 

From 57832b0dd4928f6d87a3ccf06855b87d689fc4c3 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 12:43:08 -0500
Subject: [PATCH 08/12] fix: story

---
 src/stories/components/ToggleSwitch.stories.tsx |  6 +++++-
 src/views/components/common/SwitchButton.tsx    | 11 ++++++++---
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
index 8065427d..c96a87f6 100644
--- a/src/stories/components/ToggleSwitch.stories.tsx
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -13,4 +13,8 @@ const meta = {
 export default meta;
 type Story = StoryObj<typeof meta>;
 
-export const Default: Story = {};
+export const Default: Story = {
+    args: {
+        isChecked: true, // The SwitchButton will start in the "checked" state
+    },
+};
diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
index ea6926ef..817aa142 100644
--- a/src/views/components/common/SwitchButton.tsx
+++ b/src/views/components/common/SwitchButton.tsx
@@ -1,15 +1,20 @@
 import React, { useState } from 'react';
 import { Switch } from '@headlessui/react';
+import { useEffect } from 'react';
 
 interface ToggleSwitchProps {
-    label: string;
+    // label: string;
     isChecked: boolean;
-    onChange: (checked: boolean) => void;
+    // onChange: (checked: boolean) => void;
 }
 
-const SwitchButton: React.FC = () => {
+const SwitchButton: React.FC<ToggleSwitchProps> = ({ isChecked = true }) => {
     const [enabled, setEnabled] = useState(true);
 
+    useEffect(() => {
+        setEnabled(isChecked);
+    }, [isChecked]);
+
     return (
         <Switch
             checked={enabled}

From 5d9980cac3bebff40ca1d8bfe10519064e3869f6 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 12:43:45 -0500
Subject: [PATCH 09/12] feat: using type now

---
 src/stories/components/ToggleSwitch.stories.tsx |  2 +-
 src/views/components/common/SwitchButton.tsx    | 14 ++++++--------
 2 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
index c96a87f6..dee5ba4a 100644
--- a/src/stories/components/ToggleSwitch.stories.tsx
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -15,6 +15,6 @@ type Story = StoryObj<typeof meta>;
 
 export const Default: Story = {
     args: {
-        isChecked: true, // The SwitchButton will start in the "checked" state
+        isChecked: true,
     },
 };
diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
index 817aa142..8878be71 100644
--- a/src/views/components/common/SwitchButton.tsx
+++ b/src/views/components/common/SwitchButton.tsx
@@ -1,15 +1,13 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import { Switch } from '@headlessui/react';
-import { useEffect } from 'react';
 
-interface ToggleSwitchProps {
-    // label: string;
-    isChecked: boolean;
-    // onChange: (checked: boolean) => void;
-}
+type ToggleSwitchProps = {
+    isChecked?: boolean;
+    // onChange?: (checked: boolean) => void;
+};
 
 const SwitchButton: React.FC<ToggleSwitchProps> = ({ isChecked = true }) => {
-    const [enabled, setEnabled] = useState(true);
+    const [enabled, setEnabled] = useState(isChecked);
 
     useEffect(() => {
         setEnabled(isChecked);

From 7acc91f4eecdfcdb8cfb45f9e8628da670785b22 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 12:50:06 -0500
Subject: [PATCH 10/12] chore: fix lint

---
 src/stories/components/ToggleSwitch.stories.tsx | 2 +-
 src/views/components/common/SwitchButton.tsx    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
index dee5ba4a..4df05a19 100644
--- a/src/stories/components/ToggleSwitch.stories.tsx
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import SwitchButton from 'src/views/components/common/SwitchButton';
+import SwitchButton from '@views/components/common/SwitchButton';
 
 const meta = {
     title: 'Components/Common/SwitchButton',
diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
index 8878be71..52e61375 100644
--- a/src/views/components/common/SwitchButton.tsx
+++ b/src/views/components/common/SwitchButton.tsx
@@ -1,5 +1,5 @@
-import React, { useState, useEffect } from 'react';
 import { Switch } from '@headlessui/react';
+import React, { useEffect,useState } from 'react';
 
 type ToggleSwitchProps = {
     isChecked?: boolean;

From 703a0fa596d6384a949592e68c49ff153fe93812 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Wed, 4 Sep 2024 13:05:31 -0500
Subject: [PATCH 11/12] feat: button custom function prop

---
 src/stories/components/ToggleSwitch.stories.tsx |  2 +-
 src/views/components/common/SwitchButton.tsx    | 15 +++++++++++----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
index 4df05a19..dee5ba4a 100644
--- a/src/stories/components/ToggleSwitch.stories.tsx
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import SwitchButton from '@views/components/common/SwitchButton';
+import SwitchButton from 'src/views/components/common/SwitchButton';
 
 const meta = {
     title: 'Components/Common/SwitchButton',
diff --git a/src/views/components/common/SwitchButton.tsx b/src/views/components/common/SwitchButton.tsx
index 52e61375..5252e092 100644
--- a/src/views/components/common/SwitchButton.tsx
+++ b/src/views/components/common/SwitchButton.tsx
@@ -1,22 +1,29 @@
 import { Switch } from '@headlessui/react';
-import React, { useEffect,useState } from 'react';
+import React, { useEffect, useState } from 'react';
 
 type ToggleSwitchProps = {
     isChecked?: boolean;
-    // onChange?: (checked: boolean) => void;
+    onChange?: (checked: boolean) => void;
 };
 
-const SwitchButton: React.FC<ToggleSwitchProps> = ({ isChecked = true }) => {
+const SwitchButton: React.FC<ToggleSwitchProps> = ({ isChecked = true, onChange }) => {
     const [enabled, setEnabled] = useState(isChecked);
 
     useEffect(() => {
         setEnabled(isChecked);
     }, [isChecked]);
 
+    const handleChange = (checked: boolean) => {
+        setEnabled(checked);
+        if (onChange) {
+            onChange;
+        }
+    };
+
     return (
         <Switch
             checked={enabled}
-            onChange={setEnabled}
+            onChange={handleChange}
             className={`${enabled ? 'bg-[#579D42]' : 'bg-gray-400'} 
           relative inline-flex items-center h-8 w-13 rounded-full transition-colors ease-in-out duration-200`}
         >

From 0d63c663567000b4652261b8d5b1b97590edfb2a Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Sun, 8 Sep 2024 12:46:26 -0500
Subject: [PATCH 12/12] fix: styling

---
 src/stories/components/ToggleSwitch.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/stories/components/ToggleSwitch.stories.tsx b/src/stories/components/ToggleSwitch.stories.tsx
index dee5ba4a..4df05a19 100644
--- a/src/stories/components/ToggleSwitch.stories.tsx
+++ b/src/stories/components/ToggleSwitch.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import SwitchButton from 'src/views/components/common/SwitchButton';
+import SwitchButton from '@views/components/common/SwitchButton';
 
 const meta = {
     title: 'Components/Common/SwitchButton',