diff --git a/src/CAREUI/interactive/FiltersSlideover.tsx b/src/CAREUI/interactive/FiltersSlideover.tsx
index 959fd0621e8..c6ee12e6df3 100644
--- a/src/CAREUI/interactive/FiltersSlideover.tsx
+++ b/src/CAREUI/interactive/FiltersSlideover.tsx
@@ -4,6 +4,8 @@ import { useTranslation } from "react-i18next";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 import SlideOver from "@/CAREUI/interactive/SlideOver";
 
+import { Button } from "@/components/ui/button";
+
 import ButtonV2 from "@/components/Common/ButtonV2";
 
 import useFilters from "@/hooks/useFilters";
@@ -58,15 +60,15 @@ export default function FiltersSlideover({
 export const AdvancedFilterButton = ({ onClick }: { onClick: () => void }) => {
   const { t } = useTranslation();
   return (
-    <ButtonV2
-      ghost
-      border
-      className="w-full bg-white md:w-auto"
+    <Button
+      variant={"outline_primary"}
+      size={"lg"}
+      className="w-full bg-white md:w-auto gap-2"
       onClick={onClick}
       id="advanced-filter"
     >
       <CareIcon icon="l-filter" />
       <span className="py-0.5">{t("advanced_filters")}</span>
-    </ButtonV2>
+    </Button>
   );
 };
diff --git a/src/components/Assets/AssetsList.tsx b/src/components/Assets/AssetsList.tsx
index c0e47610766..edb9de0458d 100644
--- a/src/components/Assets/AssetsList.tsx
+++ b/src/components/Assets/AssetsList.tsx
@@ -11,14 +11,13 @@ import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 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 FacilitiesSelectDialogue from "@/components/ExternalResult/FacilitiesSelectDialogue";
 import { FacilityModel } from "@/components/Facility/models";
-import SearchInput from "@/components/Form/SearchInput";
 
+import useAuthUser from "@/hooks/useAuthUser";
 import useFilters from "@/hooks/useFilters";
 import { useIsAuthorized } from "@/hooks/useIsAuthorized";
 
@@ -29,6 +28,9 @@ import routes from "@/Utils/request/api";
 import request from "@/Utils/request/request";
 import useTanStackQueryInstead from "@/Utils/request/useQuery";
 
+import SearchByMultipleFields from "../Common/SearchByMultipleFields";
+import { Button } from "../ui/button";
+
 const AssetsList = () => {
   const { t } = useTranslation();
   const {
@@ -38,9 +40,10 @@ const AssetsList = () => {
     FilterBadges,
     advancedFilter,
     resultsPerPage,
+    clearSearch,
   } = useFilters({
     limit: 18,
-    cacheBlacklist: ["search"],
+    cacheBlacklist: ["name", "serial_number", "qr_code_id"],
   });
   const [assets, setAssets] = useState([{} as AssetData]);
   const [isLoading, setIsLoading] = useState(false);
@@ -56,6 +59,9 @@ const AssetsList = () => {
   const params = {
     limit: resultsPerPage,
     page: qParams.page,
+    name: qParams.name || "",
+    serial_number: qParams.serial_number || "",
+    qr_code_id: qParams.qr_code_id || "",
     offset: (qParams.page ? qParams.page - 1 : 0) * resultsPerPage,
     search_text: qParams.search || "",
     facility: qParams.facility || "",
@@ -114,6 +120,9 @@ const AssetsList = () => {
     },
   );
 
+  const authUser = useAuthUser();
+  const isDisabled = !NonReadOnlyUsers(authUser.user_type);
+
   function isValidURL(url: string) {
     try {
       new URL(url);
@@ -311,108 +320,50 @@ const AssetsList = () => {
     );
   }
 
+  const searchOptions = [
+    {
+      key: "name",
+      label: "Name",
+      type: "text" as const,
+      placeholder: "Search by Name",
+      value: qParams.name || "",
+      shortcutKey: "n",
+    },
+    {
+      key: "serial_number",
+      label: "Serial No.",
+      type: "text" as const,
+      placeholder: "Search by Serial No.",
+      value: qParams.serial_number || "",
+      shortcutKey: "u",
+    },
+    {
+      key: "asset_qr_id",
+      label: "QR Code ID",
+      type: "text" as const,
+      placeholder: "Search by QR Code ID",
+      value: qParams.qr_code_id || "",
+      shortcutKey: "p",
+    },
+  ];
+
   return (
     <Page
       title="Assets"
       breadcrumbs={false}
+      className="px-4 md:px-6"
       hideBack
       options={
-        <>
-          {authorizedForImportExport && (
-            <div className="tooltip" data-testid="import-asset-button">
-              <ExportMenu
-                label={importAssetModalOpen ? "Importing..." : "Import/Export"}
-                exportItems={[
-                  {
-                    label: "Import Assets",
-                    options: {
-                      icon: (
-                        <CareIcon
-                          icon="l-import"
-                          className="import-assets-button"
-                        />
-                      ),
-                      onClick: () => setImportAssetModalOpen(true),
-                    },
-                  },
-                  {
-                    label: "Export Assets (JSON)",
-                    action: async () => {
-                      const { data } = await request(routes.listAssets, {
-                        query: { ...qParams, json: true, limit: totalCount },
-                      });
-                      return data ?? null;
-                    },
-                    type: "json",
-                    filePrefix: `assets_${facility?.name ?? "all"}`,
-                    options: {
-                      icon: <CareIcon icon="l-export" />,
-                      disabled: totalCount === 0 || !authorizedForImportExport,
-                      id: "export-json-option",
-                    },
-                  },
-                  {
-                    label: "Export Assets (CSV)",
-                    action: async () => {
-                      const { data } = await request(routes.listAssets, {
-                        query: { ...qParams, csv: true, limit: totalCount },
-                      });
-                      return data ?? null;
-                    },
-                    type: "csv",
-                    filePrefix: `assets_${facility?.name ?? "all"}`,
-                    options: {
-                      icon: <CareIcon icon="l-export" />,
-                      disabled: totalCount === 0 || !authorizedForImportExport,
-                      id: "export-csv-option",
-                    },
-                  },
-                ]}
-              />
-            </div>
-          )}
-        </>
-      }
-    >
-      <div className="mt-5 gap-3 space-y-2 lg:flex">
-        <CountBlock
-          text="Total Assets"
-          count={totalCount}
-          loading={loading}
-          icon="d-folder"
-          className="flex-1"
-        />
-        <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 items-center justify-between lg:flex-row">
           <div
-            className="flex w-full flex-col md:flex-row"
+            className="mb-2 flex w-full flex-col items-center lg:mb-0 lg:w-fit lg:flex-row lg:gap-5"
             data-testid="create-asset-buttom"
           >
-            <ButtonV2
-              authorizeFor={NonReadOnlyUsers}
-              className="inline-flex w-full items-center justify-center"
+            <Button
+              disabled={isDisabled}
+              variant={"primary"}
+              size={"lg"}
+              className="gap-2 w-full lg:w-fit"
               onClick={() => {
                 if (qParams.facility) {
                   navigate(`/facility/${qParams.facility}/assets/new`);
@@ -423,9 +374,103 @@ const AssetsList = () => {
             >
               <CareIcon icon="l-plus-circle" className="text-lg" />
               <span>{t("create_asset")}</span>
-            </ButtonV2>
+            </Button>
+          </div>
+          <div className="flex w-full flex-col items-center justify-end gap-2 lg:ml-3 lg:w-fit lg:flex-row lg:gap-3">
+            <AdvancedFilterButton
+              onClick={() => advancedFilter.setShow(true)}
+            />
+
+            <Button
+              variant={"primary"}
+              size={"lg"}
+              className="gap-2 w-full"
+              onClick={() => setIsScannerActive(true)}
+            >
+              <CareIcon icon="l-search" className="mr-1 text-base" />
+              Scan Asset QR
+            </Button>
+
+            <div
+              className="tooltip w-full md:w-auto"
+              data-testid="import-asset-button"
+            >
+              {authorizedForImportExport && (
+                <ExportMenu
+                  label={
+                    importAssetModalOpen ? "Importing..." : "Import/Export"
+                  }
+                  exportItems={[
+                    {
+                      label: "Import Assets",
+                      options: {
+                        icon: (
+                          <CareIcon
+                            icon="l-import"
+                            className="import-assets-button"
+                          />
+                        ),
+                        onClick: () => setImportAssetModalOpen(true),
+                      },
+                    },
+                    {
+                      label: "Export Assets (JSON)",
+                      action: async () => {
+                        const { data } = await request(routes.listAssets, {
+                          query: { ...qParams, json: true, limit: totalCount },
+                        });
+                        return data ?? null;
+                      },
+                      type: "json",
+                      filePrefix: `assets_${facility?.name ?? "all"}`,
+                      options: {
+                        icon: <CareIcon icon="l-export" />,
+                        disabled:
+                          totalCount === 0 || !authorizedForImportExport,
+                        id: "export-json-option",
+                      },
+                    },
+                    {
+                      label: "Export Assets (CSV)",
+                      action: async () => {
+                        const { data } = await request(routes.listAssets, {
+                          query: { ...qParams, csv: true, limit: totalCount },
+                        });
+                        return data ?? null;
+                      },
+                      type: "csv",
+                      filePrefix: `assets_${facility?.name ?? "all"}`,
+                      options: {
+                        icon: <CareIcon icon="l-export" />,
+                        disabled:
+                          totalCount === 0 || !authorizedForImportExport,
+                        id: "export-csv-option",
+                      },
+                    },
+                  ]}
+                />
+              )}
+            </div>
           </div>
         </div>
+      }
+    >
+      <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"
+        />
+
+        <SearchByMultipleFields
+          id="asset-search"
+          options={searchOptions}
+          onSearch={(key, value) => updateQuery({ search: value })}
+          clearSearch={clearSearch}
+          className="w-full"
+        />
       </div>
       <AssetFilter {...advancedFilter} key={window.location.search} />
       {isLoading ? (
diff --git a/src/components/Common/Export.tsx b/src/components/Common/Export.tsx
index 6cd786977ed..2c5f7849057 100644
--- a/src/components/Common/Export.tsx
+++ b/src/components/Common/Export.tsx
@@ -1,15 +1,24 @@
+import { cn } from "@/lib/utils";
+
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
-import DropdownMenu, {
-  DropdownItem,
-  DropdownItemProps,
-} from "@/components/Common/Menu";
+import { DropdownItemProps } from "@/components/Common/Menu";
 
 import useExport from "@/hooks/useExport";
+import { useIsAuthorized } from "@/hooks/useIsAuthorized";
 
+import { Anyone, AuthorizedForCB } from "@/Utils/AuthorizeFor";
 import request from "@/Utils/request/request";
 import { Route } from "@/Utils/request/types";
+import { classNames } from "@/Utils/utils";
+
+import { Button } from "../ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "../ui/dropdown-menu";
 
 interface ExportItem {
   options?: DropdownItemProps;
@@ -22,9 +31,11 @@ interface ExportItem {
 }
 
 interface ExportMenuProps {
+  variant?: string;
   disabled?: boolean | undefined;
   label?: string;
   exportItems: ExportItem[];
+  authorizeFor?: AuthorizedForCB | undefined;
 }
 
 interface ExportButtonProps {
@@ -42,14 +53,17 @@ export const ExportMenu = ({
   label = "Export",
   disabled,
   exportItems,
+  authorizeFor = Anyone,
 }: ExportMenuProps) => {
   const { isExporting, exportFile } = useExport();
+  const isAuthorized = useIsAuthorized(authorizeFor);
 
   if (exportItems.length === 1) {
     const item = exportItems[0];
 
     return (
-      <ButtonV2
+      <Button
+        variant={"outline_primary"}
         disabled={isExporting || disabled}
         onClick={() => {
           let action = item.action;
@@ -63,44 +77,68 @@ export const ExportMenu = ({
             exportFile(action, item.filePrefix, item.type, item.parse);
           }
         }}
-        border
-        ghost
         className="py-2.5"
       >
         <CareIcon icon="l-export" />
         {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}
+    <div
+      key="export-menu"
+      id="export-button"
+      className={cn("tooltip border-primary-500 enabled:border")}
+    >
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild className="w-full">
+          <Button
+            variant={"outline_primary"}
+            size={"lg"}
+            disabled={isExporting || disabled}
           >
-            {item.label}
-          </DropdownItem>
-        ))}
+            <CareIcon icon="l-export" />
+            {isExporting ? "Exporting..." : label}
+          </Button>
+        </DropdownMenuTrigger>
+        {label !== "Importing..." && (
+          <DropdownMenuContent>
+            {exportItems.map((item) => (
+              <div
+                key={item.label}
+                className={classNames(
+                  isAuthorized
+                    ? "pointer-events-auto cursor-pointer"
+                    : "!hidden",
+                )}
+                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}
+              >
+                <DropdownMenuItem
+                  id={item.options?.id}
+                  disabled={isExporting || disabled}
+                >
+                  <div>
+                    <i>{item.options?.icon}</i>
+                    <span className="w-full">{item.label}</span>
+                  </div>
+                </DropdownMenuItem>
+              </div>
+            ))}
+          </DropdownMenuContent>
+        )}
       </DropdownMenu>
     </div>
   );
@@ -116,7 +154,7 @@ export const ExportButton = ({
 
   return (
     <>
-      <ButtonV2
+      <Button
         disabled={isExporting || props.disabled}
         onClick={() => {
           let action = props.action;
@@ -132,8 +170,6 @@ 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
       >
         {isExporting ? (
           <CareIcon icon="l-spinner-alt" className="animate-spin" />
@@ -143,7 +179,7 @@ export const ExportButton = ({
         <span className={`tooltip-text ${tooltipClassName}`}>
           {props.tooltip || "Export"}
         </span>
-      </ButtonV2>
+      </Button>
     </>
   );
 };