refactor: streamline package.json and tailwind.config.ts

- Simplified dependencies in package.json by removing unused packages and organizing existing ones.
- Updated tailwind.config.ts for better readability and maintainability, ensuring consistent formatting and structure.

app/(dashboard)/devices/page.tsx

@@ -1,6 +1,6 @@
 import { authOptions } from "@/app/auth";
 import { DevicesTable } from "@/components/devices-table";
-import DeviceFilter from "@/components/devices/device-filter";
+import DynamicFilter from "@/components/generic-filter";
 import AddDeviceDialogForm from "@/components/user/add-device-dialog";
 import { getServerSession } from "next-auth";
 import { redirect } from "next/navigation";
@@ -29,7 +29,31 @@ export default async function Devices({
 				id="user-filters"
 				className=" pb-4 gap-4 flex sm:flex-row flex-col items-start justify-endO"
 			>
-				<DeviceFilter />
+				{/* <DeviceFilter /> */}
+				<DynamicFilter
+					description="Filter devices by name, MAC address, or vendor."
+					title="Device Filter"
+					inputs={[
+						{
+							name: "name",
+							label: "Device Name",
+							type: "string",
+							placeholder: "Enter device name",
+						},
+						{
+							name: "mac",
+							label: "MAC Address",
+							type: "string",
+							placeholder: "Enter MAC address",
+						},
+						{
+							name: "vendor",
+							label: "Vendor",
+							type: "string",
+							placeholder: "Enter vendor name",
+						}
+					]}
+				/>
 			</div>
 			<Suspense key={query || page} fallback={<DevicesTableSkeleton />}>
 				<DevicesTable parentalControl={false} searchParams={searchParams} />