diff --git a/frontend/src/components/ElectionForm/CreateElectionTemplates.tsx b/frontend/src/components/ElectionForm/CreateElectionTemplates.tsx index 7aa45840..1ce4f1f4 100644 --- a/frontend/src/components/ElectionForm/CreateElectionTemplates.tsx +++ b/frontend/src/components/ElectionForm/CreateElectionTemplates.tsx @@ -5,6 +5,7 @@ import { Election } from '../../../../domain_model/Election'; import { usePostElection } from '../../hooks/useAPI'; import { DateTime } from 'luxon' import { Card, CardActionArea, CardMedia, CardContent, Typography, Box, Grid } from '@mui/material'; +import { useLocalStorage } from '../../hooks/useLocalStorage'; @@ -12,6 +13,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) const navigate = useNavigate() const { error, isPending, makeRequest: postElection } = usePostElection() + const [quickPoll, setQuickPoll] = useLocalStorage('QuickPoll', null) const defaultElection: Election = { title: '', @@ -41,6 +43,19 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) election.frontend_url = '' election.owner_id = authSession.getIdField('sub') election.state = 'draft' + if (quickPoll) { + // If quick poll exists grab the title from it, if quick poll not filled in will just be empty string + election.title = quickPoll.title + // Grab candidates from quick poll that have a candidate name filled out + let candidates = quickPoll.races[0].candidates.filter(candidate => candidate.candidate_name.length > 0) + if (candidates.length > 0) { + // Set the race to use the same title as the quick poll so it's easy to identify, add candidates + election.races = quickPoll.races + election.races[0].title = quickPoll.title + election.races[0].candidates = candidates + } + + } const newElection = await postElection( { @@ -49,6 +64,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) if ((!newElection)) { throw Error("Error submitting election"); } + setQuickPoll(null) navigate(`/Election/${newElection.election.election_id}/admin`) } const cardHeight = 220 @@ -85,7 +101,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'open' @@ -106,7 +122,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'open' @@ -127,7 +143,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'registration' @@ -148,7 +164,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'closed' @@ -169,7 +185,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'closed' @@ -190,7 +206,7 @@ const CreateElectionTemplates = ({ authSession }: { authSession: IAuthSession }) - + onAddElection(election => { election.settings.voter_access = 'closed' diff --git a/frontend/src/components/ElectionForm/QuickPoll.tsx b/frontend/src/components/ElectionForm/QuickPoll.tsx index 681e0e3c..6f13e100 100644 --- a/frontend/src/components/ElectionForm/QuickPoll.tsx +++ b/frontend/src/components/ElectionForm/QuickPoll.tsx @@ -11,29 +11,22 @@ import { useLocalStorage } from '../../hooks/useLocalStorage'; import Typography from '@mui/material/Typography'; import { usePostElection } from '../../hooks/useAPI'; import { useCookie } from '../../hooks/useCookie'; +import { Election } from '../../../../domain_model/Election.js'; const QuickPoll = ({ authSession }) => { const [tempID, setTempID] = useCookie('temp_id', '0') const navigate = useNavigate() const { error, isPending, makeRequest: postElection } = usePostElection() - const onSubmitElection = async (election) => { - // calls post election api, throws error if response not ok - const newElection = await postElection( - { - Election: election, - }) - if ((!newElection)) { - throw Error("Error submitting election"); - } - localStorage.removeItem('Election') - navigate(`/Election/${newElection.election.election_id}`) - } - const QuickPollTemplate = { + const QuickPollTemplate: Election = { title: '', election_id: '0', + state: 'open', + frontend_url: '', + owner_id: '0', races: [ - { + { + title: '', race_id: '0', num_winners: 1, voting_method: 'STAR', @@ -67,9 +60,20 @@ const QuickPoll = ({ authSession }) => { } - const [election, setElectionData] = useLocalStorage('Election', QuickPollTemplate) + const [election, setElectionData] = useLocalStorage('QuickPoll', QuickPollTemplate) const [titleError, setTitleError] = useState(false) - + const onSubmitElection = async (election) => { + // calls post election api, throws error if response not ok + const newElection = await postElection( + { + Election: election, + }) + if ((!newElection)) { + throw Error("Error submitting election"); + } + setElectionData(null) + navigate(`/Election/${newElection.election.election_id}`) + } const applyElectionUpdate = (updateFunc) => { const electionCopy = structuredClone(election) updateFunc(electionCopy) diff --git a/frontend/src/hooks/useLocalStorage.ts b/frontend/src/hooks/useLocalStorage.ts index 1bbec455..ce2ccd7a 100644 --- a/frontend/src/hooks/useLocalStorage.ts +++ b/frontend/src/hooks/useLocalStorage.ts @@ -1,25 +1,25 @@ import { useState, useEffect } from "react"; -export const useLocalStorage = (key: string, defaultValue: any, updateRate: number|null = null): [any, (any)=>void] => { +export const useLocalStorage = (key: string, defaultValue: data|null, updateRate: number|null = null): [data|null,(newValue:data|null)=>void] => { // This hook behaves similarly to useState however the state is also stored in local storage // If the value in local storage doesn't exist it is set to defaultValue // The optional input updateRate allows for periodic checking to see if the value in local storage has changed // to allow multiple components using the same key to be updated - const getStoredValue = (key: string, defaultValue: any) => { + const getStoredValue = (key: string, defaultValue: data|null) => { // getting stored value const saved = localStorage.getItem(key); - const initial = JSON.parse(saved); + const initial: data|null = JSON.parse(saved); if (!initial) { localStorage.setItem(key, JSON.stringify(defaultValue)); return defaultValue } return initial; } - const [value, setStoredValue] = useState(() => { + const [value, setStoredValue] = useState(() => { return getStoredValue(key, defaultValue); }); - const setValue = (newValue) => { + const setValue = (newValue: data|null) => { localStorage.setItem(key, JSON.stringify(newValue)); setStoredValue(newValue) }