79 lines
3.2 KiB
TypeScript
79 lines
3.2 KiB
TypeScript
"use client";
|
|
|
|
import { ConversionSettings } from "@/types";
|
|
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion";
|
|
import { ImageSettings } from "./settings/image-settings";
|
|
import { FilenameSettings } from "./settings/filename-settings";
|
|
import { QualitySettings } from "./settings/quality-settings";
|
|
import { PresetSettings } from "./settings/preset-settings";
|
|
|
|
interface SettingsPanelProps {
|
|
settings: ConversionSettings;
|
|
onSettingsChange: (settings: Partial<ConversionSettings>) => void;
|
|
onAspectRatioChange: (value: string) => void;
|
|
onSwapDimensions: () => void;
|
|
onApplyDefaultBaseNameToAll: () => void;
|
|
hasImages: boolean;
|
|
}
|
|
|
|
export function SettingsPanel({
|
|
settings,
|
|
onSettingsChange,
|
|
onAspectRatioChange,
|
|
onSwapDimensions,
|
|
onApplyDefaultBaseNameToAll,
|
|
hasImages,
|
|
}: SettingsPanelProps) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<PresetSettings onSettingsChange={onSettingsChange} />
|
|
<Accordion type="single" collapsible defaultValue="image-settings" className="w-full space-y-4">
|
|
<AccordionItem value="image-settings" className="border rounded-lg bg-card">
|
|
<AccordionTrigger className="p-6 hover:no-underline">
|
|
<div className="text-left">
|
|
<h3 className="text-lg font-medium leading-none">Image Settings</h3>
|
|
<p className="text-sm text-muted-foreground mt-1">Adjust resolution and scaling for all images.</p>
|
|
</div>
|
|
</AccordionTrigger>
|
|
<AccordionContent className="px-6 pb-6">
|
|
<ImageSettings
|
|
settings={settings}
|
|
onSettingsChange={onSettingsChange}
|
|
onAspectRatioChange={onAspectRatioChange}
|
|
onSwapDimensions={onSwapDimensions}
|
|
/>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
|
|
<AccordionItem value="filename-settings" className="border rounded-lg bg-card">
|
|
<AccordionTrigger className="p-6 hover:no-underline">
|
|
<div className="text-left">
|
|
<h3 className="text-lg font-medium leading-none">Filename Settings</h3>
|
|
<p className="text-sm text-muted-foreground mt-1">Customize the output filenames.</p>
|
|
</div>
|
|
</AccordionTrigger>
|
|
<AccordionContent className="px-6 pb-6">
|
|
<FilenameSettings
|
|
settings={settings}
|
|
onSettingsChange={onSettingsChange}
|
|
onApplyDefaultBaseNameToAll={onApplyDefaultBaseNameToAll}
|
|
hasImages={hasImages}
|
|
/>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
|
|
<AccordionItem value="quality-settings" className="border rounded-lg bg-card">
|
|
<AccordionTrigger className="p-6 hover:no-underline">
|
|
<div className="text-left">
|
|
<h3 className="text-lg font-medium leading-none">Quality Settings</h3>
|
|
<p className="text-sm text-muted-foreground mt-1">Select format and compression level.</p>
|
|
</div>
|
|
</AccordionTrigger>
|
|
<AccordionContent className="px-6 pb-6">
|
|
<QualitySettings settings={settings} onSettingsChange={onSettingsChange} />
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</Accordion>
|
|
</div>
|
|
);
|
|
} |