refactor(frontend): migrate TrainingTypesCard.tsx to the banner system

This commit is contained in:
2026-07-27 10:01:56 +02:00
parent 687dc2bca2
commit 7e960e3ce1

View File

@@ -1,5 +1,6 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { api } from "../api/client"; import { api } from "../api/client";
import { showError } from "../banner";
import { NullableNumberField } from "./NullableNumberField"; import { NullableNumberField } from "./NullableNumberField";
import { PaceField, formatPace } from "./PaceField"; import { PaceField, formatPace } from "./PaceField";
import type { WorkoutKind } from "../types/api"; import type { WorkoutKind } from "../types/api";
@@ -31,10 +32,9 @@ export function TrainingTypesCard() {
const [paceMax, setPaceMax] = useState<number | null>(null); const [paceMax, setPaceMax] = useState<number | null>(null);
const [hrMin, setHrMin] = useState<number | null>(null); const [hrMin, setHrMin] = useState<number | null>(null);
const [hrMax, setHrMax] = useState<number | null>(null); const [hrMax, setHrMax] = useState<number | null>(null);
const [error, setError] = useState<string | null>(null);
function reload() { function reload() {
api.listWorkoutKinds(true).then(setKinds).catch((e) => setError(String(e))); api.listWorkoutKinds(true).then(setKinds).catch((e) => showError(String(e)));
} }
useEffect(reload, []); useEffect(reload, []);
@@ -47,12 +47,10 @@ export function TrainingTypesCard() {
setPaceMax(k.pace_max_sec_per_km); setPaceMax(k.pace_max_sec_per_km);
setHrMin(k.hr_min_pct_hrr); setHrMin(k.hr_min_pct_hrr);
setHrMax(k.hr_max_pct_hrr); setHrMax(k.hr_max_pct_hrr);
setError(null);
} }
async function save() { async function save() {
if (!editing) return; if (!editing) return;
setError(null);
try { try {
await api.updateWorkoutKind(editing.ID, { await api.updateWorkoutKind(editing.ID, {
name, name,
@@ -66,7 +64,7 @@ export function TrainingTypesCard() {
setEditing(null); setEditing(null);
reload(); reload();
} catch (e) { } catch (e) {
setError(String(e)); showError(String(e));
} }
} }
@@ -74,8 +72,6 @@ export function TrainingTypesCard() {
<fieldset className="kind-editor"> <fieldset className="kind-editor">
<legend>Training types</legend> <legend>Training types</legend>
{error && <p className="error">{error}</p>}
<ul className="training-type-list"> <ul className="training-type-list">
{kinds.map((k) => ( {kinds.map((k) => (
<li key={k.ID} className="training-type-item"> <li key={k.ID} className="training-type-item">