UX Verbesserung, Navigationsspeicherung #40

Merged
Lars merged 6 commits from develop into main 2026-05-20 10:44:00 +02:00
5 changed files with 9 additions and 24 deletions
Showing only changes of commit 8afdd811db - Show all commits

View File

@ -88,11 +88,14 @@ Links **zum** Ziel: **`NavStateLink`** mit `returnContext` der Quellseite.
### Editor-Aktionen
Auf Vollseiten-Editoren mit **`PageFormEditorChrome`** oder **`FormActionBar`** (`placement="bottom"`):
Auf Vollseiten-Editoren mit **`FormActionBar`** (`placement="bottom"`) oder **`PageFormEditorChrome`**:
- **Abbrechen**`goBack()` / `goNavReturn(...)` (Einsprungspunkt, nicht feste Route)
- **Kein** separater Zurück-Link/Button oben (wirkt in der App redundant)
- **Abbrechen**`goBack()` / `goNavReturn(...)` (Einsprungspunkt)
- **Speichern & Schließen** → nach erfolgreichem Save ebenfalls `goBack()`
- Sticky Action Bar unten nutzen, wo vorhanden
- Sticky Action Bar unten nutzen
**PageReturnButton** nur auf **Leseseiten** ohne Editor-Leiste (z.B. Übungsdetail, Einstellungen-Unterseiten, Trainingsablauf).
---

View File

@ -3,7 +3,8 @@ import { useFormEditorActions } from '../context/FormEditorActionsContext'
import PageReturnButton from './PageReturnButton'
/**
* Vollseiten-Editor: Zurück-Schalter + Titel oben; FormActionBar fix unten (FormEditorBottomSlot).
* Vollseiten-Editor: optional Zurück oben; FormActionBar fix unten (FormEditorBottomSlot).
* Mit actionConfig ist showReturn standardmäßig aus Rücksprung über Abbrechen / Speichern & Schließen.
*/
export default function PageFormEditorChrome({
title,
@ -12,7 +13,7 @@ export default function PageFormEditorChrome({
actionConfig,
children,
testId,
showReturn = true,
showReturn = false,
}) {
useFormEditorActions(actionConfig)

View File

@ -6,7 +6,6 @@ import ExercisePeekModal from '../components/ExercisePeekModal'
import TrainingUnitSectionsEditor from '../components/TrainingUnitSectionsEditor'
import PageSectionNav from '../components/PageSectionNav'
import FormActionBar from '../components/FormActionBar'
import PageReturnButton from '../components/PageReturnButton'
import { useToast } from '../context/ToastContext'
import { useNavReturn } from '../hooks/useNavReturn'
import {
@ -857,11 +856,6 @@ export default function TrainingFrameworkProgramEditPage() {
return (
<div className="app-page">
<div className="framework-edit">
<PageReturnButton
fallbackPath={FRAMEWORK_PROGRAMS_LIST_PATH}
fallbackLabel="Zurück zu Rahmenprogrammen"
/>
<h1 style={{ marginBottom: '0.75rem' }}>{isNew ? 'Neues Rahmenprogramm' : 'Rahmenprogramm bearbeiten'}</h1>
<details className="framework-edit-intro">

View File

@ -3,7 +3,6 @@ import { useLocation, useNavigate, useParams } from 'react-router-dom'
import api from '../utils/api'
import ExercisePickerModal from '../components/ExercisePickerModal'
import FormActionBar from '../components/FormActionBar'
import PageReturnButton from '../components/PageReturnButton'
import { hydrateExercisePlanningRow } from '../utils/trainingUnitSectionsForm'
import { useAuth } from '../context/AuthContext'
import { useToast } from '../context/ToastContext'
@ -11,7 +10,6 @@ import UnsavedChangesPrompt from '../components/UnsavedChangesPrompt'
import { useBeforeUnloadWhen, useUnsavedChangesBlocker } from '../hooks/useUnsavedChangesBlocker'
import { activeClubMemberships, getDefaultClubIdForGovernanceForms, getTenantClubDependencyKey } from '../utils/activeClub'
import {
TRAINING_MODULES_LIST_PATH,
buildTrainingModulesListReturnContext,
goNavReturn,
preserveAppReturnOnNavigate,
@ -377,10 +375,6 @@ export default function TrainingModuleEditPage() {
return (
<div className="app-page">
<PageReturnButton
fallbackPath={TRAINING_MODULES_LIST_PATH}
fallbackLabel="Zurück zur Modul-Bibliothek"
/>
<h1 className="page-title">{isNew ? 'Neues Trainingsmodul' : 'Trainingsmodul bearbeiten'}</h1>
<p style={{ color: 'var(--text2)', fontSize: '0.95rem', marginBottom: '1.25rem', maxWidth: '40rem' }}>
Reihenfolge der Positionen entspricht der späteren Übernahme in einen Abschnitt der Einheit (Kopie).

View File

@ -3,14 +3,12 @@ import { useNavigate, useParams } from 'react-router-dom'
import api from '../utils/api'
import TrainingUnitSectionsEditor from '../components/TrainingUnitSectionsEditor'
import FormActionBar from '../components/FormActionBar'
import PageReturnButton from '../components/PageReturnButton'
import UnsavedChangesPrompt from '../components/UnsavedChangesPrompt'
import { useBeforeUnloadWhen, useUnsavedChangesBlocker } from '../hooks/useUnsavedChangesBlocker'
import { useAuth } from '../context/AuthContext'
import { useToast } from '../context/ToastContext'
import { useNavReturn } from '../hooks/useNavReturn'
import {
PLAN_TEMPLATES_LIST_PATH,
buildPlanTemplatesListReturnContext,
} from '../utils/navReturnContext'
import {
@ -228,11 +226,6 @@ export default function TrainingPlanTemplateEditPage() {
return (
<div className="app-page">
<PageReturnButton
fallbackPath={PLAN_TEMPLATES_LIST_PATH}
fallbackLabel="Zurück zu Vorlagen"
/>
<h1 className="page-title" style={{ marginBottom: '0.35rem' }}>
Trainingsvorlage bearbeiten
</h1>