fix(logs): Kompass-Dial-Locales und UI-Labels vervollständigen

Ergänzt fehlende i18n-Keys (Himmelsrichtungen, Platzhalter, Schrittweite) und zeigt Validierungsfehler im Kurs-Dial.

Co-authored-by: Cursor <cursoragent@cursor.com>

client/src/App.css

@@ -287,6 +287,14 @@ select.input-text {
   line-height: 1.4;
 }
 
+.course-dial__error {
+  margin: 0;
+  width: 100%;
+  font-size: 12px;
+  color: #f87171;
+  text-align: center;
+}
+
 .course-dial__input {
   width: 100%;
   text-align: center;

client/src/components/CourseDialInput.tsx

@@ -55,6 +55,7 @@ export default function CourseDialInput({
   const svgRef = useRef<SVGSVGElement>(null)
   const [step, setStep] = useState<CourseStep>(() => stepProp ?? loadCourseDialStep())
   const [inputDraft, setInputDraft] = useState<string | null>(null)
+  const [inputError, setInputError] = useState<string | null>(null)
   const [outputModeOverride, setOutputModeOverride] = useState<CourseOutputMode | null>(null)
 
   const effectiveStep = stepProp ?? step
@@ -72,10 +73,22 @@ export default function CourseDialInput({
     [value, allowCardinal]
   )
 
+  const tickLabel = useCallback(
+    (degrees: number) => {
+      if (degrees === 0) return t('logs.compass_n')
+      if (degrees === 90) return t('logs.compass_e')
+      if (degrees === 180) return t('logs.compass_s')
+      if (degrees === 270) return t('logs.compass_w')
+      return String(degrees).padStart(3, '0')
+    },
+    [t]
+  )
+
   const applyDegrees = useCallback(
     (degrees: number) => {
       onChange(dialDegreesToStorageValue(degrees, outputMode, effectiveStep))
       setInputDraft(null)
+      setInputError(null)
     },
     [onChange, outputMode, effectiveStep]
   )
@@ -120,15 +133,21 @@ export default function CourseDialInput({
     setInputDraft(null)
     if (!draft) {
       onChange('')
+      setInputError(null)
       return
     }
     if (allowCardinal && outputMode === 'cardinal' && isCardinalDirection(draft)) {
       onChange(draft.toUpperCase())
+      setInputError(null)
       return
     }
     const parsed = parseCourseAngle(draft)
-    if (parsed === null) return
+    if (parsed === null) {
+      setInputError(t('logs.course_invalid'))
+      return
+    }
     onChange(formatCourseAngle(snapDegrees(parsed, effectiveStep)))
+    setInputError(null)
   }
 
   const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
@@ -170,7 +189,7 @@ export default function CourseDialInput({
       className={`course-dial course-dial--${size}${disabled ? ' course-dial--disabled' : ''}`}
     >
       {!stepProp && (
-        <div className="course-dial__step-toolbar" role="group" aria-label={ariaLabel}>
+        <div className="course-dial__step-toolbar" role="group" aria-label={t('logs.course_dial_step_label')}>
           {([1, 5, 10] as const).map((s) => (
             <button
               key={s}
@@ -213,7 +232,7 @@ export default function CourseDialInput({
               <g key={deg}>
                 <line className="course-dial__tick" x1={inner.x} y1={inner.y} x2={outer.x} y2={outer.y} />
                 <text className="course-dial__label" x={label.x} y={label.y} textAnchor="middle" dominantBaseline="middle">
-                  {String(deg).padStart(3, '0')}
+                  {tickLabel(deg)}
                 </text>
               </g>
             )
@@ -240,10 +259,17 @@ export default function CourseDialInput({
         onBlur={commitInput}
         onKeyDown={handleInputKeyDown}
         disabled={disabled}
-        placeholder={outputMode === 'cardinal' ? 'NW' : '180'}
+        placeholder={
+          outputMode === 'cardinal'
+            ? t('logs.course_placeholder_cardinal')
+            : t('logs.course_placeholder_degrees')
+        }
         aria-label={ariaLabel}
+        aria-invalid={inputError ? true : undefined}
       />
 
+      {inputError && <p className="course-dial__error">{inputError}</p>}
+
       {allowCardinal && displayMode === 'auto' && (
         <button
           type="button"

client/src/i18n/locales/de.json

@@ -191,13 +191,20 @@
       "event_mgk": "MgK Kurs",
       "event_rwk": "RwK Kurs",
       "event_course_section": "Kurs",
-      "course_dial_hint": "Am Ring drehen oder Wert eingeben",
+      "course_dial_hint": "Am Ring drehen oder Grad eingeben",
+      "course_dial_step_label": "Schrittweite",
       "course_step_fine": "1°",
       "course_step_medium": "5°",
       "course_step_coarse": "10°",
       "course_tab_mgk": "MgK",
       "course_tab_rwk": "rwK",
       "course_invalid": "Ungültiger Kurs (0–360)",
+      "course_placeholder_degrees": "z. B. 180",
+      "course_placeholder_cardinal": "z. B. NW",
+      "compass_n": "N",
+      "compass_e": "O",
+      "compass_s": "S",
+      "compass_w": "W",
       "wind_mode_cardinal": "Kardinal",
       "wind_mode_degrees": "Als Grad",
       "event_wind_direction": "Wind-Richtung",

client/src/i18n/locales/en.json

@@ -191,13 +191,20 @@
       "event_mgk": "MgK Course",
       "event_rwk": "RwK Course",
       "event_course_section": "Course",
-      "course_dial_hint": "Drag the ring or enter a value",
+      "course_dial_hint": "Drag the ring or enter degrees",
+      "course_dial_step_label": "Step size",
       "course_step_fine": "1°",
       "course_step_medium": "5°",
       "course_step_coarse": "10°",
       "course_tab_mgk": "MgK",
       "course_tab_rwk": "rwK",
       "course_invalid": "Invalid course (0–360)",
+      "course_placeholder_degrees": "e.g. 180",
+      "course_placeholder_cardinal": "e.g. NW",
+      "compass_n": "N",
+      "compass_e": "E",
+      "compass_s": "S",
+      "compass_w": "W",
       "wind_mode_cardinal": "Cardinal",
       "wind_mode_degrees": "As degrees",
       "event_wind_direction": "Wind Dir",