"use client";

import Button from "@mui/material/Button";
import { alpha, useTheme } from "@mui/material/styles";

import { SlidersHorizontalIcon } from "@/components/dashboard/dashboard-icons";
import { useAppLanguage } from "@/components/providers/app-language-provider";
import {
  normalizePlenaryLanguage,
  plenaryText,
} from "@/features/pswg/plenary/plenary-i18n";

export function PlenaryResetButton({ onClick }: { onClick: () => void }) {
  const theme = useTheme();
  const { language } = useAppLanguage();

  const currentLanguage = normalizePlenaryLanguage(language);
  const text = plenaryText[currentLanguage];

  return (
    <Button
      variant="outlined"
      onClick={onClick}
      endIcon={<SlidersHorizontalIcon sx={{ fontSize: 18 }} />}
      sx={{
        height: 40,
        px: 2,
        minWidth: currentLanguage === "kh" ? 130 : 90,
        borderColor: theme.palette.primary.main,
        color: theme.palette.primary.main,
        backgroundColor: theme.palette.background.paper,
        fontSize: 13,
        fontWeight: 500,
        borderRadius: "10px",
        boxShadow: "none",
        "&:hover": {
          borderColor: theme.palette.primary.main,
          backgroundColor:
            theme.palette.mode === "dark"
              ? alpha(theme.palette.primary.main, 0.1)
              : "#eff8ff",
          boxShadow: "none",
        },
      }}
    >
      {text.reset}
    </Button>
  );
}