From 52e23b7f851998a432b95441767c733b2dba133d Mon Sep 17 00:00:00 2001
From: Meliora Ho <nho10@fordham.edu>
Date: Sat, 23 Mar 2024 15:54:52 +0000
Subject: [PATCH] Format code better

---
 compass/app/auth/layout.tsx                   | 16 ++--
 compass/app/resource/layout.tsx               |  6 +-
 compass/app/resource/page.tsx                 |  2 +-
 compass/components/resource/Card.tsx          |  2 +-
 .../components/resource/LandingSearchBar.tsx  | 74 +++++++++----------
 compass/components/resource/Sidebar.tsx       | 30 ++++----
 compass/components/resource/SidebarItem.tsx   | 22 +++---
 7 files changed, 76 insertions(+), 76 deletions(-)

diff --git a/compass/app/auth/layout.tsx b/compass/app/auth/layout.tsx
index 4757eb7..1181fe6 100644
--- a/compass/app/auth/layout.tsx
+++ b/compass/app/auth/layout.tsx
@@ -1,6 +1,6 @@
 
 import Paper from '@/components/auth/Paper';
- 
+
 
 export default function RootLayout({
   // Layouts must accept a children prop.
@@ -11,12 +11,12 @@ export default function RootLayout({
 }) {
   return (
     <Paper>
-                <form  className="mb-0 m-auto mt-6 space-y-4 border border-gray-200 rounded-lg p-4 shadow-lg sm:p-6 lg:p-8 bg-white max-w-xl">
-            {children}
-         </form>
-         <p className="text-center mt-6 text-gray-500 text-xs">
-                    &copy; 2024 Compass Center
-                </p>
-         </Paper>
+      <form className="mb-0 m-auto mt-6 space-y-4 border border-gray-200 rounded-lg p-4 shadow-lg sm:p-6 lg:p-8 bg-white max-w-xl">
+        {children}
+      </form>
+      <p className="text-center mt-6 text-gray-500 text-xs">
+        &copy; 2024 Compass Center
+      </p>
+    </Paper>
   )
 }
\ No newline at end of file
diff --git a/compass/app/resource/layout.tsx b/compass/app/resource/layout.tsx
index db968f1..9cb94c9 100644
--- a/compass/app/resource/layout.tsx
+++ b/compass/app/resource/layout.tsx
@@ -2,7 +2,7 @@
 
 import Sidebar from '@/components/resource/Sidebar';
 import React, { useState } from 'react';
-import {ChevronDoubleRightIcon} from '@heroicons/react/24/outline'; 
+import { ChevronDoubleRightIcon } from '@heroicons/react/24/outline';
 
 export default function RootLayout({
 
@@ -19,11 +19,11 @@ export default function RootLayout({
                 className={`fixed z-20 p-2 text-gray-500 hover:text-gray-800 left-0`}
                 aria-label={'Open sidebar'}
             >
-                {!isSidebarOpen && 
+                {!isSidebarOpen &&
                     <ChevronDoubleRightIcon className="h-5 w-5" /> // Icon for closing the sidebar
                 }
             </button>
-            
+
             <div className={`absolute inset-y-0 left-0 transform ${isSidebarOpen ? 'translate-x-0' : '-translate-x-full'} w-64 transition duration-300 ease-in-out`}>
                 <Sidebar setIsSidebarOpen={setIsSidebarOpen} />
             </div>
diff --git a/compass/app/resource/page.tsx b/compass/app/resource/page.tsx
index cb9c5e9..4cd052a 100644
--- a/compass/app/resource/page.tsx
+++ b/compass/app/resource/page.tsx
@@ -20,7 +20,7 @@ export default function Page() {
                     <h1 className='font-bold text-2xl text-purple-800'>Compass Center Advocate Landing Page</h1>
                 </div>
                 <Callout>
-                    Welcome! Below you will find a list of resources for the Compass Center's trained advocates. These materials serve to virtually provide a collection of advocacy, resource, and hotline manuals and information. 
+                    Welcome! Below you will find a list of resources for the Compass Center's trained advocates. These materials serve to virtually provide a collection of advocacy, resource, and hotline manuals and information.
                     <b> If you are an advocate looking for the contact information of a particular Compass Center employee, please directly contact your staff back-up or the person in charge of your training.</b>
                 </Callout>
             </div>
diff --git a/compass/components/resource/Card.tsx b/compass/components/resource/Card.tsx
index d02152f..61cee1d 100644
--- a/compass/components/resource/Card.tsx
+++ b/compass/components/resource/Card.tsx
@@ -1,4 +1,4 @@
-import React, {ReactNode} from "react";
+import React, { ReactNode } from "react";
 
 
 interface TagProps {
diff --git a/compass/components/resource/LandingSearchBar.tsx b/compass/components/resource/LandingSearchBar.tsx
index c06d848..9b6f35c 100644
--- a/compass/components/resource/LandingSearchBar.tsx
+++ b/compass/components/resource/LandingSearchBar.tsx
@@ -3,43 +3,43 @@ import React, { useState } from 'react';
 import Image from 'next/image';
 
 export const LandingSearchBar: React.FC = () => {
-    const [searchTerm, setSearchTerm] = useState('');
-  
-    const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-      setSearchTerm(event.target.value);
-    };
-  
-    const clearSearch = () => {
-      setSearchTerm('');
-    };
-  
-    return (
-      <div className="max-w mx-auto">
-        <div className="flex items-center bg-white border border-gray-200 shadow rounded-md">
-          <div className="flex-grow">
-            <input
-              className="sm:text-sm text-gray-800 w-full px-6 py-3 rounded-md focus:outline-none"
-              type="text"
-              placeholder="Search..."
-              value={searchTerm}
-              onChange={handleSearchChange}
-            />
-          </div>
-          {searchTerm && (
-            <button
-              onClick={clearSearch}
-            >
-              <XMarkIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
-            </button>
-          )}
-          <div className="p-3">
-            <MagnifyingGlassIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
-          </div>
+  const [searchTerm, setSearchTerm] = useState('');
+
+  const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setSearchTerm(event.target.value);
+  };
+
+  const clearSearch = () => {
+    setSearchTerm('');
+  };
+
+  return (
+    <div className="max-w mx-auto">
+      <div className="flex items-center bg-white border border-gray-200 shadow rounded-md">
+        <div className="flex-grow">
+          <input
+            className="sm:text-sm text-gray-800 w-full px-6 py-3 rounded-md focus:outline-none"
+            type="text"
+            placeholder="Search..."
+            value={searchTerm}
+            onChange={handleSearchChange}
+          />
         </div>
-        <div className="flex flex-col pt-16 space-y-2 justify-center items-center">
-        <Image alt="Landing illustration" src="/landing_illustration.png" width={250} height={250} />
-        <h2 className="font-medium text-medium text-gray-800">Need to find something? Use the links above or the search bar to get your results.</h2>
+        {searchTerm && (
+          <button
+            onClick={clearSearch}
+          >
+            <XMarkIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
+          </button>
+        )}
+        <div className="p-3">
+          <MagnifyingGlassIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
         </div>
       </div>
-    );
-  };
+      <div className="flex flex-col pt-16 space-y-2 justify-center items-center">
+        <Image alt="Landing illustration" src="/landing_illustration.png" width={250} height={250} />
+        <h2 className="font-medium text-medium text-gray-800">Need to find something? Use the links above or the search bar to get your results.</h2>
+      </div>
+    </div>
+  );
+};
diff --git a/compass/components/resource/Sidebar.tsx b/compass/components/resource/Sidebar.tsx
index d50388b..ed2f726 100644
--- a/compass/components/resource/Sidebar.tsx
+++ b/compass/components/resource/Sidebar.tsx
@@ -6,37 +6,37 @@ interface SidebarProps {
   setIsSidebarOpen: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-const Sidebar: React.FC<SidebarProps> = ({setIsSidebarOpen}) => {
+const Sidebar: React.FC<SidebarProps> = ({ setIsSidebarOpen }) => {
   return (
     <div className="w-64 h-full border border-gray-200 bg-gray-50 px-4 shadow">
       <div className="flex justify-end">
         <button
-            onClick={() => setIsSidebarOpen(false)}
-            className="py-2 text-gray-500 hover:text-gray-800"
-            aria-label="Close sidebar"
+          onClick={() => setIsSidebarOpen(false)}
+          className="py-2 text-gray-500 hover:text-gray-800"
+          aria-label="Close sidebar"
         >
-            <ChevronDoubleLeftIcon className="h-5 w-5" />
+          <ChevronDoubleLeftIcon className="h-5 w-5" />
         </button>
       </div>
       <div className="flex flex-col space-y-8">
-      
+
         <div className="flex items-center p-4 space-x-2 border border-gray-200 rounded-md ">
-        
+
           <div className="flex flex-col items-start space-y-2">
             <div className="flex flex-col">
-                <span className="text-sm font-semibold text-gray-800">Compass Center</span>
-                <span className="text-xs text-gray-500">cssgunc@gmail.com</span>
+              <span className="text-sm font-semibold text-gray-800">Compass Center</span>
+              <span className="text-xs text-gray-500">cssgunc@gmail.com</span>
             </div>
             <button className="text-red-600 text-xs hover:underline mt-1">Sign out</button>
           </div>
         </div>
         <div className="flex flex-col space-y-2">
-        <h4 className="text-xs font-semibold text-gray-500">Pages</h4>
-        <nav className="flex flex-col">
-          <SidebarItem icon={<BookmarkIcon className="w-4 h-4 text-gray-500" />} text="Resources" />
-          <SidebarItem icon={<ClipboardIcon className="w-4 h-4 text-gray-500" />} text="Services" />
-          <SidebarItem icon={<BookOpenIcon className="w-4 h-4 text-gray-500" />} text="Training Manuals" />
-        </nav>
+          <h4 className="text-xs font-semibold text-gray-500">Pages</h4>
+          <nav className="flex flex-col">
+            <SidebarItem icon={<BookmarkIcon className="w-4 h-4 text-gray-500" />} text="Resources" />
+            <SidebarItem icon={<ClipboardIcon className="w-4 h-4 text-gray-500" />} text="Services" />
+            <SidebarItem icon={<BookOpenIcon className="w-4 h-4 text-gray-500" />} text="Training Manuals" />
+          </nav>
         </div>
       </div>
     </div>
diff --git a/compass/components/resource/SidebarItem.tsx b/compass/components/resource/SidebarItem.tsx
index 342a74b..52220c5 100644
--- a/compass/components/resource/SidebarItem.tsx
+++ b/compass/components/resource/SidebarItem.tsx
@@ -1,14 +1,14 @@
 
 interface SidebarItemProps {
-    icon: React.ReactElement;
-    text: string;
-  }
-  
+  icon: React.ReactElement;
+  text: string;
+}
+
 export const SidebarItem: React.FC<SidebarItemProps> = ({ icon, text }) => {
-    return (
-      <a href="#" className="flex items-center p-2 space-x-2 hover:bg-gray-200 rounded-md">
-        {icon}
-        <span className="flex-grow font-medium text-xs text-gray-500">{text}</span>
-      </a>
-    );
-  };
\ No newline at end of file
+  return (
+    <a href="#" className="flex items-center p-2 space-x-2 hover:bg-gray-200 rounded-md">
+      {icon}
+      <span className="flex-grow font-medium text-xs text-gray-500">{text}</span>
+    </a>
+  );
+};
\ No newline at end of file