diff --git a/components/CategoryDropDownMenu.tsx b/components/CategoryDropDownMenu.tsx
index d389a447..47de4b96 100644
--- a/components/CategoryDropDownMenu.tsx
+++ b/components/CategoryDropDownMenu.tsx
@@ -3,6 +3,7 @@ import { Container, Button, Menu, MenuItem } from "@mui/material";
 import { ArrowDropDown } from "@mui/icons-material";
 import { useRouter } from "next/navigation";
 const navItems = [
+  "All Products",
   "Shirts",
   "Shoes",
   "Pants",
@@ -25,8 +26,12 @@ export default function CategoryDropDownMenu() {
   };
   const router = useRouter();
   const navigate = (item: string) => {
-    const encodedCategoryId = encodeURIComponent(item); //sanitize item name for route
-    router.push(`/category-page/${encodedCategoryId}`);
+    if (item === "All Products") {
+      router.push(`/category-page/all-products`);
+    } else {
+      const encodedCategoryId = encodeURIComponent(item); //sanitize item name for route
+      router.push(`/category-page/${encodedCategoryId}`);
+    }
     handleClose();
   };
 
@@ -38,7 +43,7 @@ export default function CategoryDropDownMenu() {
         aria-haspopup="true"
         aria-expanded={open ? "true" : undefined}
         onClick={handleClick}
-        startIcon={<ArrowDropDown />}
+        endIcon={<ArrowDropDown />}
         color={open ? "inherit" : "inherit"}
       >
         Products