From 0142b31a38b1217ee103a6d24c502edb87ea3810 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Fri, 21 Nov 2025 15:08:43 +0100
Subject: [PATCH] fix: remove deprecated text-dialog component causing build
 errors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The text-dialog modal approach was replaced by the on-canvas text editor.
This file referenced old TextStore properties (isDialogOpen, clickPosition)
that no longer exist, causing TypeScript compilation errors.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 components/modals/text-dialog.tsx | 288 ------------------------------
 1 file changed, 288 deletions(-)
 delete mode 100644 components/modals/text-dialog.tsx

diff --git a/components/modals/text-dialog.tsx b/components/modals/text-dialog.tsx
deleted file mode 100644
index 5c1d3c5..0000000
--- a/components/modals/text-dialog.tsx
+++ /dev/null
@@ -1,288 +0,0 @@
-'use client';
-
-import { useState, useEffect } from 'react';
-import { X, Type } from 'lucide-react';
-import { useTextStore } from '@/store/text-store';
-import { TextTool } from '@/tools/text-tool';
-import { WEB_SAFE_FONTS, GOOGLE_FONTS, loadGoogleFont } from '@/lib/text-utils';
-import type { FontStyle, FontWeight, TextAlign } from '@/types/text';
-
-export function TextDialog() {
-  const {
-    settings,
-    isDialogOpen,
-    clickPosition,
-    setText,
-    setFontFamily,
-    setFontSize,
-    setFontStyle,
-    setFontWeight,
-    setColor,
-    setAlign,
-    setLineHeight,
-    setLetterSpacing,
-    closeDialog,
-  } = useTextStore();
-
-  const [text, setTextLocal] = useState(settings.text);
-  const [isLoadingFont, setIsLoadingFont] = useState(false);
-
-  useEffect(() => {
-    if (isDialogOpen) {
-      setTextLocal(settings.text);
-    }
-  }, [isDialogOpen, settings.text]);
-
-  if (!isDialogOpen || !clickPosition) return null;
-
-  const handleInsert = async () => {
-    if (!text.trim()) {
-      closeDialog();
-      return;
-    }
-
-    // Update text in store
-    setText(text);
-
-    // Load Google Font if needed
-    if (GOOGLE_FONTS.includes(settings.fontFamily as any)) {
-      try {
-        setIsLoadingFont(true);
-        await loadGoogleFont(settings.fontFamily);
-      } catch (error) {
-        console.error('Failed to load font:', error);
-      } finally {
-        setIsLoadingFont(false);
-      }
-    }
-
-    // Render text on canvas
-    TextTool.renderTextOnCanvas(clickPosition.x, clickPosition.y);
-
-    // Close dialog
-    closeDialog();
-    setTextLocal('');
-  };
-
-  const handleCancel = () => {
-    closeDialog();
-    setTextLocal('');
-  };
-
-  const allFonts = [...WEB_SAFE_FONTS, ...GOOGLE_FONTS];
-
-  return (
-    <div
-      className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
-      onClick={handleCancel}
-    >
-      <div
-        className="bg-card border border-border rounded-lg shadow-lg w-full max-w-2xl max-h-[90vh] overflow-y-auto"
-        onClick={(e) => e.stopPropagation()}
-      >
-        {/* Header */}
-        <div className="flex items-center justify-between p-4 border-b border-border sticky top-0 bg-card z-10">
-          <div className="flex items-center gap-2">
-            <Type className="h-5 w-5 text-primary" />
-            <h2 className="text-lg font-semibold text-card-foreground">Add Text</h2>
-          </div>
-          <button
-            onClick={handleCancel}
-            className="p-1 hover:bg-accent rounded transition-colors"
-          >
-            <X className="h-5 w-5" />
-          </button>
-        </div>
-
-        {/* Content */}
-        <div className="p-4 space-y-4">
-          {/* Text Input */}
-          <div className="space-y-2">
-            <label className="text-sm font-medium text-card-foreground">Text</label>
-            <textarea
-              value={text}
-              onChange={(e) => setTextLocal(e.target.value)}
-              placeholder="Enter your text here..."
-              className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground min-h-[120px] resize-y"
-              autoFocus
-            />
-          </div>
-
-          {/* Font Family */}
-          <div className="space-y-2">
-            <label className="text-sm font-medium text-card-foreground">Font Family</label>
-            <select
-              value={settings.fontFamily}
-              onChange={(e) => setFontFamily(e.target.value)}
-              className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground"
-            >
-              <optgroup label="Web Safe Fonts">
-                {WEB_SAFE_FONTS.map((font) => (
-                  <option key={font} value={font} style={{ fontFamily: font }}>
-                    {font}
-                  </option>
-                ))}
-              </optgroup>
-              <optgroup label="Google Fonts">
-                {GOOGLE_FONTS.map((font) => (
-                  <option key={font} value={font}>
-                    {font}
-                  </option>
-                ))}
-              </optgroup>
-            </select>
-          </div>
-
-          {/* Font Size, Style, Weight */}
-          <div className="grid grid-cols-3 gap-4">
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">Size</label>
-              <input
-                type="number"
-                min="8"
-                max="500"
-                value={settings.fontSize}
-                onChange={(e) => setFontSize(Number(e.target.value))}
-                className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground"
-              />
-            </div>
-
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">Style</label>
-              <select
-                value={settings.fontStyle}
-                onChange={(e) => setFontStyle(e.target.value as FontStyle)}
-                className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground"
-              >
-                <option value="normal">Normal</option>
-                <option value="italic">Italic</option>
-              </select>
-            </div>
-
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">Weight</label>
-              <select
-                value={settings.fontWeight}
-                onChange={(e) => setFontWeight(e.target.value as FontWeight)}
-                className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground"
-              >
-                <option value="normal">Normal</option>
-                <option value="bold">Bold</option>
-                <option value="100">100 - Thin</option>
-                <option value="300">300 - Light</option>
-                <option value="500">500 - Medium</option>
-                <option value="600">600 - Semi Bold</option>
-                <option value="700">700 - Bold</option>
-                <option value="900">900 - Black</option>
-              </select>
-            </div>
-          </div>
-
-          {/* Color and Alignment */}
-          <div className="grid grid-cols-2 gap-4">
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">Color</label>
-              <div className="flex gap-2">
-                <input
-                  type="color"
-                  value={settings.color}
-                  onChange={(e) => setColor(e.target.value)}
-                  className="h-10 w-16 rounded border border-border cursor-pointer"
-                />
-                <input
-                  type="text"
-                  value={settings.color}
-                  onChange={(e) => setColor(e.target.value)}
-                  className="flex-1 px-3 py-2 rounded-md border border-border bg-background text-foreground"
-                />
-              </div>
-            </div>
-
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">Alignment</label>
-              <select
-                value={settings.align}
-                onChange={(e) => setAlign(e.target.value as TextAlign)}
-                className="w-full px-3 py-2 rounded-md border border-border bg-background text-foreground"
-              >
-                <option value="left">Left</option>
-                <option value="center">Center</option>
-                <option value="right">Right</option>
-              </select>
-            </div>
-          </div>
-
-          {/* Line Height and Letter Spacing */}
-          <div className="grid grid-cols-2 gap-4">
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">
-                Line Height ({settings.lineHeight.toFixed(2)})
-              </label>
-              <input
-                type="range"
-                min="0.5"
-                max="3"
-                step="0.1"
-                value={settings.lineHeight}
-                onChange={(e) => setLineHeight(Number(e.target.value))}
-                className="w-full"
-              />
-            </div>
-
-            <div className="space-y-2">
-              <label className="text-sm font-medium text-card-foreground">
-                Letter Spacing ({settings.letterSpacing}px)
-              </label>
-              <input
-                type="range"
-                min="-10"
-                max="50"
-                step="1"
-                value={settings.letterSpacing}
-                onChange={(e) => setLetterSpacing(Number(e.target.value))}
-                className="w-full"
-              />
-            </div>
-          </div>
-
-          {/* Preview */}
-          <div className="space-y-2">
-            <label className="text-sm font-medium text-card-foreground">Preview</label>
-            <div
-              className="w-full px-4 py-8 rounded-md border border-border bg-background flex items-center justify-center min-h-[100px]"
-              style={{
-                color: settings.color,
-                fontFamily: settings.fontFamily,
-                fontSize: `${Math.min(settings.fontSize, 48)}px`,
-                fontStyle: settings.fontStyle,
-                fontWeight: settings.fontWeight,
-                textAlign: settings.align,
-                lineHeight: settings.lineHeight,
-                letterSpacing: `${settings.letterSpacing}px`,
-              }}
-            >
-              {text || 'Your text will appear here'}
-            </div>
-          </div>
-        </div>
-
-        {/* Footer */}
-        <div className="flex items-center justify-end gap-2 p-4 border-t border-border sticky bottom-0 bg-card">
-          <button
-            onClick={handleCancel}
-            className="px-4 py-2 rounded-md border border-border hover:bg-accent transition-colors"
-          >
-            Cancel
-          </button>
-          <button
-            onClick={handleInsert}
-            disabled={!text.trim() || isLoadingFont}
-            className="px-4 py-2 rounded-md bg-primary text-primary-foreground hover:bg-primary/90 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
-          >
-            {isLoadingFont ? 'Loading Font...' : 'Insert Text'}
-          </button>
-        </div>
-      </div>
-    </div>
-  );
-}