10981e2afb
* feat(profile): add 'Услуги' link button to LinksCard for service management * feat(services): add create and update service functionalities with corresponding API actions and hooks
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import { useDebouncedOnChangeCallback } from './hooks';
|
|
import { Checkbox, type CheckboxProps } from '@repo/ui/components/ui/checkbox';
|
|
import { useState } from 'react';
|
|
|
|
type Props = Pick<CheckboxProps, 'checked'> & {
|
|
readonly description?: string;
|
|
readonly onChange?: (value: boolean) => Promise<void> | void;
|
|
readonly text: string;
|
|
};
|
|
|
|
export function CheckboxWithText({ checked: initialValue, description, onChange, text }: Props) {
|
|
const [checked, setChecked] = useState(initialValue);
|
|
const { debouncedCallback, isPending } = useDebouncedOnChangeCallback(onChange);
|
|
|
|
const handleChange = () => {
|
|
const newValue = !checked;
|
|
setChecked(newValue);
|
|
debouncedCallback(newValue);
|
|
};
|
|
|
|
return (
|
|
<div className="flex items-start space-x-2">
|
|
<Checkbox checked={checked} disabled={isPending} id="terms1" onCheckedChange={handleChange} />
|
|
<div className="grid gap-1.5 leading-none">
|
|
<label
|
|
className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
|
htmlFor="terms1"
|
|
>
|
|
{text}
|
|
</label>
|
|
{description ? <p className="text-sm text-muted-foreground">{description}</p> : false}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|