- Device active until{" "} - {new Date(device?.expiry_date || "").toLocaleDateString("en-US", { - month: "short", - day: "2-digit", - year: "numeric", - })} -
-- ACTIVE -
- )} -{JSON.stringify(nationalData, null, 2)}
- const fullName = `${dbUser?.first_name} ${dbUser?.last_name}`;
- const nationalDob = nationalData?.dob?.split("T")[0];
- const dbUserDob = new Date(dbUser?.dob).toISOString().split("T")[0];
-
- return (
- Account No
- {accountNo} - -{JSON.stringify(error, null, 2)};
- }
- }
- const { data, meta } = topups;
- return (
- {JSON.stringify(payments, null, 2)};
- return (
- {session.data?.user?.id_card}
-{session.data?.user?.mobile}
-- Pay for your devices and track your bills. -
-Device Inactive
- )} - {device.has_a_pending_payment && ( - - - Payment Pending{" "} -{device?.reason_for_blocking}
-Device Inactive
- )} - {device.has_a_pending_payment && ( - - - Payment Pending{" "} -{device?.reason_for_blocking}
-- Device Name: {value} -
- ); - case "mac": - return ( -- MAC Address: {value} -
- ); - case "vendor": - return ( -- Vendor: {value} -
- ); - default: - return filter; - } -} diff --git a/components/filter.tsx b/components/filter.tsx deleted file mode 100644 index 3ac85c7..0000000 --- a/components/filter.tsx +++ /dev/null @@ -1,73 +0,0 @@ -"use client"; -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue, -} from "@/components/ui/select"; -import { cn } from "@/lib/utils"; -import { usePathname, useRouter, useSearchParams } from "next/navigation"; -import { useState, useTransition } from "react"; - -interface FilterOption { - value: string; - label: string; - icon: React.ReactNode; -} - -interface FilterProps { - options: FilterOption[]; - defaultOption: string; - queryParamKey: string; -} - -export default function Filter({ - options, - defaultOption, - queryParamKey, -}: FilterProps) { - const [selectedOption, setSelectedOption] = useState(defaultOption); - const searchParams = useSearchParams(); - const { replace } = useRouter(); - const pathname = usePathname(); - const [isPending, startTransition] = useTransition(); - - function handleFilterChange(value: string) { - setSelectedOption(value); - const params = new URLSearchParams(searchParams.toString()); - - params.set(queryParamKey, value); - params.set("page", "1"); - - startTransition(() => { - replace(`${pathname}?${params.toString()}`); - }); - } - - return ( -- {config.label.replace(/%20/g, " ")}:{" "} - {labels} -
- ); - } - if (config.type === "dual-range-slider") { - const rangeValues = value as number[]; - const formatLabel = - config.formatLabel || - ((val: number | undefined) => val?.toString() || ""); - return ( -- {config.label}:{" "} - - {formatLabel(rangeValues[0])} - {formatLabel(rangeValues[1])} - -
- ); - } - if (config.type === "radio-group") { - const stringValue = value as string; - // For true/false values, display the label instead of the value - if (stringValue === "true" || stringValue === "false") { - const option = config.options.find((opt) => opt.value === stringValue); - const displayValue = option?.label || stringValue; - return ( -- {config.label}:{" "} - {displayValue} -
- ); - } - // For other values, display as normal - return ( -- {config.label}:{" "} - {stringValue} -
- ); - } - return ( -- {config.label}: {value} -
- ); - }; - - // Handles removing an individual filter - const handleRemoveFilter = (keyToRemove: TFilterKeys) => { - const newParams = new URLSearchParams(currentParams.toString()); - - // Clear the specific input's local state - const inputConfig = inputs.find((input) => input.name === keyToRemove); - - if (inputConfig?.type === "dual-range-slider") { - newParams.delete(`${keyToRemove}_min`); - newParams.delete(`${keyToRemove}_max`); - setInputValues((prev) => ({ - ...prev, - [keyToRemove]: [inputConfig.min, inputConfig.max], - })); - } else { - newParams.delete(keyToRemove); - setInputValues((prev) => ({ - ...prev, - [keyToRemove]: inputConfig?.type === "checkbox-group" ? [] : "", - })); - } - - newParams.set("page", "1"); // Reset page after removing a filter - - startTransition(() => { - replace(`${pathname}?${newParams.toString()}`); - }); - }; - - return ( -- A MAC (Media Access Control) address is a unique identifier assigned - to a device`'`s network. It is used to identify the device on a - network, helping to differentiate devices on a network. -
-Please contact SAR Link for assistance.
- - - -{JSON.stringify(error, null, 2)};
- }
- }
- const { data, meta } = payments;
- return (
- {JSON.stringify(error, null, 2)};
- }
- }
- const { data, meta } = topups;
- return (
-