import { useState } from "react";
import { useParams } from "react-router-dom";
import Form from "../../components/FormBuilder/FinalForm";
import useLocalStorage from "../../hooks/useLocalStorage";

export default function SurveyAnswers() {
  const { runId, surveyId } = useParams();
  const [resultsSet, setResultsSet] = useLocalStorage(
    `results-${surveyId}-${runId}`,
    {},
  );
  const [answerSetId] = useState(crypto.randomUUID());
  const results = (resultsSet && resultsSet[answerSetId]) || {
    datetime: new Date().toISOString(),
  };

  function setResults(newResults) {
    setResultsSet({ ...resultsSet, [answerSetId]: newResults });
  }

  return (
    <div>
      {runId}
      <Form formId={surveyId} results={results} setResults={setResults} />
    </div>
  );
}