diff --git a/cypress/pageobject/Asset/AssetCreation.ts b/cypress/pageobject/Asset/AssetCreation.ts
index 7a37f65dff7..7ceb3eca6ca 100644
--- a/cypress/pageobject/Asset/AssetCreation.ts
+++ b/cypress/pageobject/Asset/AssetCreation.ts
@@ -2,8 +2,7 @@
 
 export class AssetPage {
   createAsset() {
-    cy.get("button").should("contain", "Create Asset");
-    cy.get("[data-testid=create-asset-buttom] button").click();
+    cy.get("#create-asset-button").click();
   }
 
   selectFacility(facilityName: string) {
diff --git a/cypress/pageobject/utils/advanceFilterHelpers.ts b/cypress/pageobject/utils/advanceFilterHelpers.ts
index 14e3ab41bda..2841c1d600b 100644
--- a/cypress/pageobject/utils/advanceFilterHelpers.ts
+++ b/cypress/pageobject/utils/advanceFilterHelpers.ts
@@ -1,6 +1,6 @@
 export const advanceFilters = {
   clickAdvancedFiltersButton() {
-    cy.verifyAndClickElement("#advanced-filter", "Advanced Filters");
+    cy.verifyAndClickElement("#filter", "Filters");
   },
 
   selectState(state: string) {
diff --git a/src/CAREUI/interactive/FiltersSlideover.tsx b/src/CAREUI/interactive/FiltersSlideover.tsx
index 959fd0621e8..344ef16cef6 100644
--- a/src/CAREUI/interactive/FiltersSlideover.tsx
+++ b/src/CAREUI/interactive/FiltersSlideover.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 import SlideOver from "@/CAREUI/interactive/SlideOver";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
+import { Button } from "@/components/ui/button";
 
 import useFilters from "@/hooks/useFilters";
 
@@ -33,18 +33,23 @@ export default function FiltersSlideover({
         <div className="flex items-center justify-between">
           <span className="text-lg font-bold">{t("advanced_filters")}</span>
           <div className="mr-2 flex items-center justify-end gap-1">
-            <ButtonV2
-              variant="danger"
-              ghost
+            <Button
+              variant="none"
+              className="bg-transparent text-red-500 hover:bg-red-100"
               onClick={onClear}
               id="clear-filter"
             >
               <CareIcon icon="l-filter-slash" className="text-lg" />
               <span>{t("clear")}</span>
-            </ButtonV2>
-            <ButtonV2 ghost onClick={onApply} id="apply-filter">
+            </Button>
+            <Button
+              variant="outline_primary"
+              onClick={onApply}
+              className="border-none"
+              id="apply-filter"
+            >
               {t("apply")}
-            </ButtonV2>
+            </Button>
           </div>
         </div>
       }
@@ -55,18 +60,17 @@ export default function FiltersSlideover({
   );
 }
 
-export const AdvancedFilterButton = ({ onClick }: { onClick: () => void }) => {
+export const FilterButton = ({ onClick }: { onClick: () => void }) => {
   const { t } = useTranslation();
   return (
-    <ButtonV2
-      ghost
-      border
-      className="w-full bg-white md:w-auto"
+    <Button
+      variant="outline_primary"
+      className="w-full md:w-auto"
       onClick={onClick}
-      id="advanced-filter"
+      id="filter"
     >
       <CareIcon icon="l-filter" />
-      <span className="py-0.5">{t("advanced_filters")}</span>
-    </ButtonV2>
+      <span className="py-0.5 ml-2">{t("filters")}</span>
+    </Button>
   );
 };
diff --git a/src/components/Assets/AssetsList.tsx b/src/components/Assets/AssetsList.tsx
index c0e47610766..7a1b203d88a 100644
--- a/src/components/Assets/AssetsList.tsx
+++ b/src/components/Assets/AssetsList.tsx
@@ -6,18 +6,19 @@ import { useTranslation } from "react-i18next";
 import Chip from "@/CAREUI/display/Chip";
 import CountBlock from "@/CAREUI/display/Count";
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+
+import { Button } from "@/components/ui/button";
 
 import AssetFilter from "@/components/Assets/AssetFilter";
 import AssetImportModal from "@/components/Assets/AssetImportModal";
 import { AssetData, assetClassProps } from "@/components/Assets/AssetTypes";
-import ButtonV2 from "@/components/Common/ButtonV2";
 import ExportMenu from "@/components/Common/Export";
 import Loading from "@/components/Common/Loading";
 import Page from "@/components/Common/Page";
+import SearchByMultipleFields from "@/components/Common/SearchByMultipleFields";
 import FacilitiesSelectDialogue from "@/components/ExternalResult/FacilitiesSelectDialogue";
 import { FacilityModel } from "@/components/Facility/models";
-import SearchInput from "@/components/Form/SearchInput";
 
 import useFilters from "@/hooks/useFilters";
 import { useIsAuthorized } from "@/hooks/useIsAuthorized";
@@ -38,6 +39,7 @@ const AssetsList = () => {
     FilterBadges,
     advancedFilter,
     resultsPerPage,
+    clearSearch,
   } = useFilters({
     limit: 18,
     cacheBlacklist: ["search"],
@@ -317,9 +319,52 @@ const AssetsList = () => {
       breadcrumbs={false}
       hideBack
       options={
-        <>
+        <div className="flex flex-wrap items-center gap-3">
+          <div className="mb-2 flex w-full flex-col items-center gap-3 lg:mb-0 lg:w-fit lg:flex-row">
+            <div className="w-full lg:w-fit">
+              <Button
+                variant="primary"
+                size="default"
+                className="w-full p-[10px] md:w-auto"
+                onClick={() => setIsScannerActive(true)}
+              >
+                <CareIcon icon="l-search" className="text-base mr-2" />
+                Scan Asset QR
+              </Button>
+            </div>
+
+            <div className="w-full lg:w-fit">
+              <Button
+                variant="primary"
+                size="default"
+                id="create-asset-button"
+                disabled={!NonReadOnlyUsers}
+                className="w-full p-[10px] md:w-auto"
+                onClick={() => {
+                  if (qParams.facility) {
+                    navigate(`/facility/${qParams.facility}/assets/new`);
+                  } else {
+                    setShowFacilityDialog(true);
+                  }
+                }}
+              >
+                <CareIcon icon="l-plus-circle" className="text-lg mr-2" />
+                <span>{t("create_asset")}</span>
+              </Button>
+            </div>
+          </div>
+
+          {/* Advanced Filter Button */}
+          <div className="w-full md:w-auto">
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
+          </div>
+
+          {/* Import/Export Menu */}
           {authorizedForImportExport && (
-            <div className="tooltip" data-testid="import-asset-button">
+            <div
+              className="tooltip w-full md:w-auto"
+              data-testid="import-asset-button"
+            >
               <ExportMenu
                 label={importAssetModalOpen ? "Importing..." : "Import/Export"}
                 exportItems={[
@@ -371,62 +416,35 @@ const AssetsList = () => {
               />
             </div>
           )}
-        </>
+        </div>
       }
     >
-      <div className="mt-5 gap-3 space-y-2 lg:flex">
+      <div className="mt-4 gap-4 lg:gap-16 flex flex-col lg:flex-row lg:items-center">
         <CountBlock
           text="Total Assets"
           count={totalCount}
           loading={loading}
           icon="d-folder"
-          className="flex-1"
+          className=""
+        />
+        <SearchByMultipleFields
+          id="asset-search"
+          options={[
+            {
+              key: "Name/ Serial no./ QR code ID",
+              label: "name/serial no./QR code ID",
+              type: "text" as const,
+              placeholder: "Search by Name / Serial no. / QR code ID",
+              value: qParams.search || "",
+              shortcutKey: "n",
+            },
+          ]}
+          className="w-full"
+          onSearch={(key, value) => updateQuery({ search: value })}
+          clearSearch={clearSearch}
         />
-        <div className="flex-1">
-          <SearchInput
-            id="asset-search"
-            name="search"
-            value={qParams.search}
-            onChange={(e) => updateQuery({ [e.name]: e.value })}
-            placeholder="Search by name/serial no./QR code ID"
-          />
-        </div>
-        <div className="flex flex-col items-start justify-start gap-2 lg:ml-2">
-          <div className="flex w-full flex-col gap-2 md:flex-row lg:w-auto">
-            <div className="w-full">
-              <AdvancedFilterButton
-                onClick={() => advancedFilter.setShow(true)}
-              />
-            </div>
-            <ButtonV2
-              className="w-full py-[11px]"
-              onClick={() => setIsScannerActive(true)}
-            >
-              <CareIcon icon="l-search" className="mr-1 text-base" /> Scan Asset
-              QR
-            </ButtonV2>
-          </div>
-          <div
-            className="flex w-full flex-col md:flex-row"
-            data-testid="create-asset-buttom"
-          >
-            <ButtonV2
-              authorizeFor={NonReadOnlyUsers}
-              className="inline-flex w-full items-center justify-center"
-              onClick={() => {
-                if (qParams.facility) {
-                  navigate(`/facility/${qParams.facility}/assets/new`);
-                } else {
-                  setShowFacilityDialog(true);
-                }
-              }}
-            >
-              <CareIcon icon="l-plus-circle" className="text-lg" />
-              <span>{t("create_asset")}</span>
-            </ButtonV2>
-          </div>
-        </div>
       </div>
+
       <AssetFilter {...advancedFilter} key={window.location.search} />
       {isLoading ? (
         <Loading />
diff --git a/src/components/Common/Export.tsx b/src/components/Common/Export.tsx
index 6cd786977ed..60e00569a1e 100644
--- a/src/components/Common/Export.tsx
+++ b/src/components/Common/Export.tsx
@@ -1,18 +1,24 @@
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
-import DropdownMenu, {
-  DropdownItem,
-  DropdownItemProps,
-} from "@/components/Common/Menu";
+import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+
+import { ShadcnMenuDropdownItemProps } from "@/components/Common/Menu";
 
 import useExport from "@/hooks/useExport";
+import { useIsAuthorized } from "@/hooks/useIsAuthorized";
 
+import { Anyone } from "@/Utils/AuthorizeFor";
 import request from "@/Utils/request/request";
 import { Route } from "@/Utils/request/types";
 
 interface ExportItem {
-  options?: DropdownItemProps;
+  options?: ShadcnMenuDropdownItemProps;
   type?: "csv" | "json";
   filePrefix?: string;
   label: string;
@@ -37,7 +43,47 @@ interface ExportButtonProps {
   parse?: (data: string) => string;
   filenamePrefix: string;
 }
+function ExportMenuItem({
+  item,
+  exportFile,
+}: {
+  item: ExportItem;
+  exportFile: (
+    action: Parameters<ReturnType<typeof useExport>["exportFile"]>[0],
+    filePrefix?: string,
+    type?: "csv" | "json",
+    parse?: (data: string) => string,
+  ) => void;
+}) {
+  const isAuthorized = useIsAuthorized(item.options?.authorizeFor || Anyone);
 
+  return (
+    <DropdownMenuItem
+      onClick={() => {
+        if (item.action) {
+          let action = item.action;
+          if (item.route) {
+            action = async () => {
+              const { data } = await request(item.route!);
+              return data ?? null;
+            };
+          }
+          exportFile(action, item.filePrefix, item.type, item.parse);
+        } else if (item.options?.onClick) {
+          item.options.onClick();
+        }
+      }}
+      disabled={item.options?.disabled || !isAuthorized}
+      id={item.options?.id}
+      className={item.options?.className}
+    >
+      <div>
+        {item.options?.icon}
+        <span className="ml-1">{item.label}</span>
+      </div>
+    </DropdownMenuItem>
+  );
+}
 export const ExportMenu = ({
   label = "Export",
   disabled,
@@ -49,8 +95,9 @@ export const ExportMenu = ({
     const item = exportItems[0];
 
     return (
-      <ButtonV2
+      <Button
         disabled={isExporting || disabled}
+        size="default"
         onClick={() => {
           let action = item.action;
           if (item.route) {
@@ -63,44 +110,38 @@ export const ExportMenu = ({
             exportFile(action, item.filePrefix, item.type, item.parse);
           }
         }}
-        border
-        ghost
+        variant="outline_primary"
         className="py-2.5"
       >
-        <CareIcon icon="l-export" />
+        <CareIcon icon="l-export" className="mr-1" />
         {isExporting ? "Exporting..." : label}
-      </ButtonV2>
+      </Button>
     );
   }
 
   return (
     <div key="export-menu" id="export-button">
-      <DropdownMenu
-        disabled={isExporting || disabled}
-        title={isExporting ? "Exporting..." : label}
-        icon={<CareIcon icon="l-export" />}
-        className="tooltip border-primary-500 bg-white text-primary-500 hover:bg-primary-100 enabled:border"
-      >
-        {exportItems.map((item) => (
-          <DropdownItem
-            key={item.label}
-            onClick={() => {
-              let action = item.action;
-              if (item.route) {
-                action = async () => {
-                  const { data } = await request(item.route!);
-                  return data ?? null;
-                };
-              }
-              if (action) {
-                exportFile(action, item.filePrefix, item.type, item.parse);
-              }
-            }}
-            {...item.options}
+      <DropdownMenu modal={false}>
+        <DropdownMenuTrigger asChild>
+          <Button
+            disabled={isExporting || disabled}
+            size="default"
+            variant="outline_primary"
+            className="py-2.5 w-full"
           >
-            {item.label}
-          </DropdownItem>
-        ))}
+            <CareIcon icon="l-export" className="mr-1" />
+            {isExporting ? "Exporting..." : label}
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end" className="w-full">
+          {exportItems.map((item) => (
+            <ExportMenuItem
+              key={item.label}
+              item={item}
+              exportFile={exportFile}
+            />
+          ))}
+        </DropdownMenuContent>
       </DropdownMenu>
     </div>
   );
@@ -116,7 +157,7 @@ export const ExportButton = ({
 
   return (
     <>
-      <ButtonV2
+      <Button
         disabled={isExporting || props.disabled}
         onClick={() => {
           let action = props.action;
@@ -131,9 +172,7 @@ export const ExportButton = ({
           }
         }}
         className="tooltip mx-2 p-4 text-lg text-secondary-800 disabled:bg-transparent disabled:text-secondary-500"
-        variant="secondary"
-        ghost
-        circle
+        variant="link"
       >
         {isExporting ? (
           <CareIcon icon="l-spinner-alt" className="animate-spin" />
@@ -142,8 +181,8 @@ export const ExportButton = ({
         )}
         <span className={`tooltip-text ${tooltipClassName}`}>
           {props.tooltip || "Export"}
-        </span>
-      </ButtonV2>
+        </span>{" "}
+      </Button>
     </>
   );
 };
diff --git a/src/components/Common/Menu.tsx b/src/components/Common/Menu.tsx
index aa647a3dedb..7777b8b41ae 100644
--- a/src/components/Common/Menu.tsx
+++ b/src/components/Common/Menu.tsx
@@ -76,6 +76,15 @@ export type DropdownItemProps = RawDivProps &
     disabled?: boolean | undefined;
   };
 
+export type ShadcnMenuDropdownItemProps = RawDivProps &
+  AuthorizedElementProps & {
+    onClick?: () => void;
+    disabled?: boolean;
+    icon?: ReactNode | undefined;
+    className?: string;
+    children?: ReactNode;
+  };
+
 export function DropdownItem({
   authorizeFor = Anyone,
   variant = "primary",
diff --git a/src/components/Facility/DischargedPatientsList.tsx b/src/components/Facility/DischargedPatientsList.tsx
index 74bb6d95626..3395f6a0c95 100644
--- a/src/components/Facility/DischargedPatientsList.tsx
+++ b/src/components/Facility/DischargedPatientsList.tsx
@@ -6,7 +6,7 @@ import CountBlock from "@/CAREUI/display/Count";
 import FilterBadge from "@/CAREUI/display/FilterBadge";
 import RecordMeta from "@/CAREUI/display/RecordMeta";
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 import PaginatedList from "@/CAREUI/misc/PaginatedList";
 
 import Loading from "@/components/Common/Loading";
@@ -285,9 +285,7 @@ const DischargedPatientsList = ({
               onTabChange={() => navigate("/patients")}
               currentTab={1}
             />
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
             <SortDropdownMenu
               options={DISCHARGED_PATIENT_SORT_OPTIONS}
               selected={qParams.ordering}
diff --git a/src/components/Facility/FacilityList.tsx b/src/components/Facility/FacilityList.tsx
index f62f630dcaa..6fc50718aa5 100644
--- a/src/components/Facility/FacilityList.tsx
+++ b/src/components/Facility/FacilityList.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 
 import CountBlock from "@/CAREUI/display/Count";
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import ExportMenu from "@/components/Common/Export";
 import Loading from "@/components/Common/Loading";
@@ -156,7 +156,7 @@ export const FacilityList = () => {
       hideBack
       options={
         <div className="flex items-center gap-2 ">
-          <AdvancedFilterButton onClick={() => advancedFilter.setShow(true)} />
+          <FilterButton onClick={() => advancedFilter.setShow(true)} />
           <div id="export-button">
             <ExportMenu
               exportItems={[
diff --git a/src/components/Patient/ManagePatients.tsx b/src/components/Patient/ManagePatients.tsx
index 0cae44163b2..93175b9fe86 100644
--- a/src/components/Patient/ManagePatients.tsx
+++ b/src/components/Patient/ManagePatients.tsx
@@ -3,6 +3,8 @@ import { Link, navigate } from "raviger";
 import { ReactNode, useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+
 import { Avatar } from "@/components/Common/Avatar";
 import ButtonV2 from "@/components/Common/ButtonV2";
 import { ExportMenu } from "@/components/Common/Export";
@@ -34,7 +36,6 @@ import CountBlock from "../../CAREUI/display/Count";
 import FilterBadge from "../../CAREUI/display/FilterBadge";
 import RecordMeta from "../../CAREUI/display/RecordMeta";
 import CareIcon from "../../CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "../../CAREUI/interactive/FiltersSlideover";
 import { triggerGoal } from "../../Integrations/Plausible";
 import * as Notification from "../../Utils/Notifications";
 import request from "../../Utils/request/request";
@@ -902,9 +903,7 @@ export const PatientManager = () => {
               </ButtonV2>
             )}
 
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
             <SortDropdownMenu
               options={PATIENT_SORT_OPTIONS}
               selected={qParams.ordering}
diff --git a/src/components/Resource/ResourceBoard.tsx b/src/components/Resource/ResourceBoard.tsx
index 39b6f5184e5..c6c8e2b8027 100644
--- a/src/components/Resource/ResourceBoard.tsx
+++ b/src/components/Resource/ResourceBoard.tsx
@@ -3,7 +3,7 @@ import { Suspense, lazy, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import { Button } from "@/components/ui/button";
 
@@ -101,9 +101,7 @@ export default function BoardView() {
               <CareIcon icon="l-list-ul" className="mr-2" />
               {t("list_view")}
             </Button>
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
           </div>
         </div>
       </div>
diff --git a/src/components/Resource/ResourceList.tsx b/src/components/Resource/ResourceList.tsx
index 0175c9d63ea..56c5e4ec693 100644
--- a/src/components/Resource/ResourceList.tsx
+++ b/src/components/Resource/ResourceList.tsx
@@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next";
 
 import Chip from "@/CAREUI/display/Chip";
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import { Button } from "@/components/ui/button";
 
@@ -237,9 +237,7 @@ export default function ListView() {
               <CareIcon icon="l-list-ul" className="mr-2" />
               {t("board_view")}
             </Button>
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
           </div>
         </div>
       </div>
diff --git a/src/components/Shifting/ShiftingBoard.tsx b/src/components/Shifting/ShiftingBoard.tsx
index 068820d3311..df892be2435 100644
--- a/src/components/Shifting/ShiftingBoard.tsx
+++ b/src/components/Shifting/ShiftingBoard.tsx
@@ -4,7 +4,7 @@ import { Suspense, lazy, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import { Button } from "@/components/ui/button";
 
@@ -132,9 +132,7 @@ export default function BoardView() {
               <CareIcon icon="l-list-ul" className="mr-2" />
               {t("list_view")}
             </Button>
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
           </div>
         </div>
       </div>
diff --git a/src/components/Shifting/ShiftingList.tsx b/src/components/Shifting/ShiftingList.tsx
index e9051b1449b..f90df9f73a5 100644
--- a/src/components/Shifting/ShiftingList.tsx
+++ b/src/components/Shifting/ShiftingList.tsx
@@ -2,7 +2,7 @@ import { navigate } from "raviger";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import { Button } from "@/components/ui/button";
 
@@ -88,9 +88,7 @@ export default function ListView() {
               <CareIcon icon="l-list-ul" className="mr-2" />
               {t("board_view")}
             </Button>
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
           </div>
         </div>
       </div>
diff --git a/src/components/Users/ManageUsers.tsx b/src/components/Users/ManageUsers.tsx
index d28a0aeea52..89fd0252728 100644
--- a/src/components/Users/ManageUsers.tsx
+++ b/src/components/Users/ManageUsers.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 
 import CountBlock from "@/CAREUI/display/Count";
 import CareIcon from "@/CAREUI/icons/CareIcon";
-import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
+import { FilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import ButtonV2 from "@/components/Common/ButtonV2";
 import Loading from "@/components/Common/Loading";
@@ -123,9 +123,7 @@ export default function ManageUsers() {
         />
         <div className="col-span-2 my-2 flex flex-col justify-between space-y-3 lg:flex-row lg:space-x-4 lg:space-y-0 lg:px-3">
           <div className="flex flex-col gap-2">
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
+            <FilterButton onClick={() => advancedFilter.setShow(true)} />
             {userTypes.length && addUser}
           </div>
 
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 0125726ce73..da54aca978f 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -9,6 +9,7 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
+        none: "",
         default:
           "bg-gray-900 text-gray-50 shadow hover:bg-gray-900/90 dark:bg-gray-50 dark:text-gray-900 dark:hover:bg-gray-50/90",
         destructive: