sarlink-portal/components/add-devices-to-cart-button.tsx
i701 0f17800a00 Refactor UI components for improved consistency and functionality
- Removed unnecessary border styles from various dashboard components including Devices, DeviceDetails, Parental Control, Payments, and Users pages to enhance visual consistency.
- Updated DevicesTable to utilize a new ClickableRow component for better device interaction and management.
- Refactored AddDevicesToCartButton to use a checkbox for selecting devices, improving user experience.
- Enhanced DeviceCard component to streamline device information display and interaction.
- Overall improvements to the layout and responsiveness of the dashboard components.

These changes enhance the user interface and improve the maintainability of the codebase.
2024-12-26 00:43:39 +05:00

26 lines
705 B
TypeScript

'use client'
import { deviceCartAtom } from '@/lib/atoms'
import type { Device } from '@prisma/client'
import { useAtomValue, useSetAtom } from 'jotai'
import React from 'react'
export default function AddDevicesToCartButton({ device }: { device: Device }) {
const setDeviceCart = useSetAtom(deviceCartAtom)
const devices = useAtomValue(deviceCartAtom)
const isChecked = devices.some((d) => d.id === device.id);
return (
<input
type="checkbox"
className='peer accent-[#f49d1b] size-4'
checked={isChecked}
onChange={() => setDeviceCart((prev) =>
isChecked
? prev.filter((d) => d.id !== device.id)
: [...prev, device]
)}
/>
)
}