diff --git a/public/favicon.ico b/public/favicon.ico
index a11777c..8b0d2bd 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/public/index.html b/public/index.html
index aa069f2..0c1ccd1 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,7 +7,7 @@
- React App
+ blueROCK speed-flowchart
diff --git a/public/logo192.png b/public/logo192.png
index fc44b0a..01d12ee 100644
Binary files a/public/logo192.png and b/public/logo192.png differ
diff --git a/public/logo512.png b/public/logo512.png
index a4e47a6..92be649 100644
Binary files a/public/logo512.png and b/public/logo512.png differ
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
new file mode 100644
index 0000000..fa67c9a
--- /dev/null
+++ b/src/components/Header.tsx
@@ -0,0 +1,35 @@
+import {
+ AppBar,
+ Toolbar,
+ Stepper,
+ Step,
+ Box,
+ Container,
+ StepButton,
+ Typography,
+} from '@mui/material';
+import { useContext, useEffect, useState } from 'react';
+import { Link, useLocation, useNavigate } from 'react-router-dom';
+
+import '../css/Header.css';
+import { Context } from '../data/Context';
+
+/**
+ * Creates a Header Component that displays the reservation steps
+ * @return {JSX.Element}
+ */
+export default function Header() {
+ const { title } = useContext(Context);
+ return (
+
+
+
+
+ 
+
+ {title}
+
+
+
+ );
+}
diff --git a/src/css/Header.css b/src/css/Header.css
new file mode 100644
index 0000000..72b4d8e
--- /dev/null
+++ b/src/css/Header.css
@@ -0,0 +1,9 @@
+.header-container {
+ gap: 40px;
+ flex-direction: row;
+}
+
+.header-icon {
+ height: 50px;
+ display: block;
+}
diff --git a/src/data/Context.tsx b/src/data/Context.tsx
index 287b7bc..b48d7ad 100644
--- a/src/data/Context.tsx
+++ b/src/data/Context.tsx
@@ -7,6 +7,14 @@ import { DigitalrockAPi } from './DigitalrockApi';
*/
export const Context = createContext<{
api: DigitalrockAPi;
+
+ title: string;
+ setTitle: (title: string) => void;
}>({
api: new DigitalrockAPi(),
+
+ title: '',
+ setTitle: () => {
+ return;
+ },
});
diff --git a/src/models/Competition.tsx b/src/models/Competition.tsx
index e89f098..b39cc8c 100644
--- a/src/models/Competition.tsx
+++ b/src/models/Competition.tsx
@@ -5,9 +5,12 @@ export interface Competiton {
WetId: string;
rkey: string;
name: string;
+ comp_name: string;
date_span: string;
discipline?: string;
cats: Category[];
+ categorys: Category[];
+ date: string;
}
export interface RouteNames {
diff --git a/src/pages/CalendarPage.tsx b/src/pages/CalendarPage.tsx
index 18127b3..26e7183 100644
--- a/src/pages/CalendarPage.tsx
+++ b/src/pages/CalendarPage.tsx
@@ -23,9 +23,13 @@ export default function CalendarPage() {
React.useState();
const [filter, setFilter] = React.useState();
- const { api } = React.useContext(Context);
+ const { api, setTitle } = React.useContext(Context);
const navigate = useNavigate();
+ React.useEffect(() => {
+ setTitle('DAV calendar');
+ }, []);
+
React.useEffect(() => {
api.getCompetitions('GER').then(result => {
console.log(result.competitions.filter);
@@ -42,9 +46,14 @@ export default function CalendarPage() {
}, [filter]);
const filterCompetitions = (competitions: Competiton[]) => {
- return competitions.filter(c =>
- c.name.toLowerCase().includes(filter?.toLocaleLowerCase() ?? ''),
- );
+ return competitions.filter(c => {
+ const queryMatches = c.name
+ .toLowerCase()
+ .includes(filter?.toLocaleLowerCase() ?? '');
+ const date = new Date(c.date).getTime();
+ const currentDate = new Date().getTime();
+ return queryMatches && currentDate - date > 24 * 60 * 60 * 1000;
+ });
};
const openCompetition = (competitionId: string, categoryId: string) => {
diff --git a/src/pages/SpeedFlowchartPage.tsx b/src/pages/SpeedFlowchartPage.tsx
index 3ba421c..84e9d65 100644
--- a/src/pages/SpeedFlowchartPage.tsx
+++ b/src/pages/SpeedFlowchartPage.tsx
@@ -13,7 +13,7 @@ import { Card, CardContent, Grid, Typography } from '@mui/material';
*/
export default function SpeedFlowchartPage() {
const { competitionId, categoryId } = useParams();
- const { api } = useContext(Context);
+ const { api, setTitle } = useContext(Context);
const [flowchartResult, setFlowchartResult] =
useState();
@@ -24,6 +24,11 @@ export default function SpeedFlowchartPage() {
}
api.getCompetitionResults(competitionId, categoryId).then(r => {
+ setTitle(
+ `${r.comp_name} - ${
+ r.categorys.filter(cat => cat.GrpId === categoryId)[0].name
+ }`,
+ );
const flowchartResult = convertResultsToSpeedFlowchartResult(r);
console.log(flowchartResult);
setFlowchartResult(flowchartResult);
@@ -32,7 +37,6 @@ export default function SpeedFlowchartPage() {
return (
<>
- RESULT:
{flowchartResult?.rounds.map((round, roundKey) => (
diff --git a/src/utils/ContextWrapper.tsx b/src/utils/ContextWrapper.tsx
index b76f74b..fa096f6 100644
--- a/src/utils/ContextWrapper.tsx
+++ b/src/utils/ContextWrapper.tsx
@@ -1,3 +1,4 @@
+import React from 'react';
import { Context } from '../data/Context';
import { DigitalrockAPi } from '../data/DigitalrockApi';
@@ -10,6 +11,11 @@ export default function ContextWrapper(props: { children: JSX.Element }) {
const { children } = props;
const api = new DigitalrockAPi();
+ const [title, setTitle] = React.useState('');
- return {children};
+ return (
+
+ {children}
+
+ );
}
diff --git a/src/utils/PageTemplate.tsx b/src/utils/PageTemplate.tsx
index f5b0bc7..51d430c 100644
--- a/src/utils/PageTemplate.tsx
+++ b/src/utils/PageTemplate.tsx
@@ -11,16 +11,14 @@ export default function PageTemplate(props: { children: JSX.Element }) {
const { children } = props;
return (
-
-
-
- {children}
-
-
-
+
+
+ {children}
+
+
);
}
diff --git a/src/utils/Routing.tsx b/src/utils/Routing.tsx
index d92e773..7ba9ece 100644
--- a/src/utils/Routing.tsx
+++ b/src/utils/Routing.tsx
@@ -1,6 +1,8 @@
import { Routes, Route, HashRouter } from 'react-router-dom';
+import Header from '../components/Header';
import CalendarPage from '../pages/CalendarPage';
import SpeedFlowchartPage from '../pages/SpeedFlowchartPage';
+import ContextWrapper from './ContextWrapper';
import PageTemplate from './PageTemplate';
/**
@@ -10,15 +12,20 @@ import PageTemplate from './PageTemplate';
export default function Routing() {
return (
-
-
- } />
- }
- >
-
-
+
+ <>
+
+
+
+ } />
+ }
+ >
+
+
+
+
);
}