import { Switch } from "@/components/ui/switch";
import { useSetting } from "@/hooks/useSettings";
import { IS_PRO } from "@/lib/env";
import SettingRow from "./SettingRow";

/**
 * On/off setting bound to a dot path in `pcfw_settings` (or `pcfw_design`
 * with `source="design"`).
 */
const SwitchSetting = ({
  path,
  title,
  description,
  pro = false,
  source = "settings",
}) => {
  const [checked, setChecked] = useSetting(path, false, source);
  const locked = pro && !IS_PRO;
  const id = `pcfw-${source}-${path.replace(/\./g, "-")}`;

  return (
    <SettingRow
      id={id}
      title={title}
      description={description}
      pro={pro}
      locked={locked}
    >
      <Switch
        aria-labelledby={id}
        checked={Boolean(checked) && !locked}
        disabled={locked}
        onCheckedChange={(next) => setChecked(next)}
      />
    </SettingRow>
  );
};

export default SwitchSetting;