Merge pull request #376 from mikefranze/not-another-admin-page-rework

Not another admin page rework
Equal-Vote · Nov 4, 2023 · b8346a8 · b8346a8
2 parents 6b2003c + 72219b7
commit b8346a8
Show file tree

Hide file tree

Showing 26 changed files with 1,968 additions and 843 deletions.
diff --git a/domain_model/Election.ts b/domain_model/Election.ts
@@ -19,21 +19,21 @@ export interface Election {
     races:          Race[]; // one or more race definitions
     settings:       ElectionSettings;
     auth_key?:      string;
-  }
+}
+
 
-
 export function electionValidation(obj:Election): string | null {
   if (!obj){
     return "Election is null";
   }
   const election_id = obj.election_id;
   if (!election_id || typeof election_id !== 'string'){
-      return "Invalid Election ID";
+    return "Invalid Election ID";
   }
   if (typeof obj.title !== 'string'){
-      return "Invalid Title";
+    return "Invalid Title";
   }
-  if (obj.title.length < 3 || obj.title.length > 256){
+  if (obj.state !== 'draft' && (obj.title.length < 3 || obj.title.length > 256)) {
     return "invalid Title length";
   }
   //TODO... etc
@@ -45,7 +45,7 @@ export function removeHiddenFields(obj:Election, electionRoll: ElectionRoll|null
   if (obj.state==='open' && electionRoll?.precinct){
     // If election is open and precinct is defined, remove races that don't include precinct
     obj.races = getApprovedRaces(obj, electionRoll.precinct)
-    
+
   }
 }
 // Where should this belong..

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -31,6 +31,7 @@
     "react-scripts": "^5.0.1",
     "recharts": "^2.6.2",
     "typescript": "^3.9.10",
+    "uuid": "^9.0.1",
     "web-vitals": "^1.1.2"
   },
   "scripts": {

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -5,7 +5,8 @@ import { ThemeProvider } from '@mui/material/styles'
 import Header from './components/Header'
 import Elections from './components/Elections'
 import Login from './components/Login'
-import AddElection from './components/ElectionForm/AddElection'
+import CreateElectionTemplates from './components/ElectionForm/CreateElectionTemplates'
+// import AddElection from './components/ElectionForm/AddElection'
 import Election from './components/Election/Election'
 import DuplicateElection from './components/ElectionForm/DuplicateElection'
 import Sandbox from './components/Sandbox'
@@ -55,7 +56,7 @@ const App = () => {
                 <Route path='/Elections' element={<Elections authSession={authSession} />} />
                 <Route path='/Login' element={<Login />} />
                 <Route path='/Debug' element={<DebugPage authSession={authSession} />} />
-                <Route path='/CreateElection' element={<AddElection authSession={authSession} />} />
+                <Route path='/CreateElection' element={<CreateElectionTemplates authSession={authSession} />} />
                 <Route path='/Election/:id/*' element={<Election authSession={authSession} />} />
                 <Route path='/DuplicateElection/:id' element={<DuplicateElection authSession={authSession} />} />
                 <Route path='/Sandbox' element={<Sandbox />} />

diff --git a/frontend/src/components/Election/Admin/Admin.tsx b/frontend/src/components/Election/Admin/Admin.tsx
@@ -9,7 +9,7 @@ const Admin = ({ authSession, election, permissions, fetchElection }) => {
     return (
         <Container>
             <Routes>
-                <Route path='/' element={<AdminHome election={election} permissions={permissions} fetchElection={fetchElection}/>} />
+                <Route path='/' element={<AdminHome />} />
                 <Route path='/voters' element={<ViewElectionRolls election={election} permissions={permissions} />} />
                 <Route path='/roles' element={<EditRoles election={election} permissions={permissions} fetchElection={fetchElection} />} />
                 <Route path='/ballots' element={<ViewBallots election={election} permissions={permissions} />} />

diff --git a/frontend/src/components/Election/Admin/AdminHome.tsx b/frontend/src/components/Election/Admin/AdminHome.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useContext } from 'react'
 import Grid from "@mui/material/Grid";
 import { Box, Divider, Paper } from "@mui/material";
 import { Typography } from "@mui/material";
@@ -9,17 +9,14 @@ import ShareButton from "../ShareButton";
 import { useArchiveEleciton, useFinalizeEleciton, useSetPublicResults } from "../../../hooks/useAPI";
 import { formatDate } from '../../util';
 import useConfirm from '../../ConfirmationDialogProvider';
+import useElection from '../../ElectionContextProvider';
+import ElectionDetailsInlineForm from '../../ElectionForm/Details/ElectionDetailsInlineForm';
+import Races from '../../ElectionForm/Races/Races';
+import ElectionSettings from '../../ElectionForm/ElectionSettings';
 const hasPermission = (permissions: string[], requiredPermission: string) => {
     return (permissions && permissions.includes(requiredPermission))
 }
 
-
-type Props = {
-    election: Election,
-    permissions: string[],
-    fetchElection: Function,
-}
-
 type SectionProps = {
     Description: any
     Button: any
@@ -359,7 +356,8 @@ const ShareSection = ({ election, permissions }: { election: Election, permissio
     />
 }
 
-const AdminHome = ({ election, permissions, fetchElection }: Props) => {
+const AdminHome = () => {
+    const { election, refreshElection: fetchElection, permissions } = useElection()
     const { makeRequest } = useSetPublicResults(election.election_id)
     const togglePublicResults = async () => {
         const public_results = !election.settings.public_results
@@ -373,7 +371,7 @@ const AdminHome = ({ election, permissions, fetchElection }: Props) => {
 
     const finalizeElection = async () => {
         console.log("finalizing election")
-        const confirmed = await confirm(
+const confirmed = await confirm(
             {
                 title: 'Confirm Finalize Election', 
                 message: "Are you sure you want to finalize your election? Once finalized you won't be able to edit it."
@@ -395,13 +393,13 @@ const AdminHome = ({ election, permissions, fetchElection }: Props) => {
                 message: "Are you sure you wish to archive this election? This action cannot be undone."
             })
         if (!confirmed) return
-        console.log('confirmed')
-        try {
-            await archive()
-            await fetchElection()
-        } catch (err) {
-            console.log(err)
-        }
+            console.log('confirmed')
+            try {
+                await archive()
+                await fetchElection()
+            } catch (err) {
+                console.log(err)
+                    }
     }
 
     return (
@@ -412,36 +410,25 @@ const AdminHome = ({ election, permissions, fetchElection }: Props) => {
             sx={{ width: '100%' }}>
             <Paper elevation={3} sx={{ width: 800, p: 3 }} >
                 <Grid container>
-                    <Grid xs={12}>
-                        <Typography align='center' gutterBottom variant="h4" component="h4">
-                            {election.title}
-                        </Typography>
+                    <Grid xs={12} sx={{ p: 1 }}>
+                        <ElectionDetailsInlineForm />
                     </Grid>
-                    <Grid xs={12}>
-                        <Typography align='center' gutterBottom variant="h5" component="h5">
-                            Admin Page
-                        </Typography>
+                    <Grid xs={12} sx={{ p: 1 }}>
+                        <Races />
+                    </Grid>
+                    <Grid xs={12} sx={{ p: 1 }}>
+                        <ElectionSettings />
                     </Grid>
                     {election.state === 'draft' &&
                         <>
-                            <Grid xs={12}>
-                                <Typography align='center' gutterBottom variant="h6" component="h6">
-                                    Your election is still in the draft phase
-                                </Typography>
-                            </Grid>
-                            <Grid xs={12}>
-                                <Typography align='center' gutterBottom variant="h6" component="h6">
-                                    Before finalizing your election you can...
-                                </Typography>
-                            </Grid>
                             <PreviewBallotSection election={election} permissions={permissions} />
                             <Divider style={{ width: '100%' }} />
                             <AddVotersSection election={election} permissions={permissions} />
                             <Divider style={{ width: '100%' }} />
                             <EditRolesSection election={election} permissions={permissions} />
                             <Divider style={{ width: '100%' }} />
-                            <EditElectionSection election={election} permissions={permissions} />
-                            <Divider style={{ width: '100%' }} />
+                            {/* <EditElectionSection election={election} permissions={permissions} />
+                            <Divider style={{ width: '100%' }} /> */}
                             <DuplicateElectionSection election={election} permissions={permissions} />
                             <Divider style={{ width: '100%' }} />
                             <ArchiveElectionSection election={election} permissions={permissions} archiveElection={archiveElection}/>