'use client'
import {useState} from "react";
import SeriesSettingSidebar from "@/components/series/SeriesSettingSidebar";
import SeriesSettingOption from "@/components/series/SeriesSettingOption";
import {SeriesContext} from "@/context/SeriesContext";
import {useTranslations} from "next-intl";
import SettingsPanel from "@/components/SettingsPanel";

interface SeriesSettingProps {
    seriesId: string;
    localSeries: boolean;
    onClose: () => void;
}

export default function SeriesSetting({seriesId, localSeries, onClose}: SeriesSettingProps) {
    const t = useTranslations();
    const [currentSetting, setCurrentSetting] = useState<string>('basic-information');

    return (
        <SeriesContext.Provider value={{seriesId, localSeries}}>
            <SettingsPanel
                title={t("bookList.seriesSettings")}
                sidebar={
                    <SeriesSettingSidebar
                        selectedSetting={currentSetting}
                        setSelectedSetting={setCurrentSetting}
                        seriesId={seriesId}
                        onClose={onClose}
                    />
                }
                onClose={onClose}
            >
                <SeriesSettingOption setting={currentSetting}/>
            </SettingsPanel>
        </SeriesContext.Provider>
    );
}