import { Route, Routes, useLocation } from "react-router-dom";
import { TemplateSettingValueList } from "./TemplateSettingValueList";
import { TemplateSettingValueForm } from "./TemplateSettingValueForm";
import { useTranslation } from "react-i18next";

export const TemplateSettingValuePage = () => {
  const location = useLocation();
  const { t } = useTranslation();

  const isFormPage =
    location.pathname.includes("/new") || location.pathname.includes("/edit");

  return (
    <div className="space-y-6">
      {/* Breadcrumb */}
      <div className="flex items-center gap-2 text-sm text-gray-500">
        <span>{t("webManagement", "Web Management")}</span>
        <span>/</span>
        <span className="text-gray-900 font-medium">
          {t("templateSettingValue.title", "Template Setting Values")}
        </span>
      </div>

      {/* Routes */}
      <Routes>
        <Route path="/" element={<TemplateSettingValueList />} />
        <Route path="/values" element={<TemplateSettingValueList />} />
        <Route path="/new" element={<TemplateSettingValueForm />} />
        <Route path="/edit/:id" element={<TemplateSettingValueForm />} />
      </Routes>
    </div>
  );
};
