aboutsummaryrefslogtreecommitdiffstats
path: root/src/pages
diff options
context:
space:
mode:
authordan <[email protected]>2024-01-03 18:36:53 -0500
committerdan <[email protected]>2024-01-03 18:36:53 -0500
commit98be17522ef0474a40b134a3ca4e0d2e8096d469 (patch)
tree9ae3b31c03aa2b3cbd8c2f6942445a1c5a439a4e /src/pages
parent3baf3c177f86dcc01ce49e14daec7c5c895eefe6 (diff)
downloaddraggable-form-demo-master.tar.gz
draggable-form-demo-master.tar.bz2
draggable-form-demo-master.zip
feat: stuff changedHEADmaster
Diffstat (limited to 'src/pages')
-rw-r--r--src/pages/NewSurvey/index.js5
-rw-r--r--src/pages/Survey/index.js7
-rw-r--r--src/pages/SurveyAnswer/index.js27
-rw-r--r--src/pages/SurveyResults/index.js58
-rw-r--r--src/pages/Surveys/SurveysList.js36
5 files changed, 117 insertions, 16 deletions
diff --git a/src/pages/NewSurvey/index.js b/src/pages/NewSurvey/index.js
index f1d4b89..335eb93 100644
--- a/src/pages/NewSurvey/index.js
+++ b/src/pages/NewSurvey/index.js
@@ -1,4 +1,5 @@
-import FormBuilder from "../../components/FormBuilder";
+import { Navigate } from "react-router-dom";
export default function NewSurvey() {
- return <FormBuilder />;
+ const id = crypto.randomUUID();
+ return <Navigate to={{ pathname: `/surveys/${id}` }} />;
}
diff --git a/src/pages/Survey/index.js b/src/pages/Survey/index.js
new file mode 100644
index 0000000..41bac5e
--- /dev/null
+++ b/src/pages/Survey/index.js
@@ -0,0 +1,7 @@
+import FormBuilder from "../../components/FormBuilder";
+import { useParams } from "react-router-dom";
+
+export default function Survey() {
+ const { formId } = useParams();
+ return <FormBuilder formId={formId} />;
+}
diff --git a/src/pages/SurveyAnswer/index.js b/src/pages/SurveyAnswer/index.js
new file mode 100644
index 0000000..d1676c1
--- /dev/null
+++ b/src/pages/SurveyAnswer/index.js
@@ -0,0 +1,27 @@
+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>
+ );
+}
diff --git a/src/pages/SurveyResults/index.js b/src/pages/SurveyResults/index.js
index 82d41c6..dec182e 100644
--- a/src/pages/SurveyResults/index.js
+++ b/src/pages/SurveyResults/index.js
@@ -1,3 +1,59 @@
+import { Button } from "@mui/material";
+import { DataGrid } from "@mui/x-data-grid";
+import { Link, useParams } from "react-router-dom";
+import useLocalStorage from "../../hooks/useLocalStorage";
+import useForm from "../../hooks/useForm";
+
export default function SurveyResults() {
- return <>SurveyResults</>;
+ const { surveyId } = useParams();
+ const [runs, setRuns] = useLocalStorage(`runs-${surveyId}`, []);
+ const [form] = useForm(surveyId);
+
+ const columns = form?.fields?.map(({ id, name }) => ({
+ field: id,
+ headerName: name,
+ }));
+
+ return (
+ <>
+ <h3>SurveyRuns</h3>
+ {surveyId}
+ <Button onClick={() => setRuns([{ id: crypto.randomUUID() }, ...runs])}>
+ New Run
+ </Button>
+
+ {runs &&
+ runs.map((r) => {
+ const runRs = runResults(surveyId, r.id);
+
+ console.log(runRs);
+
+ return (
+ <div key={r.id}>
+ <Link to={`${r.id}/answer`}>Add Answer</Link> {JSON.stringify(r)}
+ Total Results: {Object.keys(runRs).length}
+ <DataGrid
+ rows={[]}
+ columns={columns}
+ initialState={{
+ pagination: {
+ paginationModel: {
+ pageSize: 25,
+ },
+ },
+ }}
+ pageSizeOptions={[25, 50, 100]}
+ checkboxSelection
+ disableRowSelectionOnClick
+ />
+ </div>
+ );
+ })}
+ </>
+ );
+}
+
+function runResults(surveyId, runId) {
+ const str = localStorage[`results-${surveyId}-${runId}`];
+ return !str ? {} : JSON.parse(str);
}
diff --git a/src/pages/Surveys/SurveysList.js b/src/pages/Surveys/SurveysList.js
index c9c5b90..a320716 100644
--- a/src/pages/Surveys/SurveysList.js
+++ b/src/pages/Surveys/SurveysList.js
@@ -1,9 +1,10 @@
import React from "react";
import Box from "@mui/material/Box";
import { DataGrid } from "@mui/x-data-grid";
+import useLocalStorage from "../../hooks/useLocalStorage";
+import { Link } from "react-router-dom";
const columns = [
- { field: "id", headerName: "ID", width: 90 },
{
field: "name",
headerName: "Name",
@@ -14,21 +15,30 @@ const columns = [
headerName: "Next Run",
width: 150,
},
-];
-
-const rows = [
- { id: 1, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 2, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 3, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 4, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 5, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 6, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 7, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 8, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
- { id: 9, name: "survey", next_run_at: "Mon 28 Aug 16:35:36 EDT 2023" },
+ {
+ field: "edit_survey_link",
+ headerName: "",
+ renderCell: ({ row }) => <Link to={`${row?.path}`}>Edit</Link>,
+ width: 150,
+ },
+ {
+ field: "results_survey_link",
+ headerName: "",
+ renderCell: ({ row }) => <Link to={`${row?.path}/results`}>Results</Link>,
+ width: 150,
+ },
];
export default function SurveysList() {
+ const [forms] = useLocalStorage(`forms`, {});
+
+ const rows = Object.keys(forms).map((id, i) => ({
+ id,
+ name: `Survey ${i}`,
+ next_run_at: "Mon 28 Aug 16:35:36 EDT 2023",
+ path: `/surveys/${id}`,
+ }));
+
return (
<Box sx={{ minHeight: "100%", width: "100%" }}>
<DataGrid