diff --git a/frontend/app/main.tsx b/frontend/app/main.tsx
index 8e1bc68ec..9cd082df0 100644
--- a/frontend/app/main.tsx
+++ b/frontend/app/main.tsx
@@ -2,7 +2,7 @@ import { StrictMode } from "react";
import ReactDOM from "react-dom/client";
import { createBrowserRouter, RouterProvider } from "react-router-dom";
-import { ApiProvider, ElectionListProvider, ElectionProvider } from "@kiesraad/api";
+import { ApiProvider, ElectionListProvider } from "@kiesraad/api";
// ignore in prod
import { startMockAPI } from "./msw-mock-api.ts";
@@ -24,9 +24,7 @@ function render() {
-
-
-
+
,
diff --git a/frontend/app/module/ElectionLayout.tsx b/frontend/app/module/ElectionLayout.tsx
new file mode 100644
index 000000000..08762dd18
--- /dev/null
+++ b/frontend/app/module/ElectionLayout.tsx
@@ -0,0 +1,12 @@
+import { Outlet, useParams } from "react-router-dom";
+
+import { ElectionProvider } from "@kiesraad/api";
+
+export function ElectionLayout() {
+ const { electionId } = useParams();
+ return (
+
+
+
+ );
+}
diff --git a/frontend/app/module/input/PollingStation/PollingStationLayout.test.tsx b/frontend/app/module/input/PollingStation/PollingStationLayout.test.tsx
index 6b2fe2a79..fc205101c 100644
--- a/frontend/app/module/input/PollingStation/PollingStationLayout.test.tsx
+++ b/frontend/app/module/input/PollingStation/PollingStationLayout.test.tsx
@@ -10,7 +10,7 @@ describe("PollingStationLayout", () => {
test("Enter form field values", () => {
render(
-
+
,
diff --git a/frontend/app/module/overview/page/OverviewPage.tsx b/frontend/app/module/overview/page/OverviewPage.tsx
index 039f8f03a..6672d0e10 100644
--- a/frontend/app/module/overview/page/OverviewPage.tsx
+++ b/frontend/app/module/overview/page/OverviewPage.tsx
@@ -1,19 +1,17 @@
import { useNavigate } from "react-router-dom";
-import {
- IconCheckHeart,
- IconCheckVerified,
- IconChevronRight,
- IconClock,
- IconHourglass,
-} from "@kiesraad/icon";
+import { Election, useElectionList } from "@kiesraad/api";
+import { IconCheckHeart, IconChevronRight } from "@kiesraad/icon";
import { WorkStationNumber } from "@kiesraad/ui";
export function OverviewPage() {
const navigate = useNavigate();
- const handleRowClick = () => {
- navigate(`/1/input`);
+ const handleRowClick = (election: Election) => {
+ return () => {
+ navigate(`/${election.id}/input`);
+ };
};
+ const { electionList } = useElectionList();
return (
<>
@@ -37,66 +35,29 @@ export function OverviewPage() {
-
- Provinciale Statenverkiezingen 2026 |
- GSB - Juinen (045) |
-
-
-
- Invoer opgeschort
-
- |
-
-
-
-
- |
-
-
- Waterschap Zeegraslanden 2026 |
- |
-
-
-
- Wachten op coördinator
-
- |
-
-
-
-
- |
-
-
- Waterschap De Watervenen 2026 |
- |
-
-
-
- Invoerders bezig
-
- |
-
-
-
-
- |
-
-
- Gemeenteraadsverkiezing 2026 |
- |
-
-
-
- Steminvoer voltooid
-
- |
-
-
-
-
- |
-
+ {electionList.map((election) => (
+
+ {election.name} |
+ |
+
+
+
+ Invoerders bezig
+ {/* TODO
+ Invoer opgeschort
+
+ Wachten op coördinator
+
+ Steminvoer voltooid */}
+
+ |
+
+
+
+
+ |
+
+ ))}
diff --git a/frontend/app/routes.tsx b/frontend/app/routes.tsx
index 6e6f50671..a98d6e270 100644
--- a/frontend/app/routes.tsx
+++ b/frontend/app/routes.tsx
@@ -1,5 +1,6 @@
import { createRoutesFromElements, Route } from "react-router-dom";
+import { ElectionLayout } from "./module/ElectionLayout";
import { HomePage } from "./module/HomePage";
import {
CandidatesVotesPage,
@@ -26,14 +27,16 @@ export const routes = createRoutesFromElements(
}>
} />
- }>
- } />
- }>
- } />
- } />
- } />
- } />
- Placeholder Check and Save Page} />
+ }>
+ }>
+ } />
+ }>
+ } />
+ } />
+ } />
+ } />
+ Placeholder Check and Save Page} />
+
,
diff --git a/frontend/lib/api/election/ElectionProvider.tsx b/frontend/lib/api/election/ElectionProvider.tsx
index c840e6e08..8be17660b 100644
--- a/frontend/lib/api/election/ElectionProvider.tsx
+++ b/frontend/lib/api/election/ElectionProvider.tsx
@@ -2,7 +2,6 @@ import * as React from "react";
import { Election } from "../gen/openapi";
import { useElectionDataRequest } from "../useElectionDataRequest";
-import { useElectionList } from "./useElectionList";
export interface iElectionProviderContext {
election: Required;
@@ -14,13 +13,12 @@ export const ElectionProviderContext = React.createContext