diff --git a/app/src/components/ExerciseRow.jsx b/app/src/components/ExerciseRow.jsx index 302d7a3..c16f47a 100644 --- a/app/src/components/ExerciseRow.jsx +++ b/app/src/components/ExerciseRow.jsx @@ -44,6 +44,7 @@ export default function ExerciseRow({ {editingName ? ( onChange({ name: e.target.value, standardName: e.target.value })} onBlur={() => setEditingName(false)} @@ -77,33 +78,48 @@ export default function ExerciseRow({
- {["sets", "reps"].map(field => ( -
- onChange({ [field]: e.target.value })} - style={{ - width: 40, - height: 28, - padding: "0 4px", - background: "var(--cds-field-01)", - border: `1px solid ${validateNumbers && isInvalidNum(exercise[field]) ? "var(--cds-support-error)" : "var(--cds-border-strong-01)"}`, - color: validateNumbers && isInvalidNum(exercise[field]) ? "var(--cds-support-error)" : "var(--cds-text-primary)", - fontFamily: "var(--cds-font-sans)", - fontSize: 12, - outline: "none", - textAlign: "center", - }} - /> - - {field === "sets" ? "sett" : "reps"} - -
- ))} + {["sets", "reps"].map(field => { + const isFieldInvalid = validateNumbers && isInvalidNum(exercise[field]); + const errorId = `err-${exercise.id}-${field}`; + return ( +
+ onChange({ [field]: e.target.value })} + style={{ + width: 40, + height: 28, + padding: "0 4px", + background: "var(--cds-field-01)", + border: `1px solid ${isFieldInvalid ? "var(--cds-support-error)" : "var(--cds-border-strong-01)"}`, + color: isFieldInvalid ? "var(--cds-support-error)" : "var(--cds-text-primary)", + fontFamily: "var(--cds-font-sans)", + fontSize: 12, + outline: "none", + textAlign: "center", + }} + /> + + {field === "sets" ? "sett" : "reps"} + + {isFieldInvalid && ( + + Ugyldig antall – skriv inn 1 til 99 + + )} +
+ ); + })}