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-alpha3
Source
1 857e289 Mrdn 2y ago import {
2 857e289 Mrdn 2y ago FormControl,
3 857e289 Mrdn 2y ago FormField,
4 857e289 Mrdn 2y ago FormItem,
5 857e289 Mrdn 2y ago FormLabel,
6 857e289 Mrdn 2y ago FormMessage,
7 857e289 Mrdn 2y ago ToggleGroup,
8 857e289 Mrdn 2y ago ToggleGroupItem,
9 857e289 Mrdn 2y ago ScrollArea
10 857e289 Mrdn 2y ago } from '@marzneshin/components';
11 857e289 Mrdn 2y ago import { useServicesQuery } from '@marzneshin/features/services';
12 857e289 Mrdn 2y ago import { ServiceCard } from '@marzneshin/features/users';
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 857e289 Mrdn 2y ago interface ServicesFieldProps {
18 857e289 Mrdn 2y ago services: number[]
19 857e289 Mrdn 2y ago setServices: (s: number[]) => void
20 857e289 Mrdn 2y ago }
21 857e289 Mrdn 2y ago
22 857e289 Mrdn 2y ago export const ServicesField: FC<ServicesFieldProps> = ({
23 857e289 Mrdn 2y ago services,
24 857e289 Mrdn 2y ago setServices
25 857e289 Mrdn 2y ago }) => {
26 857e289 Mrdn 2y ago const form = useFormContext();
27 578311c Mrdn 2y ago const { data } = useServicesQuery({ page: 1, size: 100 });
28 857e289 Mrdn 2y ago const { t } = useTranslation();
29 857e289 Mrdn 2y ago
30 857e289 Mrdn 2y ago const handleToggle = (selectedServiceIds: string[]) => {
31 857e289 Mrdn 2y ago setServices(selectedServiceIds.map(Number));
32 857e289 Mrdn 2y ago };
33 857e289 Mrdn 2y ago
34 857e289 Mrdn 2y ago return (
35 857e289 Mrdn 2y ago <FormField
36 857e289 Mrdn 2y ago control={form.control}
37 857e289 Mrdn 2y ago name="services"
38 857e289 Mrdn 2y ago render={() => (
39 857e289 Mrdn 2y ago <FormItem>
40 857e289 Mrdn 2y ago <FormLabel>{t('services')}</FormLabel>
41 857e289 Mrdn 2y ago <FormControl>
42 857e289 Mrdn 2y ago <ToggleGroup
43 857e289 Mrdn 2y ago defaultValue={services.map(String)}
44 857e289 Mrdn 2y ago className="h-full"
45 857e289 Mrdn 2y ago onValueChange={handleToggle}
46 857e289 Mrdn 2y ago type="multiple"
47 857e289 Mrdn 2y ago >
48 857e289 Mrdn 2y ago <ScrollArea className="flex flex-col justify-start px-1 h-[22rem]">
49 578311c Mrdn 2y ago {data.entity.map(service => (
50 857e289 Mrdn 2y ago <ToggleGroupItem
51 857e289 Mrdn 2y ago key={service.id}
52 857e289 Mrdn 2y ago value={String(service.id)}
53 857e289 Mrdn 2y ago {...form.register(`services.${service.id}`)}
54 857e289 Mrdn 2y ago className="px-0 mb-1 w-full"
55 857e289 Mrdn 2y ago >
56 857e289 Mrdn 2y ago <ServiceCard service={service} />
57 857e289 Mrdn 2y ago </ToggleGroupItem>
58 857e289 Mrdn 2y ago ))}
59 857e289 Mrdn 2y ago </ScrollArea>
60 857e289 Mrdn 2y ago </ToggleGroup>
61 857e289 Mrdn 2y ago </FormControl>
62 857e289 Mrdn 2y ago <FormMessage />
63 857e289 Mrdn 2y ago </FormItem>
64 857e289 Mrdn 2y ago )}
65 857e289 Mrdn 2y ago />
66 857e289 Mrdn 2y ago );
67 857e289 Mrdn 2y ago };