gitscope
/
← marzneshin / dashboard/src/features/users/dialogs/mutation/fields/services.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/dialogs/mutation/fields/services.tsx · v0.3.0-alpha11
Source
1 857e289 Mrdn 2y ago import {
2 39380ee Mrdn 2y ago Checkbox,
3 39380ee Mrdn 2y ago FormControl,
4 39380ee Mrdn 2y ago FormField,
5 39380ee Mrdn 2y ago FormItem,
6 39380ee Mrdn 2y ago FormLabel,
7 39380ee Mrdn 2y ago FormMessage,
8 39380ee Mrdn 2y ago ScrollArea,
9 857e289 Mrdn 2y ago } from '@marzneshin/components';
10 857e289 Mrdn 2y ago import { useServicesQuery } from '@marzneshin/features/services';
11 857e289 Mrdn 2y ago import { ServiceCard } from '@marzneshin/features/users';
12 39380ee Mrdn 2y ago import { cn } from '@marzneshin/utils';
13 857e289 Mrdn 2y ago import { FC } from 'react'
14 857e289 Mrdn 2y ago import { useFormContext } from 'react-hook-form';
15 857e289 Mrdn 2y ago import { useTranslation } from 'react-i18next';
16 857e289 Mrdn 2y ago
17 97ed755 Mrdn 2y ago interface ServicesFieldProps { }
18 857e289 Mrdn 2y ago
19 97ed755 Mrdn 2y ago export const ServicesField: FC<ServicesFieldProps> = () => {
20 39380ee Mrdn 2y ago const form = useFormContext();
21 39380ee Mrdn 2y ago const { data } = useServicesQuery({ page: 1, size: 100 });
22 39380ee Mrdn 2y ago const { t } = useTranslation();
23 857e289 Mrdn 2y ago
24 39380ee Mrdn 2y ago return (
25 39380ee Mrdn 2y ago <FormField
26 97ed755 Mrdn 2y ago control={form.control}
27 39380ee Mrdn 2y ago name="services"
28 39380ee Mrdn 2y ago render={() => (
29 39380ee Mrdn 2y ago <FormItem>
30 39380ee Mrdn 2y ago <FormLabel>{t('services')}</FormLabel>
31 39380ee Mrdn 2y ago <ScrollArea className="flex flex-col justify-start px-1 h-[22rem]">
32 39380ee Mrdn 2y ago {data.entity.map(service => (
33 2e6c8cb Mrdn 2y ago <FormField
34 2e6c8cb Mrdn 2y ago control={form.control}
35 2e6c8cb Mrdn 2y ago name='services'
36 2e6c8cb Mrdn 2y ago render={({ field }) => (
37 2e6c8cb Mrdn 2y ago <FormItem key={service.id}>
38 2e6c8cb Mrdn 2y ago <FormControl>
39 2e6c8cb Mrdn 2y ago <div
40 2e6c8cb Mrdn 2y ago className={cn("flex mb-2 flex-row gap-2 items-center p-3 rounded-md border", { "bg-secondary": field.value?.includes(service.id) })}>
41 2e6c8cb Mrdn 2y ago <Checkbox
42 2e6c8cb Mrdn 2y ago checked={field.value?.includes(service.id)}
43 2e6c8cb Mrdn 2y ago onCheckedChange={(checked) => {
44 2e6c8cb Mrdn 2y ago return checked
45 2e6c8cb Mrdn 2y ago ? field.onChange([...field.value, service.id])
46 2e6c8cb Mrdn 2y ago : field.onChange(
47 2e6c8cb Mrdn 2y ago field.value?.filter(
48 2e6c8cb Mrdn 2y ago (value: number) => value !== service.id
49 39380ee Mrdn 2y ago )
50 2e6c8cb Mrdn 2y ago )
51 2e6c8cb Mrdn 2y ago }}
52 2e6c8cb Mrdn 2y ago />
53 2e6c8cb Mrdn 2y ago <FormLabel className="flex flex-row justify-between items-center w-full">
54 2e6c8cb Mrdn 2y ago <ServiceCard service={service} />
55 2e6c8cb Mrdn 2y ago </FormLabel>
56 2e6c8cb Mrdn 2y ago </div>
57 2e6c8cb Mrdn 2y ago </FormControl>
58 2e6c8cb Mrdn 2y ago <FormMessage />
59 2e6c8cb Mrdn 2y ago </FormItem>
60 2e6c8cb Mrdn 2y ago )}
61 2e6c8cb Mrdn 2y ago />
62 39380ee Mrdn 2y ago ))}
63 39380ee Mrdn 2y ago </ScrollArea>
64 39380ee Mrdn 2y ago </FormItem>
65 97ed755 Mrdn 2y ago )}
66 39380ee Mrdn 2y ago />
67 39380ee Mrdn 2y ago );
68 857e289 Mrdn 2y ago };