s

payment-iq/app/components/PageLinks/PageLinks.tsx

@@ -5,19 +5,10 @@ import { ISidebarLink } from "@/app/features/dashboard/sidebar/SidebarLink.inter
 import clsx from "clsx"; // Utility to merge class names
 import "./PageLinks.scss";
 
-interface PageLinksProps extends ISidebarLink {
+export default function PageLinks({ title, path, icon: Icon }: ISidebarLink) {
-  className?: string;
-}
-
-export default function PageLinks({
-  title,
-  path,
-  icon: Icon,
-  className,
-}: PageLinksProps) {
   return (
     <Link href={path} passHref legacyBehavior>
-      <a className={clsx("link-container", className)}>
+      <a className={clsx("link-container")}>
         {Icon && <Icon />}
         <span className="link-text">{title}</span>
       </a>

payment-iq/app/features/dashboard/header/dropDown/DropDown.scss

@@ -1,8 +1,9 @@
 /* DropDown.scss */
-
+.dropdown-container {
-.link-container-text {
+  .link-container {
-  color: var(--text-primary);
+    color: var(--text-secondary);
-  span {
+    .link-text {
       color: var(--text-primary);
     }
   }
+}

payment-iq/app/features/dashboard/header/dropDown/DropDown.tsx

@@ -41,21 +41,17 @@ export default function SidebarDropdown({ onChange }: Props) {
           },
         }}
       >
-        <MenuItem value="" disabled>
+        <MenuItem value="" disabled></MenuItem>
-          {/* <Em className="em">
+        <div className="dropdown-container">
-            Select a page
-            <ChevronRightIcon fontSize="small" sx={{ ml: 1 }} />
-          </Em> */}
-        </MenuItem>
           {SIDEBAR_LINKS.map((link: ISidebarLink) => (
             <PageLinks
               key={link.path}
               title={link.title}
               path={link.path}
               icon={link.icon}
-            className="link-container-text"
             />
           ))}
+        </div>
       </Select>
     </FormControl>
   );