From 4cfd4a041a637985a305fa21a059f8dcb789a005 Mon Sep 17 00:00:00 2001
From: Justin Wang <Juwang110@gmail.com>
Date: Mon, 16 Feb 2026 13:24:02 -0500
Subject: [PATCH 1/5] frontend skeleton for order details modal

---
 .../foodRequests/dtos/order-details.dto.ts    |   1 +
 .../src/foodRequests/request.service.ts       |   1 +
 apps/backend/src/orders/order.controller.ts   |   8 +
 apps/backend/src/orders/order.service.ts      |  37 +-
 apps/frontend/src/api/apiClient.ts            |   6 +
 .../components/forms/orderDetailsModal.tsx    | 330 +++++++++++++-----
 .../src/containers/adminOrderManagement.tsx   |   2 +-
 apps/frontend/src/types/types.ts              |   1 +
 8 files changed, 299 insertions(+), 87 deletions(-)

diff --git a/apps/backend/src/foodRequests/dtos/order-details.dto.ts b/apps/backend/src/foodRequests/dtos/order-details.dto.ts
index 21d360ec..0ab12e13 100644
--- a/apps/backend/src/foodRequests/dtos/order-details.dto.ts
+++ b/apps/backend/src/foodRequests/dtos/order-details.dto.ts
@@ -11,5 +11,6 @@ export class OrderDetailsDto {
   orderId: number;
   status: OrderStatus;
   foodManufacturerName: string;
+  trackingLink: string;
   items: OrderItemDetailsDto[];
 }
