import { BugReport } from "@mui/icons-material";
import { Box, Button, IconButton, TextField, Typography } from "@mui/material";
import { useRouter } from "next/router";
import { useState } from "react";
import { useSettings } from "../contexts/SettingsContext";
import { testing } from "../lib/testing";

export default function Testing() {
  // contexts
  const router = useRouter();
  const { settings, settingsLoading, updateSettings, resetSettings } = useSettings();

  // states
  const [text, setText] = useState("");

  return (
    <Box>
      <IconButton
        onClick={() => {
          router.push("/");
        }}
      >
        <BugReport />
      </IconButton>
      <Button
        onClick={() => {
          resetSettings();
        }}
      >
        reset settings
      </Button>
      <Button onClick={() => {}}>update settings</Button>
      <Button
        onClick={() => {
          console.log(settings);
        }}
      >
        log settings
      </Button>
      <Button
        onClick={() => {
          console.log(testing());
        }}
      >
        testing
      </Button>
      <Typography>{text}</Typography>
      <TextField rows={10} />
    </Box>
  );
}
