From 0d89597fc0be9b916f8e918052b34b56f69241a0 Mon Sep 17 00:00:00 2001
From: chihlasm <michael@chihlas.com>
Date: Sun, 29 Mar 2026 05:58:39 +0000
Subject: [PATCH] chore: delete SaveToLibraryDialog, replaced by
 ParameterizeAndSavePanel

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../script-builder/SaveToLibraryDialog.tsx    | 186 ------------------
 1 file changed, 186 deletions(-)
 delete mode 100644 frontend/src/components/script-builder/SaveToLibraryDialog.tsx

diff --git a/frontend/src/components/script-builder/SaveToLibraryDialog.tsx b/frontend/src/components/script-builder/SaveToLibraryDialog.tsx
deleted file mode 100644
index b3be2145..00000000
--- a/frontend/src/components/script-builder/SaveToLibraryDialog.tsx
+++ /dev/null
@@ -1,186 +0,0 @@
-import { useState, useEffect } from 'react'
-import { X, Loader2 } from 'lucide-react'
-import { cn } from '@/lib/utils'
-import { scriptBuilderApi, scriptsApi } from '@/api'
-import type { ScriptCategoryResponse } from '@/types'
-
-interface SaveToLibraryDialogProps {
-  sessionId: string
-  defaultName: string
-  defaultDescription?: string
-  onClose: () => void
-  onSaved: () => void
-}
-
-export function SaveToLibraryDialog({
-  sessionId,
-  defaultName,
-  defaultDescription,
-  onClose,
-  onSaved,
-}: SaveToLibraryDialogProps) {
-  const [name, setName] = useState(defaultName)
-  const [description, setDescription] = useState(defaultDescription || '')
-  const [categoryId, setCategoryId] = useState('')
-  const [shareWithTeam, setShareWithTeam] = useState(false)
-  const [categories, setCategories] = useState<ScriptCategoryResponse[]>([])
-  const [isSaving, setIsSaving] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-
-  useEffect(() => {
-    scriptsApi.getCategories().then(setCategories).catch(() => {})
-  }, [])
-
-  useEffect(() => {
-    const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') onClose()
-    }
-    document.addEventListener('keydown', handleKeyDown)
-    return () => document.removeEventListener('keydown', handleKeyDown)
-  }, [onClose])
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
-    if (!name.trim()) return
-
-    setIsSaving(true)
-    setError(null)
-
-    try {
-      await scriptBuilderApi.saveToLibrary(sessionId, {
-        name: name.trim(),
-        description: description.trim() || undefined,
-        category_id: categoryId || undefined,
-        share_with_team: shareWithTeam,
-      })
-      onSaved()
-    } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to save script. Please try again.')
-    } finally {
-      setIsSaving(false)
-    }
-  }
-
-  return (
-    <div
-      className="fixed inset-0 z-50 bg-black/80  flex items-center justify-center"
-      onClick={(e) => { if (e.target === e.currentTarget) onClose() }}
-    >
-      <div className="card-flat max-w-md w-full mx-4 rounded-xl overflow-hidden">
-        {/* Header */}
-        <div className="flex items-center justify-between px-5 py-3.5 border-b border-[rgba(255,255,255,0.06)]">
-          <h3 className="text-sm font-heading font-bold text-foreground">Save to Library</h3>
-          <button
-            onClick={onClose}
-            className="p-1.5 rounded-lg text-muted-foreground hover:text-foreground hover:bg-[rgba(255,255,255,0.06)] transition-colors"
-          >
-            <X size={18} />
-          </button>
-        </div>
-
-        {/* Form */}
-        <form onSubmit={handleSubmit} className="p-5 space-y-4">
-          {/* Name */}
-          <div>
-            <label className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground mb-1.5 block">
-              Name *
-            </label>
-            <input
-              type="text"
-              value={name}
-              onChange={(e) => setName(e.target.value)}
-              required
-              className={cn(
-                "w-full rounded-lg px-3 py-2 text-sm",
-                "border border-border bg-card text-foreground placeholder:text-muted-foreground",
-                "focus:outline-none focus:border-[rgba(249,115,22,0.3)] transition-colors"
-              )}
-              placeholder="Script name"
-            />
-          </div>
-
-          {/* Description */}
-          <div>
-            <label className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground mb-1.5 block">
-              Description
-            </label>
-            <textarea
-              value={description}
-              onChange={(e) => setDescription(e.target.value)}
-              rows={3}
-              className={cn(
-                "w-full rounded-lg px-3 py-2 text-sm resize-none",
-                "border border-border bg-card text-foreground placeholder:text-muted-foreground",
-                "focus:outline-none focus:border-[rgba(249,115,22,0.3)] transition-colors"
-              )}
-              placeholder="What does this script do?"
-            />
-          </div>
-
-          {/* Category */}
-          <div>
-            <label className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground mb-1.5 block">
-              Category
-            </label>
-            <select
-              value={categoryId}
-              onChange={(e) => setCategoryId(e.target.value)}
-              className={cn(
-                "w-full rounded-lg px-3 py-2 text-sm",
-                "border border-border bg-card text-foreground",
-                "focus:outline-none focus:border-[rgba(249,115,22,0.3)] transition-colors"
-              )}
-            >
-              <option value="">No category</option>
-              {categories.map((cat) => (
-                <option key={cat.id} value={cat.id}>{cat.name}</option>
-              ))}
-            </select>
-          </div>
-
-          {/* Share with team */}
-          <label className="flex items-center gap-3 cursor-pointer">
-            <input
-              type="checkbox"
-              checked={shareWithTeam}
-              onChange={(e) => setShareWithTeam(e.target.checked)}
-              className="w-4 h-4 rounded border-border bg-card text-orange-500 focus:ring-orange-500/20"
-            />
-            <span className="text-sm text-foreground">Share with team</span>
-          </label>
-
-          {/* Error */}
-          {error && (
-            <p className="text-xs text-rose-400">{error}</p>
-          )}
-
-          {/* Actions */}
-          <div className="flex items-center justify-end gap-2 pt-2">
-            <button
-              type="button"
-              onClick={onClose}
-              className={cn(
-                "px-4 py-2 rounded-lg text-sm font-medium transition-colors",
-                "bg-[rgba(255,255,255,0.04)] border border-[rgba(255,255,255,0.06)] text-foreground hover:border-[rgba(255,255,255,0.12)]"
-              )}
-            >
-              Cancel
-            </button>
-            <button
-              type="submit"
-              disabled={!name.trim() || isSaving}
-              className={cn(
-                "flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-semibold transition-all",
-                "bg-primary text-white hover:brightness-110 active:scale-[0.98]",
-                "disabled:opacity-50 disabled:cursor-not-allowed"
-              )}
-            >
-              {isSaving && <Loader2 size={14} className="animate-spin" />}
-              {isSaving ? 'Saving...' : 'Save to Library'}
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-  )
-}