refactor: safe Comboxbox onChange (#886)

This commit is contained in:
Adam Shiervani 2025-10-15 05:45:48 +02:00 committed by GitHub
parent cc9ff74276
commit 403141c96a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 8 deletions

View File

@ -2,7 +2,7 @@ import { useMemo } from "react";
import { LuArrowUp, LuArrowDown, LuX, LuTrash2 } from "react-icons/lu";
import { Button } from "@/components/Button";
import { Combobox } from "@/components/Combobox";
import { Combobox, ComboboxOption } from "@/components/Combobox";
import { SelectMenuBasic } from "@/components/SelectMenuBasic";
import Card from "@/components/Card";
import FieldLabel from "@/components/FieldLabel";
@ -94,11 +94,9 @@ export function MacroStepCard({
})),
[keyDisplayMap]
);
const filteredKeys = useMemo(() => {
const selectedKeys = ensureArray(step.keys);
const availableKeys = keyOptions.filter(option => !selectedKeys.includes(option.value));
if (keyQuery === '') {
return availableKeys;
} else {
@ -176,7 +174,6 @@ export function MacroStepCard({
))}
</div>
</div>
<div className="w-full flex flex-col gap-1">
<div className="flex items-center gap-1">
<FieldLabel label="Keys" description={`Maximum ${MAX_KEYS_PER_STEP} keys per step.`} />
@ -207,8 +204,9 @@ export function MacroStepCard({
)}
<div className="relative w-full">
<Combobox
onChange={(value) => {
onKeySelect({ value: value as string | null });
onChange={(option) => {
const selectedOption = option as ComboboxOption | null;
onKeySelect({ value: selectedOption?.value ?? null });
onKeyQueryChange('');
}}
displayValue={() => keyQuery}
@ -223,7 +221,6 @@ export function MacroStepCard({
/>
</div>
</div>
<div className="w-full flex flex-col gap-1">
<div className="flex items-center gap-1">
<FieldLabel label="Step Duration" description="Time to wait before executing the next step." />
@ -241,4 +238,4 @@ export function MacroStepCard({
</div>
</Card>
);
}
}