🐛 fix(formModal/index.tsx): stop propagation of click event at the toggle component

This commit is contained in:
Lucas Oliveira 2023-06-30 10:31:03 -03:00
commit 5520ecea7a

View file

@ -403,12 +403,12 @@ export default function FormModal({
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<div className="flex py-2"> <div className="flex py-2">
<Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable> <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
<span className="text-md font-semibold text-gray-800 dark:text-white"> <span className="text-md font-semibold text-primary">
Input Variables Input Variables
</span> </span>
</div> </div>
<span className="mr-7 text-sm font-semibold text-gray-800 dark:text-white"> <span className="mr-2 text-md font-semibold text-primary">
Chat Chat Input
</span> </span>
</div> </div>
<Accordion type="single" collapsible className="w-full"> <Accordion type="single" collapsible className="w-full">
@ -422,7 +422,12 @@ export default function FormModal({
{i} {i}
</Badge> </Badge>
<div className="-mb-1"> <div
className="-mb-1"
onClick={(event) => {
event.stopPropagation();
}}
>
<ToggleShadComponent <ToggleShadComponent
enabled={chatKey === i} enabled={chatKey === i}
setEnabled={(value) => setEnabled={(value) =>
@ -430,14 +435,15 @@ export default function FormModal({
} }
size="small" size="small"
disabled={false} disabled={false}
/></div> />
</div>
</div> </div>
</AccordionTrigger> </AccordionTrigger>
<AccordionContent> <AccordionContent>
<div className="p-1 flex flex-col gap-2"> <div className="p-1 flex flex-col gap-2">
{tabsState[id.current].formKeysData.handle_keys.some( {tabsState[
(t) => t === i id.current
) ? ( ].formKeysData.handle_keys.some((t) => t === i) ? (
<div className="font-normal text-muted-foreground "> <div className="font-normal text-muted-foreground ">
Handle Handle
</div> </div>
@ -452,13 +458,16 @@ export default function FormModal({
if ( if (
!tabsState[ !tabsState[
id.current id.current
].formKeysData.handle_keys.some((t) => t === i) ].formKeysData.handle_keys.some(
(t) => t === i
)
) )
setTabsState((old) => { setTabsState((old) => {
let newTabsState = _.cloneDeep(old); let newTabsState = _.cloneDeep(old);
newTabsState[ newTabsState[
id.current id.current
].formKeysData.input_keys[i] = e.target.value; ].formKeysData.input_keys[i] =
e.target.value;
return newTabsState; return newTabsState;
}); });
}} }}
@ -468,7 +477,6 @@ export default function FormModal({
</div> </div>
</AccordionContent> </AccordionContent>
</AccordionItem> </AccordionItem>
</div> </div>
) )
)} )}