apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-05-13 17:22:37 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

editor: add scenario form updates

Browse source
This commit is contained in:
ramnique 2025-01-23 12:11:09 +05:30
parent 12cf000b94
commit 4683981913
1 changed files with 13 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

24
apps/rowboat/app/projects/[projectId]/playground/scenario-list.tsx
View file

@ -6,13 +6,12 @@ import { getScenarios, createScenario, updateScenario, deleteScenario } from "@/
import { Scenario, WithStringId } from "@/app/lib/types"; import { Scenario, WithStringId } from "@/app/lib/types";
import { z } from "zod"; import { z } from "zod";
import { EditableField } from "@/app/lib/components/editable-field"; import { EditableField } from "@/app/lib/components/editable-field";
import { HamburgerIcon } from "@/app/lib/components/icons"; import { EllipsisVerticalIcon, PlayIcon, PlusIcon } from "lucide-react";
import { EllipsisVerticalIcon, PlayIcon } from "lucide-react";
export function AddScenarioForm({ export function AddScenarioForm({
onAdd, onAdd,
}: { }: {
onAdd: (name: string, description: string) => void; onAdd: (name: string, description: string) => Promise<void>;
}) { }) {
const [name, setName] = useState(""); const [name, setName] = useState("");
const [description, setDescription] = useState(""); const [description, setDescription] = useState("");
@ -20,9 +19,14 @@ export function AddScenarioForm({
const [saving, setSaving] = useState(false); const [saving, setSaving] = useState(false);
const handleAdd = async () => { const handleAdd = async () => {
if (!name.trim() || !description.trim()) {
setError("Name and description are required");
return;
}
try { try {
setSaving(true); setSaving(true);
await onAdd(name, description); await onAdd(name.trim(), description.trim());
setName(""); setName("");
setDescription(""); setDescription("");
setError(null); setError(null);
@ -34,7 +38,7 @@ export function AddScenarioForm({
}; };
return <div className="flex flex-col gap-2 border rounded-lg p-4 shadow-sm"> return <div className="flex flex-col gap-2 border rounded-lg p-4 shadow-sm">
<div className="font-semibold text-gray-500">Add Scenario</div> <div className="font-semibold text-gray-500">Add scenario</div>
<Input <Input
label="Scenario Name" label="Scenario Name"
labelPlacement="outside" labelPlacement="outside"
@ -61,17 +65,15 @@ export function AddScenarioForm({
<Button <Button
onClick={handleAdd} onClick={handleAdd}
isLoading={saving} isLoading={saving}
isDisabled={saving} isDisabled={saving || !name.trim() || !description.trim()}
size="sm" size="sm"
className="self-start" className="self-start"
variant="bordered" variant="bordered"
startContent={ startContent={
<svg className="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"> <PlusIcon size={16} />
<path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" d="M5 12h14m-7 7V5" />
</svg>
} }
> >
Add Scenario Add scenario
</Button> </Button>
</div> </div>
} }
@ -158,7 +160,7 @@ export function ScenarioList({
size="sm" size="sm"
variant="bordered" variant="bordered"
> >
Add Scenario Add scenario
</Button>} </Button>}
</div> </div>
{loading && <div className="flex justify-center items-center p-8 gap-2"> {loading && <div className="flex justify-center items-center p-8 gap-2">