import {Button, Flex, Switch, Text} from "@chakra-ui/react";
import {useDashboardStore} from "../../../store/useDashboardStore.jsx";

export default function IvansAlertsSettings({ widgetId, currentSettings }) {
  const updateSettings = useDashboardStore(state => state.updateWidgetSettings);

  const handleCopyToClipboard = () => {
    updateSettings(widgetId, {copyToClipboard: true});
  }
  const handleVolcanoSort = (details) => {
    const isSort = currentSettings?.activeSorts?.volcanoSort === true;
    updateSettings(widgetId, { activeSorts: { ...currentSettings?.activeSorts, volcanoSort: !isSort }});
  }
  const handleTimeSort = (details) => {
    const sort = currentSettings?.activeSorts?.timeSort === "desc" ? "asc" : "desc";
    updateSettings(widgetId, { activeSorts: { ...currentSettings?.activeSorts, timeSort: sort }});
  }

  return (
    <Flex flexDirection="column" justifyContent="space-between" gap={2}>
      <Button onClick={handleCopyToClipboard}>Copy All IVANS</Button>
      <Switch.Root
        checked={currentSettings?.activeSorts?.timeSort === "asc"}
        onCheckedChange={handleTimeSort}
        colorPalette="blue"
      >
        <Switch.HiddenInput />
        <Switch.Control>
          <Switch.Thumb />
        </Switch.Control>
        <Switch.Label>Sort Oldest to Newest</Switch.Label>
      </Switch.Root>
      <Switch.Root
        checked={currentSettings?.activeSorts?.volcanoSort}
        onCheckedChange={handleVolcanoSort}
        colorPalette="blue"
      >
        <Switch.HiddenInput />
        <Switch.Control>
          <Switch.Thumb />
        </Switch.Control>
        <Switch.Label>Sort by Volcano</Switch.Label>
      </Switch.Root>
    </Flex>
  )
}