Feat: show "Today" divider in comps

src/pages/CalendarPage.tsx

@@ -3,6 +3,8 @@ import {
   Card,
   CardActions,
   CardContent,
+  Chip,
+  Divider,
   Grid,
   Skeleton,
   TextField,
@@ -33,16 +35,18 @@ export default function CalendarPage() {
 
   React.useEffect(() => {
     api.getCompetitions('GER').then(result => {
-      competitions.current = result.competitions.filter(competition =>
+      competitions.current = result.competitions;
-        competition.discipline?.includes('speed'),
+      setFilteredCompetitions(
+        insertTodayIntoCompetitions(filterCompetitions(competitions.current)),
       );
-      setFilteredCompetitions(filterCompetitions(competitions.current));
     });
   }, []);
 
   React.useEffect(() => {
     if (competitions.current.length > 0)
-      setFilteredCompetitions(filterCompetitions(competitions.current));
+      setFilteredCompetitions(
+        insertTodayIntoCompetitions(filterCompetitions(competitions.current)),
+      );
   }, [filter]);
 
   const filterCompetitions = (competitions: Competiton[]) => {
@@ -50,10 +54,49 @@ export default function CalendarPage() {
       const queryMatches = c.name
         .toLowerCase()
         .includes(filter?.toLocaleLowerCase() ?? '');
-      return queryMatches;
+
+      const disciplineMatches = c.discipline?.includes('speed');
+
+      return queryMatches && disciplineMatches;
     });
   };
 
+  const insertTodayIntoCompetitions = (competitions: Competiton[]) => {
+    const today = new Date();
+    const todayString = `${today.getFullYear()}-${
+      today.getMonth() + 1
+    }-${today.getDate()}`;
+
+    const todayCompetition: Competiton = {
+      name: 'Today',
+      date: todayString,
+      discipline: 'speed',
+      WetId: 'today',
+      rkey: '',
+      comp_name: '',
+      date_span: '',
+      cats: [],
+      categorys: [],
+    };
+
+    const index = competitions.findIndex(c => {
+      const compDate = new Date(c.date);
+
+      return (
+        compDate.getMonth() >= today.getMonth() &&
+        compDate.getDate() >= today.getDate()
+      );
+    });
+
+    if (index === -1) competitions.push(todayCompetition);
+    else competitions.splice(index, 0, todayCompetition);
+
+    console.log(competitions);
+    console.log(index);
+
+    return competitions;
+  };
+
   const openCompetition = (competitionId: string, categoryId: string) => {
     navigate(`/speed-flowchart/${competitionId}/${categoryId}`);
   };
@@ -69,7 +112,14 @@ export default function CalendarPage() {
             fullWidth
           />
         </Grid>
-        {filteredCompetitions?.map(competition => (
+        {filteredCompetitions?.map(competition =>
+          competition.WetId === 'today' ? (
+            <Grid item xs={12}>
+              <Divider>
+                <Chip label='Today' />
+              </Divider>
+            </Grid>
+          ) : (
             <Grid item key={`competition-card-${competition.WetId}`}>
               <Card>
                 <CardContent>
@@ -104,7 +154,8 @@ export default function CalendarPage() {
                 </CardActions>
               </Card>
             </Grid>
-        ))}
+          ),
+        )}
         {filteredCompetitions === undefined && (
           <Grid item xs={12}>
             <Card>