- {/* Section Préférences d'affichage */}
-
-
-
-
- {t("settings.display.title")}
-
-
- {t("settings.display.description")}
-
-
-
-
-
-
-
-
- {t("settings.display.thumbnails.description")}
-
-
-
-
-
-
-
-
- {t("settings.display.unreadFilter.description")}
-
-
-
{
- try {
- await updatePreferences({ showOnlyUnread: checked });
- toast({
- title: t("settings.title"),
- description: t("settings.komga.messages.configSaved"),
- });
- } catch (error) {
- console.error("Erreur détaillée:", error);
- toast({
- variant: "destructive",
- title: "Erreur",
- description:
- error instanceof Error
- ? error.message
- : "Une erreur est survenue lors de la mise à jour des préférences",
- });
- }
- }}
- />
-
-
-
-
-
- {t("settings.display.debugMode.description")}
-
-
-
{
- try {
- await updatePreferences({ debug: checked });
- toast({
- title: t("settings.title"),
- description: t("settings.komga.messages.configSaved"),
- });
- } catch (error) {
- console.error("Erreur détaillée:", error);
- toast({
- variant: "destructive",
- title: "Erreur",
- description:
- error instanceof Error
- ? error.message
- : "Une erreur est survenue lors de la mise à jour des préférences",
- });
- }
- }}
- />
-
-
-
-
-
- {/* Section Configuration Komga */}
-
-
-
-
-
- {t("settings.komga.title")}
-
-
- {t("settings.komga.description")}
-
-
-
- {!shouldShowForm ? (
-
-
-
-
-
{config.serverUrl}
-
-
-
-
{config.username}
-
-
-
-
••••••••
-
-
-
-
- ) : (
-
- )}
-
-
-
- {/* Section Configuration du Cache */}
-
-
-
-
-
- {t("settings.cache.title")}
-
-
- {t("settings.cache.description")}
-
-
-
-
-
-
-
- {t("settings.cache.mode.description")}
-
-
-
-
-
- {/* Formulaire TTL */}
-
-
-
+
+
{t("settings.title")}
+
+
+
+
);
diff --git a/src/components/settings/DisplaySettings.tsx b/src/components/settings/DisplaySettings.tsx
new file mode 100644
index 0000000..53a3ae6
--- /dev/null
+++ b/src/components/settings/DisplaySettings.tsx
@@ -0,0 +1,113 @@
+import { useTranslate } from "@/hooks/useTranslate";
+import { usePreferences } from "@/contexts/PreferencesContext";
+import { Switch } from "@/components/ui/switch";
+import { Label } from "@/components/ui/label";
+import { useToast } from "@/components/ui/use-toast";
+
+export function DisplaySettings() {
+ const { t } = useTranslate();
+ const { toast } = useToast();
+ const { preferences, updatePreferences } = usePreferences();
+
+ const handleToggleThumbnails = async (checked: boolean) => {
+ try {
+ await updatePreferences({ showThumbnails: checked });
+ toast({
+ title: t("settings.title"),
+ description: t("settings.komga.messages.configSaved"),
+ });
+ } catch (error) {
+ console.error("Erreur détaillée:", error);
+ toast({
+ variant: "destructive",
+ title: t("settings.error.title"),
+ description: t("settings.error.message"),
+ });
+ }
+ };
+
+ return (
+
+
+
+
+ {t("settings.display.title")}
+
+
{t("settings.display.description")}
+
+
+
+
+
+
+
+ {t("settings.display.thumbnails.description")}
+
+
+
+
+
+
+
+
+ {t("settings.display.unreadFilter.description")}
+
+
+
{
+ try {
+ await updatePreferences({ showOnlyUnread: checked });
+ toast({
+ title: t("settings.title"),
+ description: t("settings.komga.messages.configSaved"),
+ });
+ } catch (error) {
+ console.error("Erreur détaillée:", error);
+ toast({
+ variant: "destructive",
+ title: t("settings.error.title"),
+ description: t("settings.error.message"),
+ });
+ }
+ }}
+ />
+
+
+
+
+
+ {t("settings.display.debugMode.description")}
+
+
+
{
+ try {
+ await updatePreferences({ debug: checked });
+ toast({
+ title: t("settings.title"),
+ description: t("settings.komga.messages.configSaved"),
+ });
+ } catch (error) {
+ console.error("Erreur détaillée:", error);
+ toast({
+ variant: "destructive",
+ title: t("settings.error.title"),
+ description: t("settings.error.message"),
+ });
+ }
+ }}
+ />
+
+
+
+
+ );
+}
diff --git a/src/components/settings/KomgaSettings.tsx b/src/components/settings/KomgaSettings.tsx
new file mode 100644
index 0000000..4453ded
--- /dev/null
+++ b/src/components/settings/KomgaSettings.tsx
@@ -0,0 +1,280 @@
+"use client";
+
+import { useState } from "react";
+import { useTranslate } from "@/hooks/useTranslate";
+import { useToast } from "@/components/ui/use-toast";
+import { Network, Loader2 } from "lucide-react";
+import { KomgaConfig } from "@/types/komga";
+
+interface KomgaSettingsProps {
+ initialConfig: KomgaConfig | null;
+}
+
+export function KomgaSettings({ initialConfig }: KomgaSettingsProps) {
+ const { t } = useTranslate();
+ const { toast } = useToast();
+ const [isLoading, setIsLoading] = useState(false);
+ const [isSaving, setIsSaving] = useState(false);
+ const [config, setConfig] = useState({
+ serverUrl: initialConfig?.url || "",
+ username: initialConfig?.username || "",
+ password: initialConfig?.password || "",
+ authHeader: initialConfig?.authHeader || "",
+ });
+ const [isEditingConfig, setIsEditingConfig] = useState(false);
+ const [localInitialConfig, setLocalInitialConfig] = useState(initialConfig);
+
+ const hasToShowEditForm =
+ localInitialConfig && config.serverUrl !== null && config.username !== null;
+ const shouldShowForm = !hasToShowEditForm || isEditingConfig;
+
+ const handleTest = async () => {
+ setIsLoading(true);
+
+ const form = document.querySelector("form") as HTMLFormElement;
+ const formData = new FormData(form);
+ const serverUrl = formData.get("serverUrl") as string;
+ const username = formData.get("username") as string;
+ const password = formData.get("password") as string;
+
+ try {
+ const response = await fetch("/api/komga/test", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ serverUrl: serverUrl.trim(),
+ username,
+ password: password || config.password,
+ }),
+ });
+
+ if (!response.ok) {
+ const data = await response.json();
+ throw new Error(data.error || t("settings.komga.error.message"));
+ }
+
+ toast({
+ title: t("settings.komga.title"),
+ description: t("settings.komga.messages.connectionSuccess"),
+ });
+ } catch (error) {
+ console.error("Erreur:", error);
+ toast({
+ variant: "destructive",
+ title: t("settings.komga.error.title"),
+ description: t("settings.komga.error.message"),
+ });
+ } finally {
+ setIsLoading(false);
+ }
+ };
+
+ const handleSave = async (event: React.FormEvent
) => {
+ event.preventDefault();
+ setIsSaving(true);
+
+ const formData = new FormData(event.currentTarget);
+ const serverUrl = formData.get("serverUrl") as string;
+ const username = formData.get("username") as string;
+ const password = formData.get("password") as string;
+
+ const newConfig = {
+ serverUrl: serverUrl.trim(),
+ username,
+ password,
+ authHeader: config.authHeader,
+ };
+
+ try {
+ const response = await fetch("/api/komga/config", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ url: newConfig.serverUrl,
+ username: newConfig.username,
+ password: newConfig.password,
+ }),
+ });
+
+ if (!response.ok) {
+ const data = await response.json();
+ throw new Error(data.error || t("settings.komga.error.message"));
+ }
+
+ const savedConfig = await response.json();
+
+ setConfig(newConfig);
+ setLocalInitialConfig({
+ url: newConfig.serverUrl,
+ username: newConfig.username,
+ userId: savedConfig.userId,
+ authHeader: savedConfig.authHeader,
+ });
+ setIsEditingConfig(false);
+
+ toast({
+ title: t("settings.komga.title"),
+ description: t("settings.komga.messages.configSaved"),
+ });
+
+ // Forcer un rechargement complet de la page
+ window.location.reload();
+ } catch (error) {
+ console.error("Erreur lors de la sauvegarde:", error);
+ toast({
+ variant: "destructive",
+ title: t("settings.komga.error.title"),
+ description: t("settings.komga.error.message"),
+ });
+ } finally {
+ setIsSaving(false);
+ }
+ };
+
+ const handleInputChange = (event: React.ChangeEvent) => {
+ const { name, value } = event.target;
+ setConfig((prev) => ({
+ ...prev,
+ [name]: value,
+ }));
+ };
+
+ return (
+
+
+
+
+
+ {t("settings.komga.title")}
+
+
{t("settings.komga.description")}
+
+
+ {!shouldShowForm ? (
+
+
+
+
+
{config.serverUrl}
+
+
+
+
{config.username}
+
+
+
+
••••••••
+
+
+
+
+ ) : (
+
+ )}
+
+