myheats

commit 72eb49a426ea1acefad7950e12df7a5bf7f6b2a4
parent dfb15dfde548e5c4c2a69af3e4dbfdf6a81bc2b7
Author: Andreas Gruhler <andreas.gruhler@adfinis.com>
Date:   Thu, 26 Sep 2024 23:40:01 +0200

feat(env): add VITE_LOCALE

Diffstat:
M
.env
 | 
2
++
M
src/frontend/Athletes.jsx
 | 
14
++++++++++----
M
src/frontend/Auth.jsx
 | 
6
+++---
M
src/frontend/Heats.jsx
 | 
12
+++++++++---
M
src/frontend/Leaderboard.jsx
 | 
4
++--
M
src/frontend/Score.jsx
 | 
4
++--
M
src/frontend/Startlist.jsx
 | 
4
++--
M
src/frontend/utils.js
 | 
4
++--

8 files changed, 32 insertions(+), 18 deletions(-)
diff --git a/.env b/.env
@@ -15,6 +15,8 @@ VITE_SESSION_TTL=3600
 VITE_API_URI=http://127.0.0.1
 # Backend API port
 VITE_API_PORT=8000
+# Locale for frontend date formatting
+VITE_LOCALE=en-US
 
 ###########
 # Backend #
diff --git a/src/frontend/Athletes.jsx b/src/frontend/Athletes.jsx
@@ -2,8 +2,9 @@ import { lazy, useEffect, useState } from 'react'
 import { exportAthletesToCSV } from './utils'
 const Auth = lazy(() => import('./Auth'))
 
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
+const locale = import.meta.env.VITE_LOCALE
 
 async function addAthlete(e) {
   e.preventDefault()
@@ -65,6 +66,11 @@ function ExportForm(athletes) {
 function AthleteForm({session}) {
   const [loading, setLoading] = useState(false)
   const [athletes, setAthletes] = useState([])
+  const dateOptions = {
+            year: "numeric",
+            month: "2-digit",
+            day: "2-digit",
+        }
 
   useEffect(() => {
     (async () => {
@@ -99,11 +105,11 @@ function AthleteForm({session}) {
           <tbody>
             {athletes.map(a => (
               <tr key={a.id}>
-                <td data-title='Created at' className='right'>{new Date(a.created_at).toLocaleDateString()}</td>
+                <td data-title='Created at' className='right'>{new Date(a.created_at).toLocaleDateString(locale, dateOptions)}</td>
                 <td data-title='Start Nr.' className='right'>{a.nr}</td>
                 <td data-title='Firstname'>{a.firstname}</td>
                 <td data-title='Lastname'>{a.lastname}</td>
-                <td data-title='Birthday'>{a.birthday}</td>
+                <td data-title='Birthday'>{new Date(a.birthday).toLocaleDateString(locale, dateOptions)}</td>
                 <td data-title='School'>{a.school}</td>
                 <td><button onClick={e => deleteAthlete(e, a.id, a.firstname, a.lastname)}>&ndash; del</button></td>
               </tr>
diff --git a/src/frontend/Auth.jsx b/src/frontend/Auth.jsx
@@ -1,8 +1,8 @@
 import { useState } from 'react'
 
-const session_ttl = import.meta.env.VITE_SESSION_TTL ? import.meta.env.VITE_SESSION_TTL : '3600'
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const session_ttl = import.meta.env.VITE_SESSION_TTL
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
 
 function Auth() {
   const [loading, setLoading] = useState(false)
diff --git a/src/frontend/Heats.jsx b/src/frontend/Heats.jsx
@@ -2,8 +2,9 @@ import { lazy, useEffect, useState } from 'react'
 import { generatePath, Link } from 'react-router-dom'
 import { exportHeatsToCSV } from './utils'
 
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
+const locale = import.meta.env.VITE_LOCALE
 
 const Auth = lazy(() => import('./Auth'))
 
@@ -85,6 +86,11 @@ function ExportForm(heats) {
 function HeatForm({session}) {
   const [loading, setLoading] = useState(false)
   const [heats, setHeats] = useState([])
+  const dateOptions = {
+            year: "numeric",
+            month: "2-digit",
+            day: "2-digit",
+        }
 
   useEffect(() => {
     (async () => {
@@ -116,7 +122,7 @@ function HeatForm({session}) {
           <tbody>
             {heats.map(h => (
               <tr key={h.id}>
-                <td data-title='Created at' className='right'>{new Date(h.created_at).toLocaleDateString()}</td>
+                <td data-title='Created at' className='right'>{new Date(h.created_at).toLocaleDateString(locale, dateOptions)}</td>
                 <td data-title='Name'><Link to={generatePath('/startlist/:heatId', {heatId:h.id})}>{h.name}</Link></td>
                 <td data-title='Location'>{h.location}</td>
                 <td data-title='Planned start' className='right'>{h.planned_start}</td>
diff --git a/src/frontend/Leaderboard.jsx b/src/frontend/Leaderboard.jsx
@@ -3,8 +3,8 @@ import { Fragment, useEffect, useState, useRef } from 'react'
 import Select from 'react-select'
 import { addNewHeat } from './Heats'
 
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
 
 // use a socket for the real-time leaderboard data
 let socket = new WebSocket(`ws://127.0.0.1:${api_port}/v1/leaderboard`);
diff --git a/src/frontend/Score.jsx b/src/frontend/Score.jsx
@@ -3,8 +3,8 @@ import { getStartlistForHeats } from './Leaderboard'
 const Auth = lazy(() => import('./Auth'))
 import Select from 'react-select'
 
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
 
 async function getScore(heatId, athleteId, userId) {
   const res = await fetch(`${api_uri}:${api_port}/v1/leaderboard/getScore`, {
diff --git a/src/frontend/Startlist.jsx b/src/frontend/Startlist.jsx
@@ -4,8 +4,8 @@ const Auth = lazy(() => import('./Auth'))
 import { addAthleteToHeat } from './Leaderboard'
 import Select from 'react-select'
 
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
 
 async function addtoHeat(e, athlete, heatId) {
   e.preventDefault()
diff --git a/src/frontend/utils.js b/src/frontend/utils.js
@@ -1,5 +1,5 @@
-const api_uri = import.meta.env.VITE_API_URI ? import.meta.env.VITE_API_URI: 'http://127.0.0.1'
-const api_port = import.meta.env.VITE_API_PORT ? import.meta.env.VITE_API_PORT: '8000'
+const api_uri = import.meta.env.VITE_API_URI
+const api_port = import.meta.env.VITE_API_PORT
 
 export const exportHeatsToCSV = async function(e, { heats }) {
   e.preventDefault()