[dyad] Adding a toggle for presets - wrote 1 file(s)

src/components/settings/preset-settings.tsx

@@ -1,9 +1,11 @@
 "use client";
 
+import { useState } from "react";
 import { ConversionSettings } from "@/types";
 import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Switch } from "@/components/ui/switch";
 import { toast } from "sonner";
 
 type Preset = {
@@ -31,6 +33,8 @@ interface PresetSettingsProps {
 }
 
 export function PresetSettings({ onSettingsChange }: PresetSettingsProps) {
+  const [presetsEnabled, setPresetsEnabled] = useState(false);
+
   const handlePresetSelect = (presetName: string) => {
     const selectedPreset = presets.find(p => p.name === presetName);
     if (selectedPreset) {
@@ -42,9 +46,18 @@ export function PresetSettings({ onSettingsChange }: PresetSettingsProps) {
   return (
     <Card>
       <CardHeader>
+        <div className="flex items-center justify-between">
+          <div>
             <CardTitle className="text-lg font-medium leading-none">Presets</CardTitle>
             <p className="text-sm text-muted-foreground mt-1">Schnell gängige Einstellungen anwenden.</p>
+          </div>
+          <div className="flex items-center space-x-2">
+            <Label htmlFor="enable-presets" className="cursor-pointer">Aktivieren</Label>
+            <Switch id="enable-presets" checked={presetsEnabled} onCheckedChange={setPresetsEnabled} />
+          </div>
+        </div>
       </CardHeader>
+      {presetsEnabled && (
         <CardContent>
           <div className="space-y-2">
             <Label htmlFor="presets">Preset auswählen</Label>
@@ -62,6 +75,7 @@ export function PresetSettings({ onSettingsChange }: PresetSettingsProps) {
             </Select>
           </div>
         </CardContent>
+      )}
     </Card>
   );
 }