fix random "element went from uncontrolled to controlled" warnings

This commit is contained in:
Grant 2024-05-25 22:42:20 -06:00
parent 94b4cdd3b8
commit 80c80057ee
2 changed files with 15 additions and 7 deletions

View File

@ -10,7 +10,11 @@ export const ChatSettings = () => {
return ( return (
<> <>
<header> <header>
<Switch size="sm" isSelected={loadChat} onValueChange={setLoadChat} /> <Switch
size="sm"
isSelected={loadChat || false}
onValueChange={setLoadChat}
/>
<h2>Chat</h2> <h2>Chat</h2>
</header> </header>
<section> <section>

View File

@ -20,14 +20,18 @@ export const TemplateSettings = () => {
return ( return (
<> <>
<header> <header>
<Switch size="sm" isSelected={enable} onValueChange={setEnable} /> <Switch
size="sm"
isSelected={enable || false}
onValueChange={setEnable}
/>
<h2>Template</h2> <h2>Template</h2>
</header> </header>
<section> <section>
<Input <Input
label="Template URL" label="Template URL"
size="sm" size="sm"
value={url} value={url || ""}
onValueChange={setURL} onValueChange={setURL}
/> />
<Input <Input
@ -36,7 +40,7 @@ export const TemplateSettings = () => {
type="number" type="number"
min="1" min="1"
max={10_000} max={10_000}
value={width?.toString()} value={width?.toString() || ""}
onValueChange={(v) => setWidth(parseInt(v))} onValueChange={(v) => setWidth(parseInt(v))}
/> />
<div className="flex flex-row gap-1"> <div className="flex flex-row gap-1">
@ -44,14 +48,14 @@ export const TemplateSettings = () => {
label="Template X" label="Template X"
size="sm" size="sm"
type="number" type="number"
value={x.toString()} value={x?.toString() || ""}
onValueChange={(v) => setX(parseInt(v))} onValueChange={(v) => setX(parseInt(v))}
/> />
<Input <Input
label="Template Y" label="Template Y"
size="sm" size="sm"
type="number" type="number"
value={y.toString()} value={y?.toString() || ""}
onValueChange={(v) => setY(parseInt(v))} onValueChange={(v) => setY(parseInt(v))}
/> />
</div> </div>
@ -60,7 +64,7 @@ export const TemplateSettings = () => {
step={1} step={1}
minValue={0} minValue={0}
maxValue={100} maxValue={100}
value={opacity} value={opacity || 100}
onChange={(v) => setOpacity(v as number)} onChange={(v) => setOpacity(v as number)}
getValue={(v) => v + "%"} getValue={(v) => v + "%"}
/> />