시나리오

2025-01-25 09:51:11 +09:00
parent 097b2c79c2
commit bca5840712
17 changed files with 989 additions and 515 deletions
@@ -0,0 +1,111 @@
+import React, { useState } from 'react';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import ErrorAlertDialog from '@/components/shared/ErrorAlertDialog.jsx';
+
+const AddScenarioDialog = ({ open, onOpenChange, onSubmit }) => {
+  const [scenarioName, setScenarioName] = useState('');
+  const [error, setError] = useState('');
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [showErrorDialog, setShowErrorDialog] = useState(false);
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+
+    if (!scenarioName.trim()) {
+      setError('시나리오 이름을 입력해주세요');
+      return;
+    }
+
+    setIsSubmitting(true);
+    try {
+      const success = await onSubmit(scenarioName.trim());
+      if (success) {
+        setScenarioName('');
+        setError('');
+        onOpenChange(false);
+      } else {
+        setError('시나리오 생성에 실패했습니다');
+        setShowErrorDialog(true);
+      }
+    } catch (err) {
+      setError(err.message || '시나리오 생성에 실패했습니다');
+      setShowErrorDialog(true);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleOpenChange = (open) => {
+    if (!open) {
+      setScenarioName('');
+      setError('');
+    }
+    onOpenChange(open);
+  };
+
+  return (
+      <>
+        <Dialog open={open} onOpenChange={handleOpenChange}>
+          <DialogContent>
+            <DialogHeader>
+              <DialogTitle>새 시나리오 추가</DialogTitle>
+              <DialogDescription>
+                새로운 시나리오의 이름을 입력해주세요
+              </DialogDescription>
+            </DialogHeader>
+            <form onSubmit={handleSubmit}>
+              <div className="grid gap-4 py-4">
+                <div className="grid gap-2">
+                  <Label htmlFor="name">시나리오 이름</Label>
+                  <Input
+                      id="name"
+                      value={scenarioName}
+                      onChange={(e) => {
+                        setScenarioName(e.target.value);
+                        setError('');
+                      }}
+                      placeholder="시나리오 이름을 입력하세요"
+                  />
+                </div>
+              </div>
+              <DialogFooter>
+                <Button
+                    type="button"
+                    variant="outline"
+                    onClick={() => handleOpenChange(false)}
+                    disabled={isSubmitting}
+                >
+                  취소
+                </Button>
+                <Button
+                    type="submit"
+                    disabled={isSubmitting}
+                >
+                  {isSubmitting ? '생성 중...' : '생성'}
+                </Button>
+              </DialogFooter>
+            </form>
+          </DialogContent>
+        </Dialog>
+
+        <ErrorAlertDialog
+            open={showErrorDialog}
+            onOpenChange={setShowErrorDialog}
+            title="시나리오 생성 오류"
+            description={error}
+        />
+      </>
+  );
+};
+
+export default AddScenarioDialog;