Fix: Incorrect Icon in Patient nav bar | Facility switcher hovering and some minor fixes

src/components/ui/dropdown-menu.tsx

@@ -88,7 +88,7 @@ const DropdownMenuItem = React.forwardRef<
   <DropdownMenuPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0 dark:focus:bg-gray-800 dark:focus:text-gray-50",
+      "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0 dark:focus:bg-gray-800 dark:focus:text-gray-50",
       inset && "pl-8",
       className,
     )}

src/components/ui/sidebar/facility-switcher.tsx

@@ -77,7 +77,7 @@ export function FacilitySwitcher({
                 className={cn(
                   "gap-2 p-2",
                   facility.name === selectedFacility?.name &&
-                    "bg-primary-500 text-white",
+                    "bg-primary-500 text-white focus:bg-primary-600 focus:text-white",
                 )}
               >
                 <div className="flex size-6 items-center justify-center rounded-sm border">

src/components/ui/sidebar/organization-switcher.tsx

@@ -82,7 +82,7 @@ export function OrganizationSwitcher({
             className={cn(
               "gap-2 p-2",
               org?.name === selectedOrganization?.name &&
-                "bg-primary-500 text-white",
+                "bg-primary-500 text-white focus:bg-primary-600 focus:text-white",
             )}
           >
             {org.name}

src/components/ui/sidebar/patient-nav.tsx

@@ -36,11 +36,11 @@ function generatePatientLinks(
   }
 
   return [
-    { name: t("appointments"), url: "/patient/home", icon: "d-patient" },
+    { name: t("appointments"), url: "/patient/home", icon: "d-calendar" },
     {
       name: t("nearby_facilities"),
       url: `/nearby_facilities/?${queryParams.toString()}`,
-      icon: "d-patient",
+      icon: "d-hospital",
     },
   ];
 }

src/pages/Patient/index.tsx

@@ -54,7 +54,9 @@ function PatientIndex() {
             ? "secondary"
             : status === "booked"
               ? "primary"
-              : "default"
+              : status === "cancelled"
+                ? "destructive"
+                : "default"
         }
       >
         {t(status)}