fix(logs): 24h-Uhrzeit per Dropdown und konsistentes html lang

Ersetzt natives type=time (AM/PM je nach System) durch Stunde/Minute-Auswahl, wandelt 12h-Werte beim Laden um und stellt html lang auf de/en zurück.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-05-31 11:01:03 +02:00
co-authored by Cursor
parent 658bc6c0c9
commit 34c7d2d65c
6 changed files with 137 additions and 20 deletions
@@ -0,0 +1,58 @@
import { useId, useMemo } from 'react'
import { joinTimeHHMM, splitTimeHHMM } from '../utils/logEntryPayload.js'
const HOURS = Array.from({ length: 24 }, (_, i) => String(i).padStart(2, '0'))
const MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, '0'))
interface EventTimeInput24hProps {
value: string
onChange: (value: string) => void
disabled?: boolean
'aria-label'?: string
}
export default function EventTimeInput24h({
value,
onChange,
disabled = false,
'aria-label': ariaLabel
}: EventTimeInput24hProps) {
const baseId = useId()
const { hours, minutes } = useMemo(() => splitTimeHHMM(value), [value])
return (
<div className="time-input-24h">
<select
id={`${baseId}-hours`}
className="input-text time-input-24h__select"
value={hours}
onChange={(e) => onChange(joinTimeHHMM(e.target.value, minutes))}
disabled={disabled}
aria-label={ariaLabel ? `${ariaLabel} (h)` : undefined}
>
{HOURS.map((hour) => (
<option key={hour} value={hour}>
{hour}
</option>
))}
</select>
<span className="time-input-24h__sep" aria-hidden="true">
:
</span>
<select
id={`${baseId}-minutes`}
className="input-text time-input-24h__select"
value={minutes}
onChange={(e) => onChange(joinTimeHHMM(hours, e.target.value))}
disabled={disabled}
aria-label={ariaLabel ? `${ariaLabel} (min)` : undefined}
>
{MINUTES.map((minute) => (
<option key={minute} value={minute}>
{minute}
</option>
))}
</select>
</div>
)
}
+7 -9
View File
@@ -22,8 +22,8 @@ import {
hasAnySignature
} from '../utils/signatures.js'
import type { SignatureValue } from '../types/signatures.js'
import { buildLogEntryPayload, sortLogEventsByTime, normalizeLogEvent, logEventsEqual, currentLocalTimeHHMM, type LogEventPayload } from '../utils/logEntryPayload.js'
import { resolveIntlLocale } from '../utils/dateTimeFormat.js'
import { buildLogEntryPayload, sortLogEventsByTime, normalizeLogEvent, logEventsEqual, currentLocalTimeHHMM, isValidTimeHHMM, type LogEventPayload } from '../utils/logEntryPayload.js'
import EventTimeInput24h from './EventTimeInput24h.tsx'
import { hashEntryForSigning } from '../utils/entryCanonicalHash.js'
import { signLogEntry } from '../services/entrySigning.js'
import { getLogbookAccess } from '../services/logbookAccess.js'
@@ -927,7 +927,7 @@ export default function LogEntryEditor({
const handleSaveEvent = async (e: React.FormEvent) => {
e.preventDefault()
if (readOnly || !evTime) return
if (readOnly || !isValidTimeHHMM(evTime)) return
const eventData = buildEventFromForm()
const isEdit = editingEventIndex !== null
@@ -1369,13 +1369,11 @@ export default function LogEntryEditor({
<Clock size={12} style={{ display: 'inline', marginRight: 4 }} />
{t('logs.event_time')} *
</label>
<input
type="time"
className="input-text"
lang={resolveIntlLocale(i18n.language)}
<EventTimeInput24h
value={evTime}
onChange={(e) => setEvTime(e.target.value)}
onChange={setEvTime}
disabled={saving}
aria-label={t('logs.event_time')}
/>
</div>
@@ -1613,7 +1611,7 @@ export default function LogEntryEditor({
type="button"
className="btn secondary"
onClick={handleSaveEvent}
disabled={saving || !evTime}
disabled={saving || !isValidTimeHHMM(evTime)}
style={{ width: 'auto', padding: '10px 20px', display: 'flex' }}
>
{editingEventIndex !== null ? <Save size={16} /> : <Plus size={16} />}