diff --git a/src/dashboard/src/app/style-guide/page.tsx b/src/dashboard/src/app/style-guide/page.tsx
index 093a1106..50ba8971 100644
--- a/src/dashboard/src/app/style-guide/page.tsx
+++ b/src/dashboard/src/app/style-guide/page.tsx
@@ -2,7 +2,7 @@
 
 import { Button } from '@/components/buttons';
 import { Checkbox } from '@/components/forms/checkbox';
-import { Select, FilterDropdown } from '@/components/forms/select';
+import { FilterDropdown, Select } from '@/components/forms/select';
 import { Text } from '@/components/forms/text';
 import { Toggle } from '@/components/forms/toggle';
 import styles from './StyleGuide.module.scss';
@@ -83,7 +83,7 @@ export default function Page() {
           <Select
             variant="filter"
             title="filter dropdown example using select"
-            options={[]}
+            options={mockOptions}
             label="Filter dropdown"
             placeholder="Default option"
           ></Select>
@@ -91,7 +91,7 @@ export default function Page() {
           <Select
             variant="primary"
             title="simple dropdown example"
-            options={[]}
+            options={mockOptions}
             label="Simple dropdown"
             placeholder="Default option"
           ></Select>
diff --git a/src/dashboard/src/components/filter/FilteredOperatingSystemItems.tsx b/src/dashboard/src/components/filter/FilteredOperatingSystemItems.tsx
index 1f3bd509..26cfb9c0 100644
--- a/src/dashboard/src/components/filter/FilteredOperatingSystemItems.tsx
+++ b/src/dashboard/src/components/filter/FilteredOperatingSystemItems.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { Select } from '@/components';
+import { FilterDropdown } from '@/components';
 import { IServerItemListModel } from '@/hooks';
 import { useFilteredOperatingSystemItems, useFilteredServerItems } from '@/hooks/filter';
 import { useOperatingSystemItems, useServerItems } from '@/hooks/lists';
@@ -41,9 +41,8 @@ export const FilteredOperatingSystemItems = ({}: IFilteredOperatingSystemItemsPr
   ]);
 
   return (
-    <Select
+    <FilterDropdown
       label="Operating system"
-      variant="filter"
       options={filteredOperatingSystemItemOptions}
       placeholder="Select OS"
       value={values.operatingSystemItem?.id ?? ''}
diff --git a/src/dashboard/src/components/filter/FilteredOrganizations.tsx b/src/dashboard/src/components/filter/FilteredOrganizations.tsx
index bc39a224..7c137ed7 100644
--- a/src/dashboard/src/components/filter/FilteredOrganizations.tsx
+++ b/src/dashboard/src/components/filter/FilteredOrganizations.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { Select } from '@/components';
+import { FilterDropdown } from '@/components';
 import { IOperatingSystemItemListModel, IServerItemListModel, useAuth } from '@/hooks';
 import {
   useFilteredOperatingSystemItems,
@@ -47,9 +47,8 @@ export const FilteredOrganizations = ({}: IFilteredOrganizationsProps) => {
   }, [setFilteredOrganizations, organizations, setValues, filteredOrganizations.length]);
 
   return filteredOrganizationOptions.length > 1 ? (
-    <Select
+    <FilterDropdown
       label="Organization"
-      variant="filter"
       options={filteredOrganizationOptions}
       placeholder="Select organization"
       value={values.organization?.id ?? ''}
diff --git a/src/dashboard/src/components/filter/FilteredServerItems.tsx b/src/dashboard/src/components/filter/FilteredServerItems.tsx
index 3b9f5463..46e3b219 100644
--- a/src/dashboard/src/components/filter/FilteredServerItems.tsx
+++ b/src/dashboard/src/components/filter/FilteredServerItems.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { Select } from '@/components';
+import { FilterDropdown } from '@/components';
 import { useFilteredServerItems } from '@/hooks/filter';
 import { useServerItems } from '@/hooks/lists';
 import { useFilteredStore } from '@/store';
@@ -26,9 +26,8 @@ export const FilteredServerItems = () => {
   }, [setFilteredServerItems, serverItems, setValues, filteredServerItems.length]);
 
   return (
-    <Select
+    <FilterDropdown
       label="Server"
-      variant="filter"
       options={filteredServerItemOptions}
       placeholder="Select server"
       value={values.serverItem?.serviceNowKey ?? ''}
diff --git a/src/dashboard/src/components/filter/FilteredTenants.tsx b/src/dashboard/src/components/filter/FilteredTenants.tsx
index fa0272d9..a018eadf 100644
--- a/src/dashboard/src/components/filter/FilteredTenants.tsx
+++ b/src/dashboard/src/components/filter/FilteredTenants.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { Select } from '@/components';
+import { FilterDropdown } from '@/components';
 import {
   IOperatingSystemItemListModel,
   IOrganizationListModel,
@@ -60,9 +60,8 @@ export const FilteredTenants = ({}: IFilteredTenantsProps) => {
   }, [filteredTenants.length, setFilteredTenants, setValues, tenants]);
 
   return filteredTenantOptions.length > 1 ? (
-    <Select
+    <FilterDropdown
       label="Tenant"
-      variant="filter"
       options={filteredTenantOptions}
       placeholder="Select tenant"
       value={values.tenant?.id ?? ''}