diff --git a/apps/backend/src/foodRequests/request.service.ts b/apps/backend/src/foodRequests/request.service.ts
index 80093c58..2a22350b 100644
--- a/apps/backend/src/foodRequests/request.service.ts
+++ b/apps/backend/src/foodRequests/request.service.ts
@@ -65,6 +65,7 @@ export class RequestsService {
       orderId: order.orderId,
       status: order.status,
       foodManufacturerName: order.foodManufacturer.foodManufacturerName,
+      trackingLink: order.trackingLink,
       items: order.allocations.map((allocation) => ({
         name: allocation.item.itemName,
         quantity: allocation.allocatedQuantity,
diff --git a/apps/backend/src/orders/order.controller.ts b/apps/backend/src/orders/order.controller.ts
index a3ec003a..053af6a0 100644
--- a/apps/backend/src/orders/order.controller.ts
+++ b/apps/backend/src/orders/order.controller.ts
@@ -17,6 +17,7 @@ import { FoodRequest } from '../foodRequests/request.entity';
 import { AllocationsService } from '../allocations/allocations.service';
 import { OrderStatus } from './types';
 import { TrackingCostDto } from './dtos/tracking-cost.dto';
+import { OrderDetailsDto } from '../foodRequests/dtos/order-details.dto';
 
 @Controller('orders')
 export class OrdersController {
@@ -77,6 +78,13 @@ export class OrdersController {
     return this.ordersService.findOne(orderId);
   }
 
+  @Get('/:orderId/order-details')
+  async getOrderDetails(
+    @Param('orderId', ParseIntPipe) orderId: number,
+  ): Promise<OrderDetailsDto> {
+    return this.ordersService.findOrderDetails(orderId);
+  }
+
   @Get('/order/:requestId')
   async getOrderByRequestId(
     @Param('requestId', ParseIntPipe) requestId: number,
diff --git a/apps/backend/src/orders/order.service.ts b/apps/backend/src/orders/order.service.ts
index 4948f2fd..57fad93b 100644
--- a/apps/backend/src/orders/order.service.ts
+++ b/apps/backend/src/orders/order.service.ts
@@ -12,6 +12,7 @@ import { FoodRequest } from '../foodRequests/request.entity';
 import { validateId } from '../utils/validation.utils';
 import { OrderStatus } from './types';
 import { TrackingCostDto } from './dtos/tracking-cost.dto';
+import { OrderDetailsDto } from '../foodRequests/dtos/order-details.dto';
 
 @Injectable()
 export class OrdersService {
@@ -75,6 +76,36 @@ export class OrdersService {
     return order;
   }
 
+  async findOrderDetails(orderId: number): Promise<OrderDetailsDto> {
+    validateId(orderId, 'Order');
+
+    const order = await this.repo.findOne({
+      where: { orderId },
+      relations: {
+        allocations: {
+          item: true,
+        },
+        foodManufacturer: true,
+      },
+    });
+
+    if (!order) {
+      throw new NotFoundException(`Order ${orderId} not found`);
+    }
+
+    return ({
+      orderId: order.orderId,
+      status: order.status,
+      foodManufacturerName: order.foodManufacturer?.foodManufacturerName,
+      trackingLink: order.trackingLink,
+      items: order.allocations.map((allocation) => ({
+        name: allocation.item.itemName,
+        quantity: allocation.allocatedQuantity,
+        foodType: allocation.item.foodType,
+      })),
+    })
+  }
+
   async findOrderByRequest(requestId: number): Promise<Order> {
     validateId(requestId, 'Request');
 
@@ -109,7 +140,11 @@ export class OrdersService {
 
     const order = await this.repo.findOne({
       where: { orderId },
-      relations: ['request'],
+      relations: {
+        request: {
+          pantry: true,
+        },
+      },
     });
 
     if (!order) {
diff --git a/apps/frontend/src/api/apiClient.ts b/apps/frontend/src/api/apiClient.ts
index 09a31745..a1951b2f 100644
--- a/apps/frontend/src/api/apiClient.ts
+++ b/apps/frontend/src/api/apiClient.ts
@@ -236,6 +236,12 @@ export class ApiClient {
       .then((response) => response.data) as Promise<OrderDetails[]>;
   }
 
+  public async getOrderDetails(orderId: number): Promise<OrderDetails> {
+    return this.axiosInstance
+      .get(`/api/orders/${orderId}/order-details`)
+      .then((response) => response.data) as Promise<OrderDetails>;
+  }
+
   async getAllAllocationsByOrder(orderId: number): Promise<Allocation[]> {
     return this.axiosInstance
       .get(`/api/orders/${orderId}/allocations`)
diff --git a/apps/frontend/src/components/forms/orderDetailsModal.tsx b/apps/frontend/src/components/forms/orderDetailsModal.tsx
index 917bc484..34ef0c70 100644
--- a/apps/frontend/src/components/forms/orderDetailsModal.tsx
+++ b/apps/frontend/src/components/forms/orderDetailsModal.tsx
@@ -1,36 +1,41 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useMemo } from 'react';
 import {
   Text,
   Dialog,
   CloseButton,
   Flex,
-  Textarea,
   Field,
   Tag,
+  Box,
+  Badge,
+  Tabs,
+  Menu,
+  Link,
 } from '@chakra-ui/react';
 import ApiClient from '@api/apiClient';
-import { FoodRequest, OrderSummary } from 'types/types';
-import { formatDate } from '@utils/utils';
+import { FoodRequest, FoodTypes, OrderDetails, OrderItemDetails } from 'types/types';
+import { OrderStatus } from '../../types/types';
 
 interface OrderDetailsModalProps {
-  order: OrderSummary;
+  orderId: number;
   isOpen: boolean;
   onClose: () => void;
 }
 
 const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
-  order,
+  orderId,
   isOpen,
   onClose,
 }) => {
   const [foodRequest, setFoodRequest] = useState<FoodRequest | null>(null);
+  const [orderDetails, setOrderDetails] = useState<OrderDetails>();
 
   useEffect(() => {
     if (isOpen) {
-      const fetchData = async () => {
+      const fetchRequestData = async () => {
         try {
           const foodRequestData = await ApiClient.getFoodRequestFromOrder(
-            order.orderId,
+            orderId,
           );
           setFoodRequest(foodRequestData);
         } catch (error) {
@@ -38,9 +43,53 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
         }
       };
 
-      fetchData();
+      fetchRequestData();
     }
-  }, [isOpen, order.orderId]);
+  }, [isOpen, orderId]);
+
+  useEffect(() => {
+    if (isOpen) {
+      const fetchOrderDetails = async () => {
+        try {
+          const orderDetailsData = await ApiClient.getOrderDetails(
+            orderId,
+          );
+          setOrderDetails(orderDetailsData);
+        } catch (error) {
+          alert('Error fetching order details:' + error);
+        }
+      };
+
+      fetchOrderDetails();
+    }
+  }, [isOpen, orderId]);
+
+  const groupedOrderItemsByType = useMemo(() => {
+      if (!orderDetails) return {};
+  
+      return orderDetails.items.reduce(
+        (acc: Record<(typeof FoodTypes)[number], OrderItemDetails[]>, item) => {
+          if (!acc[item.foodType]) acc[item.foodType] = [];
+          acc[item.foodType].push(item);
+          return acc;
+        },
+        {} as Record<(typeof FoodTypes)[number], OrderItemDetails[]>,
+      );
+    }, [orderDetails]);
+  
+  const sectionTitleStyles = {
+    textStyle: 'p2',
+    fontWeight: '600',
+    color: 'neutral.800',
+  };
+
+  const badgeStyles = {
+    py: '1',
+    px: '2',
+    textStyle: 'p2',
+    fontSize: '12px',
+    fontWeight: '500',
+  };
 
   return (
     <Dialog.Root
@@ -55,89 +104,200 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
       <Dialog.Positioner>
         <Dialog.Content maxW={650}>
           <Dialog.Header pb={0} mt={2}>
-            <Dialog.Title fontSize="lg" fontWeight={700} fontFamily="inter">
-              Order {order.orderId}
+            <Dialog.Title fontSize="lg" fontWeight={600} fontFamily="inter">
+              Order #{orderId}
             </Dialog.Title>
           </Dialog.Header>
           <Dialog.Body>
-            {foodRequest && (
-              <>
-                <Text textStyle="p2" color="#111111">
-                  {order.request.pantry.pantryName}
-                </Text>
-                <Text mb={8} color="#52525B" textStyle="p2" pt={0} mt={0}>
-                  Requested {formatDate(foodRequest.requestedAt)}
-                </Text>
+            <Text textStyle="p2" color="#111111">
+              Fulfilled by {orderDetails?.foodManufacturerName}
+            </Text>
 
-                <Field.Root mb={4}>
-                  <Field.Label>
-                    <Text textStyle="p2" fontWeight={600} color="neutral.800">
-                      Size of Shipment
-                    </Text>
-                  </Field.Label>
-                  <Text
-                    fontSize="sm"
-                    fontWeight="400"
-                    color="neutral.800"
-                    mt={1}
-                    w="full"
-                  >
-                    {foodRequest.requestedSize}
+            <Tabs.Root unstyled mt={5} fitted defaultValue="orderDetails">
+              <Tabs.List maxW="60%">
+                <Tabs.Trigger
+                  textStyle="p2"
+                  px={4}
+                  py={1}
+                  color="neutral.800"
+                  value="orderDetails"
+                  borderBottom="1.5px solid"
+                  borderColor="neutral.100"
+                  _selected={{ borderColor: 'neutral.700' }}
+                >
+                  Order Details
+                </Tabs.Trigger>
+                <Tabs.Trigger
+                  textStyle="p2"
+                  px={4}
+                  py={1}
+                  color="neutral.800"
+                  value="associatedRequest"
+                  borderBottom="1.5px solid"
+                  borderColor="neutral.100"
+                  _selected={{ borderColor: 'neutral.700' }}
+                >
+                  Associated Request
+                </Tabs.Trigger>
+              </Tabs.List>
+              <Tabs.Content value="associatedRequest">
+                {!foodRequest && (
+                  <Text mt={5} textStyle="p2">
+                    {' '}
+                    No associated food request to display{' '}
                   </Text>
-                </Field.Root>
+                )}
+
+                {foodRequest && (
+                  <Box
+                    borderWidth="1px"
+                    borderColor="neutral.100"
+                    borderRadius="5px"
+                    p={3}
+                    mt={6}
+                  >
+                    <Flex justify="space-between" align="center" mb={3}>
+                      <Text {...sectionTitleStyles}>
+                        Request {foodRequest.requestId} -
+                        <Text as="span" color="neutral.800" textStyle="p2">
+                          {' '}
+                          {foodRequest.pantry?.pantryName}
+                        </Text>
+                      </Text>
+                      {orderDetails?.status === OrderStatus.DELIVERED ? (
+                        <Badge
+                          {...badgeStyles}
+                          bgColor="#FEECD1"
+                          color="#9C5D00"
+                        >
+                          Closed
+                        </Badge>
+                      ) : (
+                        <Badge
+                          {...badgeStyles}
+                          bgColor="#EAEDEF"
+                          color="#2B4E60"
+                        >
+                          Active
+                        </Badge>
+                      )}
+                    </Flex>
 
-                <Field.Root mb={4}>
-                  <Field.Label>
-                    <Text textStyle="p2" fontWeight={600} color="neutral.800">
-                      Food Type(s)
-                    </Text>
-                  </Field.Label>
-                  <Flex wrap="wrap" mt={1} gap={2}>
-                    {foodRequest.requestedItems.map((item, index) => (
-                      <Tag.Root
-                        key={index}
-                        size="xl"
-                        variant="solid"
-                        bg="neutral.100"
-                        color="neutral.800"
-                        borderRadius="4px"
-                        borderColor="neutral.300"
-                        borderWidth="1px"
-                        fontFamily="Inter"
-                        fontWeight={500}
-                      >
-                        <Tag.Label>{item}</Tag.Label>
-                      </Tag.Root>
-                    ))}
-                  </Flex>
-                </Field.Root>
+                    <Field.Root mb={4} mt={6}>
+                                      <Field.Label>
+                                        <Text {...sectionTitleStyles}>Size of Shipment</Text>
+                                      </Field.Label>
+                                      <Menu.Root>
+                                        <Text textStyle="p2" color="neutral.800" mt={3}>
+                                          {foodRequest.requestedSize}
+                                        </Text>
+                                      </Menu.Root>
+                                    </Field.Root>
+                    
+                                    <Field.Root mb={4} mt={3}>
+                                      <Field.Label>
+                                        <Text {...sectionTitleStyles} mt={3}>
+                                          Food Type(s)
+                                        </Text>
+                                      </Field.Label>
+                    
+                                      {foodRequest.requestedItems.length > 0 && (
+                                        <Flex wrap="wrap" mt={3} gap={2}>
+                                          {foodRequest.requestedItems.map((item) => (
+                                            <Tag.Root
+                                              key={item}
+                                              size="xl"
+                                              variant="solid"
+                                              bg={'neutral.100'}
+                                              color="neutral.800"
+                                              borderRadius="4px"
+                                              borderColor={'neutral.300'}
+                                              borderWidth="1px"
+                                              fontFamily="Inter"
+                                              fontWeight={500}
+                                            >
+                                              <Tag.Label>{item}</Tag.Label>
+                                            </Tag.Root>
+                                          ))}
+                                        </Flex>
+                                      )}
+                                    </Field.Root>
+                    
+                                    <Field.Root mb={4}>
+                                      <Field.Label>
+                                        <Text {...sectionTitleStyles} mt={3}>
+                                          Additional Information
+                                        </Text>
+                                      </Field.Label>
+                                      <Text textStyle="p2" color="neutral.800" mt={3}>
+                                        {foodRequest.additionalInformation}
+                                      </Text>
+                                    </Field.Root>
+                  </Box>
+                )}
+              </Tabs.Content>
 
-                <Field.Root mb={4}>
-                  <Field.Label>
-                    <Text textStyle="p2" fontWeight={600} color="neutral.800">
-                      Additional Information
-                    </Text>
-                  </Field.Label>
-                  <Textarea
-                    value={
-                      foodRequest.additionalInformation ||
-                      'No additional information supplied.'
-                    }
-                    readOnly
-                    pl={-2}
-                    size="lg"
-                    textStyle="p2"
-                    color="neutral.800"
-                    bg="white"
-                    border="none"
-                    resize="none"
-                    disabled
-                  />
-                </Field.Root>
-              </>
-            )}
+              <Tabs.Content value="orderDetails" mt={6}>
+                {Object.entries(
+                                      groupedOrderItemsByType as Record<
+                                        string,
+                                        OrderItemDetails[]
+                                      >,
+                                    ).map(([foodType, items]) => (
+                                      <Box key={foodType} mb={4}>
+                                        <Text {...sectionTitleStyles}>{foodType}</Text>
+                                        {items.map((item) => (
+                                          <Flex
+                                            border="1px solid"
+                                            borderColor="neutral.100"
+                                            borderRadius="md"
+                                            px={4}
+                                            align="center"
+                                            mt="2"
+                                          >
+                                            <Text
+                                              py={2}
+                                              textStyle="p2"
+                                              color="neutral.800"
+                                              flex={1}
+                                            >
+                                              {item.name}
+                                            </Text>
+                
+                                            <Box
+                                              alignSelf="stretch"
+                                              borderLeft="1px solid"
+                                              borderColor="neutral.100"
+                                              mx={3}
+                                            />
+                
+                                            <Text
+                                              minW={5}
+                                              py={2}
+                                              textStyle="p2"
+                                              color="neutral.800"
+                                            >
+                                              {item.quantity}
+                                            </Text>
+                                          </Flex>
+                                        ))}
+                                      </Box>
+                                    ))}
+                                    <Text {...sectionTitleStyles} mt="3">
+                                                          Tracking
+                                                        </Text>
+                                                        {orderDetails?.trackingLink ? (
+                                                          <Link href={orderDetails.trackingLink} mt="3" mb="3">
+                                                            {orderDetails.trackingLink}
+                                                          </Link>
+                                                        ) : (
+                                                          <Text color="neutral.700" textStyle="p2" mt="3" mb="3">
+                                                            No tracking link available at this time
+                                                          </Text>
+                                                        )}
+              </Tabs.Content>
+            </Tabs.Root>
           </Dialog.Body>
-
           <Dialog.CloseTrigger asChild>
             <CloseButton size="lg" />
           </Dialog.CloseTrigger>
diff --git a/apps/frontend/src/containers/adminOrderManagement.tsx b/apps/frontend/src/containers/adminOrderManagement.tsx
index 6edc9289..b1959ca0 100644
--- a/apps/frontend/src/containers/adminOrderManagement.tsx
+++ b/apps/frontend/src/containers/adminOrderManagement.tsx
@@ -628,7 +628,7 @@ const OrderStatusSection: React.FC<OrderStatusSectionProps> = ({
                       </Button>
                       {selectedOrderId === order.orderId && (
                         <OrderDetailsModal
-                          order={order}
+                          orderId={order.orderId}
                           isOpen={true}
                           onClose={() => onOrderSelect(null)}
                         />
diff --git a/apps/frontend/src/types/types.ts b/apps/frontend/src/types/types.ts
index 9156ecf5..5ed1cc7e 100644
--- a/apps/frontend/src/types/types.ts
+++ b/apps/frontend/src/types/types.ts
@@ -214,6 +214,7 @@ export interface OrderDetails {
   orderId: number;
   status: OrderStatus;
   foodManufacturerName: string;
+  trackingLink: string;
   items: OrderItemDetails[];
 }
 

From f6481c4c0222cd996dd84e387c62953785f789d9 Mon Sep 17 00:00:00 2001
From: Justin Wang <Juwang110@gmail.com>
Date: Mon, 16 Feb 2026 16:20:09 -0500
Subject: [PATCH 2/5] finalizing frontend modal

---
 apps/backend/src/orders/order.service.ts      |   4 +-
 .../components/forms/orderDetailsModal.tsx    | 252 +++++++++---------
 apps/frontend/src/theme.ts                    |   1 +
 3 files changed, 132 insertions(+), 125 deletions(-)

diff --git a/apps/backend/src/orders/order.service.ts b/apps/backend/src/orders/order.service.ts
index 57fad93b..12f490bd 100644
--- a/apps/backend/src/orders/order.service.ts
+++ b/apps/backend/src/orders/order.service.ts
@@ -93,7 +93,7 @@ export class OrdersService {
       throw new NotFoundException(`Order ${orderId} not found`);
     }
 
-    return ({
+    return {
       orderId: order.orderId,
       status: order.status,
       foodManufacturerName: order.foodManufacturer?.foodManufacturerName,
@@ -103,7 +103,7 @@ export class OrdersService {
         quantity: allocation.allocatedQuantity,
         foodType: allocation.item.foodType,
       })),
-    })
+    };
   }
 
   async findOrderByRequest(requestId: number): Promise<Order> {
diff --git a/apps/frontend/src/components/forms/orderDetailsModal.tsx b/apps/frontend/src/components/forms/orderDetailsModal.tsx
index 34ef0c70..02c0b823 100644
--- a/apps/frontend/src/components/forms/orderDetailsModal.tsx
+++ b/apps/frontend/src/components/forms/orderDetailsModal.tsx
@@ -13,7 +13,12 @@ import {
   Link,
 } from '@chakra-ui/react';
 import ApiClient from '@api/apiClient';
-import { FoodRequest, FoodTypes, OrderDetails, OrderItemDetails } from 'types/types';
+import {
+  FoodRequest,
+  FoodTypes,
+  OrderDetails,
+  OrderItemDetails,
+} from 'types/types';
 import { OrderStatus } from '../../types/types';
 
 interface OrderDetailsModalProps {
@@ -51,9 +56,7 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
     if (isOpen) {
       const fetchOrderDetails = async () => {
         try {
-          const orderDetailsData = await ApiClient.getOrderDetails(
-            orderId,
-          );
+          const orderDetailsData = await ApiClient.getOrderDetails(orderId);
           setOrderDetails(orderDetailsData);
         } catch (error) {
           alert('Error fetching order details:' + error);
@@ -65,18 +68,18 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
   }, [isOpen, orderId]);
 
   const groupedOrderItemsByType = useMemo(() => {
-      if (!orderDetails) return {};
-  
-      return orderDetails.items.reduce(
-        (acc: Record<(typeof FoodTypes)[number], OrderItemDetails[]>, item) => {
-          if (!acc[item.foodType]) acc[item.foodType] = [];
-          acc[item.foodType].push(item);
-          return acc;
-        },
-        {} as Record<(typeof FoodTypes)[number], OrderItemDetails[]>,
-      );
-    }, [orderDetails]);
-  
+    if (!orderDetails) return {};
+
+    return orderDetails.items.reduce(
+      (acc: Record<(typeof FoodTypes)[number], OrderItemDetails[]>, item) => {
+        if (!acc[item.foodType]) acc[item.foodType] = [];
+        acc[item.foodType].push(item);
+        return acc;
+      },
+      {} as Record<(typeof FoodTypes)[number], OrderItemDetails[]>,
+    );
+  }, [orderDetails]);
+
   const sectionTitleStyles = {
     textStyle: 'p2',
     fontWeight: '600',
@@ -175,8 +178,8 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
                       ) : (
                         <Badge
                           {...badgeStyles}
-                          bgColor="#EAEDEF"
-                          color="#2B4E60"
+                          bgColor="teal.200"
+                          color="#19717D"
                         >
                           Active
                         </Badge>
@@ -184,117 +187,120 @@ const OrderDetailsModal: React.FC<OrderDetailsModalProps> = ({
                     </Flex>
 
                     <Field.Root mb={4} mt={6}>
-                                      <Field.Label>
-                                        <Text {...sectionTitleStyles}>Size of Shipment</Text>
-                                      </Field.Label>
-                                      <Menu.Root>
-                                        <Text textStyle="p2" color="neutral.800" mt={3}>
-                                          {foodRequest.requestedSize}
-                                        </Text>
-                                      </Menu.Root>
-                                    </Field.Root>
-                    
-                                    <Field.Root mb={4} mt={3}>
-                                      <Field.Label>
-                                        <Text {...sectionTitleStyles} mt={3}>
-                                          Food Type(s)
-                                        </Text>
-                                      </Field.Label>
-                    
-                                      {foodRequest.requestedItems.length > 0 && (
-                                        <Flex wrap="wrap" mt={3} gap={2}>
-                                          {foodRequest.requestedItems.map((item) => (
-                                            <Tag.Root
-                                              key={item}
-                                              size="xl"
-                                              variant="solid"
-                                              bg={'neutral.100'}
-                                              color="neutral.800"
-                                              borderRadius="4px"
-                                              borderColor={'neutral.300'}
-                                              borderWidth="1px"
-                                              fontFamily="Inter"
-                                              fontWeight={500}
-                                            >
-                                              <Tag.Label>{item}</Tag.Label>
-                                            </Tag.Root>
-                                          ))}
-                                        </Flex>
-                                      )}
-                                    </Field.Root>
-                    
-                                    <Field.Root mb={4}>
-                                      <Field.Label>
-                                        <Text {...sectionTitleStyles} mt={3}>
-                                          Additional Information
-                                        </Text>
-                                      </Field.Label>
-                                      <Text textStyle="p2" color="neutral.800" mt={3}>
-                                        {foodRequest.additionalInformation}
-                                      </Text>
-                                    </Field.Root>
+                      <Field.Label>
+                        <Text {...sectionTitleStyles}>Size of Shipment</Text>
+                      </Field.Label>
+                      <Menu.Root>
+                        <Text textStyle="p2" color="neutral.800" mt={3}>
+                          {foodRequest.requestedSize}
+                        </Text>
+                      </Menu.Root>
+                    </Field.Root>
+
+                    <Field.Root mb={4} mt={3}>
+                      <Field.Label>
+                        <Text {...sectionTitleStyles} mt={3}>
+                          Food Type(s)
+                        </Text>
+                      </Field.Label>
+
+                      {foodRequest.requestedItems.length > 0 && (
+                        <Flex wrap="wrap" mt={3} gap={2}>
+                          {foodRequest.requestedItems.map((item) => (
+                            <Tag.Root
+                              key={item}
+                              size="xl"
+                              variant="solid"
+                              bg={'neutral.100'}
+                              color="neutral.800"
+                              borderRadius="4px"
+                              borderColor={'neutral.300'}
+                              borderWidth="1px"
+                              fontFamily="Inter"
+                              fontWeight={500}
+                            >
+                              <Tag.Label>{item}</Tag.Label>
+                            </Tag.Root>
+                          ))}
+                        </Flex>
+                      )}
+                    </Field.Root>
+
+                    <Field.Root mb={4}>
+                      <Field.Label>
+                        <Text {...sectionTitleStyles} mt={3}>
+                          Additional Information
+                        </Text>
+                      </Field.Label>
+                      <Text textStyle="p2" color="neutral.800" mt={3}>
+                        {foodRequest.additionalInformation}
+                      </Text>
+                    </Field.Root>
                   </Box>
                 )}
               </Tabs.Content>
 
               <Tabs.Content value="orderDetails" mt={6}>
                 {Object.entries(
-                                      groupedOrderItemsByType as Record<
-                                        string,
-                                        OrderItemDetails[]
-                                      >,
-                                    ).map(([foodType, items]) => (
-                                      <Box key={foodType} mb={4}>
-                                        <Text {...sectionTitleStyles}>{foodType}</Text>
-                                        {items.map((item) => (
-                                          <Flex
-                                            border="1px solid"
-                                            borderColor="neutral.100"
-                                            borderRadius="md"
-                                            px={4}
-                                            align="center"
-                                            mt="2"
-                                          >
-                                            <Text
-                                              py={2}
-                                              textStyle="p2"
-                                              color="neutral.800"
-                                              flex={1}
-                                            >
-                                              {item.name}
-                                            </Text>
-                
-                                            <Box
-                                              alignSelf="stretch"
-                                              borderLeft="1px solid"
-                                              borderColor="neutral.100"
-                                              mx={3}
-                                            />
-                
-                                            <Text
-                                              minW={5}
-                                              py={2}
-                                              textStyle="p2"
-                                              color="neutral.800"
-                                            >
-                                              {item.quantity}
-                                            </Text>
-                                          </Flex>
-                                        ))}
-                                      </Box>
-                                    ))}
-                                    <Text {...sectionTitleStyles} mt="3">
-                                                          Tracking
-                                                        </Text>
-                                                        {orderDetails?.trackingLink ? (
-                                                          <Link href={orderDetails.trackingLink} mt="3" mb="3">
-                                                            {orderDetails.trackingLink}
-                                                          </Link>
-                                                        ) : (
-                                                          <Text color="neutral.700" textStyle="p2" mt="3" mb="3">
-                                                            No tracking link available at this time
-                                                          </Text>
-                                                        )}
+                  groupedOrderItemsByType as Record<string, OrderItemDetails[]>,
+                ).map(([foodType, items]) => (
+                  <Box key={foodType} mb={4}>
+                    <Text {...sectionTitleStyles}>{foodType}</Text>
+                    {items.map((item) => (
+                      <Flex
+                        border="1px solid"
+                        borderColor="neutral.100"
+                        borderRadius="md"
+                        px={4}
+                        align="center"
+                        mt="2"
+                      >
+                        <Text
+                          py={2}
+                          textStyle="p2"
+                          color="neutral.800"
+                          flex={1}
+                        >
+                          {item.name}
+                        </Text>
+
+                        <Box
+                          alignSelf="stretch"
+                          borderLeft="1px solid"
+                          borderColor="neutral.100"
+                          mx={3}
+                        />
+
+                        <Text
+                          minW={5}
+                          py={2}
+                          textStyle="p2"
+                          color="neutral.800"
+                        >
+                          {item.quantity}
+                        </Text>
+                      </Flex>
+                    ))}
+                  </Box>
+                ))}
+                <Text {...sectionTitleStyles} mt="3">
+                  Tracking
+                </Text>
+                {orderDetails?.trackingLink ? (
+                  <Link
+                    href={orderDetails.trackingLink}
+                    color="#2795A5"
+                    variant="underline"
+                    mt="3"
+                    mb="3"
+                  >
+                    {orderDetails.trackingLink}
+                  </Link>
+                ) : (
+                  <Text color="neutral.700" textStyle="p2" mt="3" mb="3">
+                    No tracking link available at this time
+                  </Text>
+                )}
               </Tabs.Content>
             </Tabs.Root>
           </Dialog.Body>
diff --git a/apps/frontend/src/theme.ts b/apps/frontend/src/theme.ts
index b6312314..7b0b786c 100644
--- a/apps/frontend/src/theme.ts
+++ b/apps/frontend/src/theme.ts
@@ -85,6 +85,7 @@ const customConfig = defineConfig({
         },
         teal: {
           100: { value: '#E9F4F6' },
+          200: { value: '#D4EAED' },
           400: { value: '#A9D5DB' },
         },
       },

From 0081977b231a184143e8f78cef91559f864214a3 Mon Sep 17 00:00:00 2001
From: Justin Wang <Juwang110@gmail.com>
Date: Mon, 16 Feb 2026 16:45:16 -0500
Subject: [PATCH 3/5] testing

---
 .../foodRequests/request.controller.spec.ts   |  2 +
 .../src/orders/order.controller.spec.ts       | 33 +++++++++++++
 apps/backend/src/orders/order.service.spec.ts | 49 +++++++++++++++++++
 3 files changed, 84 insertions(+)

diff --git a/apps/backend/src/foodRequests/request.controller.spec.ts b/apps/backend/src/foodRequests/request.controller.spec.ts
index 45b0d2d2..7496db33 100644
--- a/apps/backend/src/foodRequests/request.controller.spec.ts
+++ b/apps/backend/src/foodRequests/request.controller.spec.ts
@@ -102,6 +102,7 @@ describe('RequestsController', () => {
           orderId: 10,
           status: OrderStatus.DELIVERED,
           foodManufacturerName: 'Test Manufacturer',
+          trackingLink: 'examplelink.com',
           items: [
             {
               name: 'Rice',
@@ -119,6 +120,7 @@ describe('RequestsController', () => {
           orderId: 11,
           status: OrderStatus.PENDING,
           foodManufacturerName: 'Another Manufacturer',
+          trackingLink: 'examplelink.com',
           items: [
             {
               name: 'Milk',
diff --git a/apps/backend/src/orders/order.controller.spec.ts b/apps/backend/src/orders/order.controller.spec.ts
index 980fc6ba..8d652e13 100644
--- a/apps/backend/src/orders/order.controller.spec.ts
+++ b/apps/backend/src/orders/order.controller.spec.ts
@@ -9,6 +9,8 @@ import { OrderStatus } from './types';
 import { FoodRequest } from '../foodRequests/request.entity';
 import { Pantry } from '../pantries/pantries.entity';
 import { TrackingCostDto } from './dtos/tracking-cost.dto';
+import { OrderDetailsDto } from '../foodRequests/dtos/order-details.dto';
+import { FoodType } from '../donationItems/types';
 
 const mockOrdersService = mock<OrdersService>();
 const mockAllocationsService = mock<AllocationsService>();
@@ -52,6 +54,22 @@ describe('OrdersController', () => {
     { allocationId: 3, orderId: 2 },
   ];
 
+  const mockOrderDetails: Partial<OrderDetailsDto>[] = [
+    {
+      orderId: 1,
+      status: OrderStatus.DELIVERED,
+      foodManufacturerName: 'food manufacturer 1',
+      trackingLink: 'example-link.com',
+      items: [
+        {
+          name: 'item1',
+          quantity: 10,
+          foodType: FoodType.DAIRY_FREE_ALTERNATIVES,
+        },
+      ],
+    },
+  ];
+
   beforeEach(async () => {
     const module: TestingModule = await Test.createTestingModule({
       controllers: [OrdersController],
@@ -68,6 +86,21 @@ describe('OrdersController', () => {
     expect(controller).toBeDefined();
   });
 
+  describe('getOrderDetails', () => {
+    it('should call ordersService.findOrderDetails and return order details', async () => {
+      mockOrdersService.findOrderDetails.mockResolvedValueOnce(
+        mockOrderDetails[0] as OrderDetailsDto,
+      );
+
+      const orderId = 1;
+
+      const result = await controller.getOrderDetails(orderId);
+
+      expect(result).toEqual(mockOrderDetails[0] as OrderDetailsDto);
+      expect(mockOrdersService.findOrderDetails).toHaveBeenCalledWith(orderId);
+    });
+  });
+
   describe('getAllOrders', () => {
     it('should call ordersService.getAll and return orders', async () => {
       const status = 'pending';
diff --git a/apps/backend/src/orders/order.service.spec.ts b/apps/backend/src/orders/order.service.spec.ts
index e8e41949..0bc461f8 100644
--- a/apps/backend/src/orders/order.service.spec.ts
+++ b/apps/backend/src/orders/order.service.spec.ts
@@ -5,6 +5,8 @@ import { Order } from './order.entity';
 import { testDataSource } from '../config/typeormTestDataSource';
 import { OrderStatus } from './types';
 import { Pantry } from '../pantries/pantries.entity';
+import { OrderDetailsDto } from '../foodRequests/dtos/order-details.dto';
+import { NotFoundException } from '@nestjs/common';
 
 // Set 1 minute timeout for async DB operations
 jest.setTimeout(60000);
@@ -121,4 +123,51 @@ describe('OrdersService', () => {
       expect(orders[0].status).toBe(OrderStatus.DELIVERED);
     });
   });
+
+  describe('findOrderDetails', () => {
+    it('returns mapped OrderDetailsDto including allocations and manufacturer', async () => {
+      const orderRepo = testDataSource.getRepository(Order);
+
+      const seededOrder = await orderRepo.findOne({
+        where: {},
+        relations: {
+          allocations: { item: true },
+          foodManufacturer: true,
+        },
+      });
+
+      expect(seededOrder).toBeTruthy();
+      expect(seededOrder!.allocations?.length).toBeGreaterThan(0);
+
+      const orderId = seededOrder!.orderId;
+
+      const result = await service.findOrderDetails(orderId);
+
+      const expected: OrderDetailsDto = {
+        orderId: seededOrder!.orderId,
+        status: seededOrder!.status,
+        foodManufacturerName:
+          seededOrder!.foodManufacturer?.foodManufacturerName,
+        trackingLink: seededOrder!.trackingLink,
+        items: seededOrder!.allocations.map((allocation) => ({
+          name: allocation.item.itemName,
+          quantity: allocation.allocatedQuantity,
+          foodType: allocation.item.foodType,
+        })),
+      };
+
+      expect(result).toEqual(expected);
+    });
+
+    it('throws NotFoundException when order does not exist', async () => {
+      const missingOrderId = 99999999;
+
+      await expect(service.findOrderDetails(missingOrderId)).rejects.toThrow(
+        NotFoundException,
+      );
+      await expect(service.findOrderDetails(missingOrderId)).rejects.toThrow(
+        `Order ${missingOrderId} not found`,
+      );
+    });
+  });
 });

From bb21988d6ce2dad9026cf2233ccfa4aff7f2b55b Mon Sep 17 00:00:00 2001
From: Justin Wang <Juwang110@gmail.com>
Date: Mon, 16 Feb 2026 17:32:17 -0500
Subject: [PATCH 4/5] fixing formatting

---
 apps/backend/src/orders/order.service.spec.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/apps/backend/src/orders/order.service.spec.ts b/apps/backend/src/orders/order.service.spec.ts
index 0f1d314f..4f1fd1bb 100644
--- a/apps/backend/src/orders/order.service.spec.ts
+++ b/apps/backend/src/orders/order.service.spec.ts
@@ -6,7 +6,6 @@ import { testDataSource } from '../config/typeormTestDataSource';
 import { OrderStatus } from './types';
 import { Pantry } from '../pantries/pantries.entity';
 import { OrderDetailsDto } from '../foodRequests/dtos/order-details.dto';
-import { NotFoundException } from '@nestjs/common';
 import { BadRequestException, NotFoundException } from '@nestjs/common';
 import { TrackingCostDto } from './dtos/tracking-cost.dto';
 
@@ -442,4 +441,4 @@ describe('OrdersService', () => {
       expect(updatedOrder.shippedAt).toBeDefined();
     });
   });
-});
+})});

From ac824ca92c32c329dc0a557b78d2e09b02e48aed Mon Sep 17 00:00:00 2001
From: Justin Wang <Juwang110@gmail.com>
Date: Tue, 17 Feb 2026 10:35:58 -0500
Subject: [PATCH 5/5] prettier

---
 apps/backend/src/orders/order.service.spec.ts | 417 +++++++++---------
 1 file changed, 211 insertions(+), 206 deletions(-)

diff --git a/apps/backend/src/orders/order.service.spec.ts b/apps/backend/src/orders/order.service.spec.ts
index 4f1fd1bb..8a4a7547 100644
--- a/apps/backend/src/orders/order.service.spec.ts
+++ b/apps/backend/src/orders/order.service.spec.ts
@@ -170,275 +170,280 @@ describe('OrdersService', () => {
         `Order ${missingOrderId} not found`,
       );
     });
-    
-  describe('getCurrentOrders', () => {
-    it(`returns only orders with status 'pending' or 'shipped'`, async () => {
-      const orders = await service.getCurrentOrders();
-      expect(orders).toHaveLength(2);
-      expect(
-        orders.every(
-          (order) =>
-            order.status === OrderStatus.PENDING ||
-            order.status === OrderStatus.SHIPPED,
-        ),
-      ).toBe(true);
+
+    describe('getCurrentOrders', () => {
+      it(`returns only orders with status 'pending' or 'shipped'`, async () => {
+        const orders = await service.getCurrentOrders();
+        expect(orders).toHaveLength(2);
+        expect(
+          orders.every(
+            (order) =>
+              order.status === OrderStatus.PENDING ||
+              order.status === OrderStatus.SHIPPED,
+          ),
+        ).toBe(true);
+      });
     });
-  });
 
-  describe('getPastOrders', () => {
-    it(`returns only orders with status 'delivered'`, async () => {
-      const orders = await service.getPastOrders();
-      expect(orders).toHaveLength(2);
-      expect(
-        orders.every((order) => order.status === OrderStatus.DELIVERED),
-      ).toBe(true);
+    describe('getPastOrders', () => {
+      it(`returns only orders with status 'delivered'`, async () => {
+        const orders = await service.getPastOrders();
+        expect(orders).toHaveLength(2);
+        expect(
+          orders.every((order) => order.status === OrderStatus.DELIVERED),
+        ).toBe(true);
+      });
     });
-  });
 
-  describe('findOne', () => {
-    it('returns order by ID', async () => {
-      const orderId = 1;
-      const result = await service.findOne(orderId);
+    describe('findOne', () => {
+      it('returns order by ID', async () => {
+        const orderId = 1;
+        const result = await service.findOne(orderId);
 
-      expect(result).toBeDefined();
-      expect(result.orderId).toBe(1);
-    });
+        expect(result).toBeDefined();
+        expect(result.orderId).toBe(1);
+      });
 
-    it('throws NotFoundException for non-existent order', async () => {
-      await expect(service.findOne(9999)).rejects.toThrow(
-        new NotFoundException('Order 9999 not found'),
-      );
+      it('throws NotFoundException for non-existent order', async () => {
+        await expect(service.findOne(9999)).rejects.toThrow(
+          new NotFoundException('Order 9999 not found'),
+        );
+      });
     });
-  });
 
-  describe('findOrderByRequest', () => {
-    it('returns order by request ID', async () => {
-      const order = await service.findOrderByRequest(1);
+    describe('findOrderByRequest', () => {
+      it('returns order by request ID', async () => {
+        const order = await service.findOrderByRequest(1);
 
-      expect(order).toBeDefined();
-      expect(order.request).toBeDefined();
-      expect(order.requestId).toBe(1);
-    });
+        expect(order).toBeDefined();
+        expect(order.request).toBeDefined();
+        expect(order.requestId).toBe(1);
+      });
 
-    it('throws NotFoundException for non-existent order', async () => {
-      await expect(service.findOrderByRequest(9999)).rejects.toThrow(
-        new NotFoundException('Order with request ID 9999 not found'),
-      );
+      it('throws NotFoundException for non-existent order', async () => {
+        await expect(service.findOrderByRequest(9999)).rejects.toThrow(
+          new NotFoundException('Order with request ID 9999 not found'),
+        );
+      });
     });
-  });
 
-  describe('findOrderFoodRequest', () => {
-    it('returns food request of order', async () => {
-      const foodRequest = await service.findOrderFoodRequest(1);
+    describe('findOrderFoodRequest', () => {
+      it('returns food request of order', async () => {
+        const foodRequest = await service.findOrderFoodRequest(1);
 
-      expect(foodRequest).toBeDefined();
-      expect(foodRequest.requestId).toBe(1);
-    });
+        expect(foodRequest).toBeDefined();
+        expect(foodRequest.requestId).toBe(1);
+      });
 
-    it('throws NotFoundException for non-existent order', async () => {
-      await expect(service.findOrderFoodRequest(9999)).rejects.toThrow(
-        new NotFoundException('Order 9999 not found'),
-      );
+      it('throws NotFoundException for non-existent order', async () => {
+        await expect(service.findOrderFoodRequest(9999)).rejects.toThrow(
+          new NotFoundException('Order 9999 not found'),
+        );
+      });
     });
-  });
 
-  describe('findOrderPantry', () => {
-    it('returns pantry of order', async () => {
-      const pantry = await service.findOrderPantry(1);
+    describe('findOrderPantry', () => {
+      it('returns pantry of order', async () => {
+        const pantry = await service.findOrderPantry(1);
 
-      expect(pantry).toBeDefined();
-      expect(pantry.pantryName).toEqual('Community Food Pantry Downtown');
-      expect(pantry.pantryId).toEqual(1);
+        expect(pantry).toBeDefined();
+        expect(pantry.pantryName).toEqual('Community Food Pantry Downtown');
+        expect(pantry.pantryId).toEqual(1);
+      });
     });
-  });
 
-  describe('findOrderFoodManufacturer', () => {
-    it('returns FM of order', async () => {
-      const foodManufacturer = await service.findOrderFoodManufacturer(2);
+    describe('findOrderFoodManufacturer', () => {
+      it('returns FM of order', async () => {
+        const foodManufacturer = await service.findOrderFoodManufacturer(2);
 
-      expect(foodManufacturer).toBeDefined();
-      expect(foodManufacturer.foodManufacturerName).toEqual('Healthy Foods Co');
-      expect(foodManufacturer.foodManufacturerId).toEqual(2);
-    });
+        expect(foodManufacturer).toBeDefined();
+        expect(foodManufacturer.foodManufacturerName).toEqual(
+          'Healthy Foods Co',
+        );
+        expect(foodManufacturer.foodManufacturerId).toEqual(2);
+      });
 
-    it('throws NotFoundException for non-existent order', async () => {
-      await expect(service.findOrderFoodManufacturer(9999)).rejects.toThrow(
-        new NotFoundException('Order 9999 not found'),
-      );
+      it('throws NotFoundException for non-existent order', async () => {
+        await expect(service.findOrderFoodManufacturer(9999)).rejects.toThrow(
+          new NotFoundException('Order 9999 not found'),
+        );
+      });
     });
-  });
 
-  describe('updateStatus', () => {
-    it('updates order status to delivered', async () => {
-      const orderId = 3;
-      const order = await service.findOne(orderId);
+    describe('updateStatus', () => {
+      it('updates order status to delivered', async () => {
+        const orderId = 3;
+        const order = await service.findOne(orderId);
 
-      expect(order.status).toEqual(OrderStatus.SHIPPED);
-      expect(order.shippedAt).toBeDefined();
+        expect(order.status).toEqual(OrderStatus.SHIPPED);
+        expect(order.shippedAt).toBeDefined();
 
-      await service.updateStatus(orderId, OrderStatus.DELIVERED);
-      const updatedOrder = await service.findOne(orderId);
+        await service.updateStatus(orderId, OrderStatus.DELIVERED);
+        const updatedOrder = await service.findOne(orderId);
 
-      expect(updatedOrder.status).toEqual(OrderStatus.DELIVERED);
-      expect(updatedOrder.deliveredAt).toBeDefined();
-    });
+        expect(updatedOrder.status).toEqual(OrderStatus.DELIVERED);
+        expect(updatedOrder.deliveredAt).toBeDefined();
+      });
 
-    it('updates order status to shipped', async () => {
-      const orderId = 4;
-      const order = await service.findOne(orderId);
+      it('updates order status to shipped', async () => {
+        const orderId = 4;
+        const order = await service.findOne(orderId);
 
-      expect(order.status).toEqual(OrderStatus.PENDING);
+        expect(order.status).toEqual(OrderStatus.PENDING);
 
-      await service.updateStatus(orderId, OrderStatus.SHIPPED);
-      const updatedOrder = await service.findOne(orderId);
+        await service.updateStatus(orderId, OrderStatus.SHIPPED);
+        const updatedOrder = await service.findOne(orderId);
 
-      expect(updatedOrder.status).toEqual(OrderStatus.SHIPPED);
-      expect(updatedOrder.shippedAt).toBeDefined();
-      expect(updatedOrder.deliveredAt).toBeNull();
+        expect(updatedOrder.status).toEqual(OrderStatus.SHIPPED);
+        expect(updatedOrder.shippedAt).toBeDefined();
+        expect(updatedOrder.deliveredAt).toBeNull();
+      });
     });
-  });
 
-  describe('getOrdersByPantry', () => {
-    it('returns order from pantry ID', async () => {
-      const pantryId = 1;
-      const orders = await service.getOrdersByPantry(pantryId);
+    describe('getOrdersByPantry', () => {
+      it('returns order from pantry ID', async () => {
+        const pantryId = 1;
+        const orders = await service.getOrdersByPantry(pantryId);
 
-      expect(orders.length).toBe(2);
-      expect(orders.every((order) => order.request)).toBeDefined();
-      expect(orders.every((order) => order.request.pantryId === 1)).toBe(true);
-    });
+        expect(orders.length).toBe(2);
+        expect(orders.every((order) => order.request)).toBeDefined();
+        expect(orders.every((order) => order.request.pantryId === 1)).toBe(
+          true,
+        );
+      });
 
-    it('returns empty list for pantry with no orderes', async () => {
-      const pantryId = 5;
-      const orders = await service.getOrdersByPantry(pantryId);
+      it('returns empty list for pantry with no orderes', async () => {
+        const pantryId = 5;
+        const orders = await service.getOrdersByPantry(pantryId);
 
-      expect(orders).toEqual([]);
-    });
+        expect(orders).toEqual([]);
+      });
 
-    it('throws NotFoundException for non-existent pantry', async () => {
-      const pantryId = 9999;
+      it('throws NotFoundException for non-existent pantry', async () => {
+        const pantryId = 9999;
 
-      await expect(service.getOrdersByPantry(pantryId)).rejects.toThrow(
-        new NotFoundException(`Pantry ${pantryId} not found`),
-      );
+        await expect(service.getOrdersByPantry(pantryId)).rejects.toThrow(
+          new NotFoundException(`Pantry ${pantryId} not found`),
+        );
+      });
     });
-  });
 
-  describe('updateTrackingCostInfo', () => {
-    it('throws when order is non-existent', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'test',
-        shippingCost: 5.99,
-      };
+    describe('updateTrackingCostInfo', () => {
+      it('throws when order is non-existent', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'test',
+          shippingCost: 5.99,
+        };
 
-      await expect(
-        service.updateTrackingCostInfo(9999, trackingCostDto),
-      ).rejects.toThrow(new NotFoundException('Order 9999 not found'));
-    });
+        await expect(
+          service.updateTrackingCostInfo(9999, trackingCostDto),
+        ).rejects.toThrow(new NotFoundException('Order 9999 not found'));
+      });
 
-    it('throws when tracking link and shipping cost not given', async () => {
-      await expect(service.updateTrackingCostInfo(3, {})).rejects.toThrow(
-        new BadRequestException(
-          'At least one of tracking link or shipping cost must be provided',
-        ),
-      );
-    });
+      it('throws when tracking link and shipping cost not given', async () => {
+        await expect(service.updateTrackingCostInfo(3, {})).rejects.toThrow(
+          new BadRequestException(
+            'At least one of tracking link or shipping cost must be provided',
+          ),
+        );
+      });
 
-    it('updates tracking link for shipped order', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'samplelink.com',
-      };
+      it('updates tracking link for shipped order', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'samplelink.com',
+        };
 
-      await service.updateTrackingCostInfo(3, trackingCostDto);
+        await service.updateTrackingCostInfo(3, trackingCostDto);
 
-      const order = await service.findOne(3);
-      expect(order.trackingLink).toBeDefined();
-      expect(order.trackingLink).toEqual('samplelink.com');
-    });
+        const order = await service.findOne(3);
+        expect(order.trackingLink).toBeDefined();
+        expect(order.trackingLink).toEqual('samplelink.com');
+      });
 
-    it('updates shipping cost for shipped order', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        shippingCost: 12.99,
-      };
+      it('updates shipping cost for shipped order', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          shippingCost: 12.99,
+        };
 
-      await service.updateTrackingCostInfo(3, trackingCostDto);
+        await service.updateTrackingCostInfo(3, trackingCostDto);
 
-      const order = await service.findOne(3);
-      expect(order.shippingCost).toBeDefined();
-      expect(order.shippingCost).toEqual('12.99');
-    });
+        const order = await service.findOne(3);
+        expect(order.shippingCost).toBeDefined();
+        expect(order.shippingCost).toEqual('12.99');
+      });
 
-    it('updates both shipping cost and tracking link', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'testtracking.com',
-        shippingCost: 7.5,
-      };
+      it('updates both shipping cost and tracking link', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'testtracking.com',
+          shippingCost: 7.5,
+        };
 
-      await service.updateTrackingCostInfo(3, trackingCostDto);
+        await service.updateTrackingCostInfo(3, trackingCostDto);
 
-      const order = await service.findOne(3);
-      expect(order.trackingLink).toEqual('testtracking.com');
-      expect(order.shippingCost).toEqual('7.50');
-    });
+        const order = await service.findOne(3);
+        expect(order.trackingLink).toEqual('testtracking.com');
+        expect(order.shippingCost).toEqual('7.50');
+      });
 
-    it('throws BadRequestException for delivered order', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'testtracking.com',
-        shippingCost: 7.5,
-      };
-      const orderId = 2;
+      it('throws BadRequestException for delivered order', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'testtracking.com',
+          shippingCost: 7.5,
+        };
+        const orderId = 2;
 
-      const order = await service.findOne(orderId);
+        const order = await service.findOne(orderId);
 
-      expect(order.status).toEqual(OrderStatus.DELIVERED);
+        expect(order.status).toEqual(OrderStatus.DELIVERED);
 
-      await expect(
-        service.updateTrackingCostInfo(orderId, trackingCostDto),
-      ).rejects.toThrow(
-        new BadRequestException(
-          'Can only update tracking info for pending or shipped orders',
-        ),
-      );
-    });
+        await expect(
+          service.updateTrackingCostInfo(orderId, trackingCostDto),
+        ).rejects.toThrow(
+          new BadRequestException(
+            'Can only update tracking info for pending or shipped orders',
+          ),
+        );
+      });
 
-    it('throws when both fields are not provided for first time setting', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'testtracking.com',
-      };
-      const orderId = 4;
+      it('throws when both fields are not provided for first time setting', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'testtracking.com',
+        };
+        const orderId = 4;
 
-      const order = await service.findOne(orderId);
+        const order = await service.findOne(orderId);
 
-      expect(order.shippedAt).toBeNull();
-      expect(order.trackingLink).toBeNull();
+        expect(order.shippedAt).toBeNull();
+        expect(order.trackingLink).toBeNull();
 
-      await expect(
-        service.updateTrackingCostInfo(4, trackingCostDto),
-      ).rejects.toThrow(
-        new BadRequestException(
-          'Must provide both tracking link and shipping cost on initial assignment',
-        ),
-      );
-    });
+        await expect(
+          service.updateTrackingCostInfo(4, trackingCostDto),
+        ).rejects.toThrow(
+          new BadRequestException(
+            'Must provide both tracking link and shipping cost on initial assignment',
+          ),
+        );
+      });
 
-    it('sets status to shipped when both fields provided and previous status pending', async () => {
-      const trackingCostDto: TrackingCostDto = {
-        trackingLink: 'testtracking.com',
-        shippingCost: 5.75,
-      };
-      const orderId = 4;
+      it('sets status to shipped when both fields provided and previous status pending', async () => {
+        const trackingCostDto: TrackingCostDto = {
+          trackingLink: 'testtracking.com',
+          shippingCost: 5.75,
+        };
+        const orderId = 4;
 
-      const order = await service.findOne(orderId);
+        const order = await service.findOne(orderId);
 
-      expect(order.status).toEqual(OrderStatus.PENDING);
-      expect(order.shippedAt).toBeNull();
+        expect(order.status).toEqual(OrderStatus.PENDING);
+        expect(order.shippedAt).toBeNull();
 
-      await service.updateTrackingCostInfo(orderId, trackingCostDto);
+        await service.updateTrackingCostInfo(orderId, trackingCostDto);
 
-      const updatedOrder = await service.findOne(orderId);
+        const updatedOrder = await service.findOne(orderId);
 
-      expect(updatedOrder.status).toEqual(OrderStatus.SHIPPED);
-      expect(updatedOrder.shippedAt).toBeDefined();
+        expect(updatedOrder.status).toEqual(OrderStatus.SHIPPED);
+        expect(updatedOrder.shippedAt).toBeDefined();
+      });
     });
   });
-})});
+});