gitscope
/
← marzneshin / app/dashboard/src/pages/services/dialog/inbounds-select-list.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
app/dashboard/src/pages/services/dialog/inbounds-select-list.tsx · v0.1.2
Source
1 912788f Mardin 2y ago
2 912788f Mardin 2y ago import {
3 912788f Mardin 2y ago Stack,
4 912788f Mardin 2y ago } from '@chakra-ui/react';
5 bedeeff Mardin 2y ago import { ListCheckBox } from 'components/list-check-box';
6 89f8f93 Mardin 2y ago import { Inbounds, InboundType } from 'types';
7 2ae554f Mardin 2y ago import { forwardRef, Fragment, ReactNode } from 'react';
8 912788f Mardin 2y ago import {
9 912788f Mardin 2y ago useFormContext,
10 912788f Mardin 2y ago } from 'react-hook-form';
11 912788f Mardin 2y ago
12 912788f Mardin 2y ago interface InboundsSelectListProps {
13 4205669 Mardin 2y ago list: Inbounds;
14 4205669 Mardin 2y ago renderCheckboxContent: (inbound: InboundType) => ReactNode;
15 912788f Mardin 2y ago }
16 912788f Mardin 2y ago
17 912788f Mardin 2y ago export const InboundsSelectList = forwardRef<HTMLDivElement, InboundsSelectListProps>(
18 912788f Mardin 2y ago function({ list, renderCheckboxContent }, ref) {
19 912788f Mardin 2y ago const form = useFormContext();
20 912788f Mardin 2y ago
21 912788f Mardin 2y ago const handleInboundToggle = (inboundId: number) => {
22 912788f Mardin 2y ago const currentInbounds = form.getValues('inbounds');
23 912788f Mardin 2y ago const isSelected = currentInbounds.includes(inboundId);
24 912788f Mardin 2y ago
25 912788f Mardin 2y ago let updatedInbounds = currentInbounds.filter((id: number) => id !== inboundId);
26 912788f Mardin 2y ago
27 912788f Mardin 2y ago if (!isSelected) {
28 912788f Mardin 2y ago updatedInbounds = [...currentInbounds, inboundId];
29 912788f Mardin 2y ago }
30 912788f Mardin 2y ago
31 912788f Mardin 2y ago form.setValue('inbounds', updatedInbounds, { shouldValidate: true });
32 912788f Mardin 2y ago };
33 912788f Mardin 2y ago
34 912788f Mardin 2y ago return (
35 912788f Mardin 2y ago <Stack spacing={3} ref={ref}>
36 912788f Mardin 2y ago {list.map((inbound: InboundType) => (
37 2ae554f Mardin 2y ago <Fragment key={inbound.id}>
38 2ae554f Mardin 2y ago <ListCheckBox
39 2ae554f Mardin 2y ago isChecked={form.getValues('inbounds').includes(inbound.id)}
40 2ae554f Mardin 2y ago onChange={() => handleInboundToggle(inbound.id)}
41 2ae554f Mardin 2y ago value={String(inbound.id)}
42 2ae554f Mardin 2y ago renderContent={() => renderCheckboxContent(inbound)}
43 2ae554f Mardin 2y ago />
44 2ae554f Mardin 2y ago </Fragment>
45 912788f Mardin 2y ago ))}
46 912788f Mardin 2y ago </Stack>
47 912788f Mardin 2y ago );
48 912788f Mardin 2y ago }
49 912788f Mardin 2y ago );