Spaces:
Running
Running
File size: 3,068 Bytes
7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f 7a0c9ff a8d792f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 |
"use client";
import { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogFooter,
DialogClose,
} from "@/components/ui/dialog";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import type { RobotConnection } from "@/types/robot";
interface EditRobotDialogProps {
robot: RobotConnection | null;
isOpen: boolean;
onOpenChange: (open: boolean) => void;
onSave: (updatedRobot: RobotConnection) => void;
}
export function EditRobotDialog({
robot,
isOpen,
onOpenChange,
onSave,
}: EditRobotDialogProps) {
const [name, setName] = useState("");
const [type, setType] = useState<"so100_follower" | "so100_leader">(
"so100_follower"
);
useEffect(() => {
if (robot) {
setName(robot.name);
setType(robot.robotType || "so100_follower");
}
}, [robot]);
const handleSave = () => {
if (robot) {
onSave({ ...robot, name, robotId: name, robotType: type });
}
};
if (!robot) return null;
return (
<Dialog open={isOpen} onOpenChange={onOpenChange}>
<DialogContent className="font-sans bg-background/80 backdrop-blur-sm border-primary/20">
<DialogHeader>
<DialogTitle>Configure Robot</DialogTitle>
</DialogHeader>
<div className="grid gap-4 py-4">
<div className="grid grid-cols-4 items-center gap-4">
<Label htmlFor="name" className="text-right">
Name
</Label>
<Input
id="name"
value={name}
onChange={(e) => setName(e.target.value)}
className="col-span-3 font-mono"
/>
</div>
<div className="grid grid-cols-4 items-center gap-4">
<Label className="text-right">Type</Label>
<RadioGroup
value={type}
onValueChange={(value) =>
setType(value as "so100_follower" | "so100_leader")
}
className="col-span-3"
>
<div className="flex items-center space-x-2">
<RadioGroupItem value="so100_follower" id="r1" />
<Label htmlFor="r1">SO-100 Follower</Label>
</div>
<div className="flex items-center space-x-2">
<RadioGroupItem value="so100_leader" id="r2" />
<Label htmlFor="r2">SO-100 Leader</Label>
</div>
</RadioGroup>
</div>
</div>
<DialogFooter>
<DialogClose asChild>
<Button type="button" variant="secondary">
Cancel
</Button>
</DialogClose>
<DialogClose asChild>
<Button type="submit" onClick={handleSave}>
Save Changes
</Button>
</DialogClose>
</DialogFooter>
</DialogContent>
</Dialog>
);
}
|