From b98646727d30fef86a4f1da1871ff07b4540aa4c Mon Sep 17 00:00:00 2001
From: m1chelle7 <mmellee.xu7@gmail.com>
Date: Sun, 14 Apr 2024 14:27:09 -0500
Subject: [PATCH 1/2] Added count of users shown (user directory)

---
 src/pages/UserDirectory/UserDirectory.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/pages/UserDirectory/UserDirectory.tsx b/src/pages/UserDirectory/UserDirectory.tsx
index 398d779..d5e2d56 100644
--- a/src/pages/UserDirectory/UserDirectory.tsx
+++ b/src/pages/UserDirectory/UserDirectory.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useAuth } from "../../AuthContext";
-import { Stack, Button, Group } from "@mantine/core";
+import { Stack, Button, Group, Text} from "@mantine/core";
 import { IconPlus, IconX } from "@tabler/icons-react";
 import Register from "../Auth/Register";
 import Partner from "./PartnerClass";
@@ -138,6 +138,7 @@ const UserDirectory: React.FC = () => {
                 <Group className="background-bubble-light-1" justify="space-between">
                     <Group>
                         <SearchBar searchVal={searchVal} searchFunc={searchFunc} classes="background-light"></SearchBar>
+                    
                         <Button
                             onClick={toggleShowStaff}
                             className={showStaff ? "button-chosen" : "button-not-chosen"}
@@ -148,6 +149,9 @@ const UserDirectory: React.FC = () => {
                             className={showPartners ? "button-chosen" : "button-not-chosen"}
                             rightSection={showPartners && <IconX height={"1rem"}></IconX>}
                         >Partners</Button>
+                        <Text>
+                            {shownUsers.length} / {users.length}
+                        </Text>
                     </Group>
 
                     <UserSorter users={shownUsers} setUsers={setShownUsers} whichSorters={["Name", "Reverse"]} wrapperClasses="background-light" classes="button-transparent"></UserSorter>

From be859f2735e3cbcb194d5243ffb674a195c6aca2 Mon Sep 17 00:00:00 2001
From: m1chelle7 <mmellee.xu7@gmail.com>
Date: Sun, 14 Apr 2024 18:20:38 -0500
Subject: [PATCH 2/2] Shifted pencil icon (order tracking)

---
 src/pages/OrderTracking/OrderTable.tsx | 35 ++++++++++++++------------
 src/styles/OrderTracking.css           |  2 ++
 2 files changed, 21 insertions(+), 16 deletions(-)

diff --git a/src/pages/OrderTracking/OrderTable.tsx b/src/pages/OrderTracking/OrderTable.tsx
index a47e1bc..3cf24f1 100644
--- a/src/pages/OrderTracking/OrderTable.tsx
+++ b/src/pages/OrderTracking/OrderTable.tsx
@@ -84,21 +84,6 @@ const OrderTable: React.FC<TableProps> = ({
 
     const rows = orderCut?.map((val: Order, index: number) => (
         <Table.Tr key={index}>
-            <Table.Td>
-                <OrderPopup order={val}>
-                    <ActionIcon
-                        variant="filled"
-                        color="var(--primary-color)"
-                        radius="xl"
-                        aria-label="Edit Order"
-                    >
-                        <IconPencil
-                            style={{ width: "70%", height: "70%" }}
-                            stroke={1.5}
-                        />
-                    </ActionIcon>
-                </OrderPopup>
-            </Table.Td>
             <Table.Td ta="center">{index + 1}</Table.Td>
             <Table.Td ta="center">{val.location}</Table.Td>
             <Table.Td ta="center">{val.datePlaced.toDateString()}</Table.Td>
@@ -130,6 +115,24 @@ const OrderTable: React.FC<TableProps> = ({
                     </Flex>
                 </Flex>
             </Table.Td>
+            <Table.Td>
+                <OrderPopup order={val}>
+                    <ActionIcon
+                        variant="filled"
+                        color="white"
+                        // color="var(--primary-color)"
+                        radius="xl"
+                        aria-label="Edit Order"
+                        style={{ '--ai-hover': 'var(--background-color)' }}
+                    >
+                        <IconPencil
+                            style={{ width: "70%", height: "70%" }}
+                            color="black"
+                            stroke={1.5}
+                        />
+                    </ActionIcon>
+                </OrderPopup>
+            </Table.Td>
         </Table.Tr>
     ));
     return (
@@ -137,7 +140,6 @@ const OrderTable: React.FC<TableProps> = ({
             <Table>
                 <Table.Thead>
                     <Table.Tr>
-                        <Table.Th />
                         <Table.Th ta="center">Order #</Table.Th>
                         <Table.Th ta="center">Distribution Center</Table.Th>
                         <Table.Th ta="center">Order Date</Table.Th>
@@ -145,6 +147,7 @@ const OrderTable: React.FC<TableProps> = ({
                         <Table.Th className="table-order-status" ta={"center"}>
                             Order Status
                         </Table.Th>
+                        <Table.Th />
                     </Table.Tr>
                 </Table.Thead>
                 <Table.Tbody>
diff --git a/src/styles/OrderTracking.css b/src/styles/OrderTracking.css
index cae0bf4..5702317 100644
--- a/src/styles/OrderTracking.css
+++ b/src/styles/OrderTracking.css
@@ -163,3 +163,5 @@
     background-color: var(--mantine-color-gray-4);
     cursor: pointer;
 }
+
+