[FEAT-001] Icon Picker f�r Trainingstypen #14

Open
opened 2026-03-23 09:01:25 +01:00 by Lars · 0 comments
Owner

Status: ? Ausstehend
Priorit�t: Low (UX)
Branch: develop

Beschreibung

Admin-UI zum Erstellen/Bearbeiten von Trainingstypen erfordert manuelle Emoji-Eingabe im Icon-Feld. Ein visueller Emoji-Picker w�rde die UX verbessern.

Aktuelles Verhalten

  • Textfeld: "Icon (Emoji)" ? User muss Emoji manuell eingeben oder kopieren
  • Fehleranf�llig (falsches Format, kein Emoji)

Erwartetes Verhalten

  • Button "Icon ausw�hlen" ? Emoji-Picker �ffnet sich
  • Kategorien: Sport, Natur, Objekte, etc.
  • Klick auf Emoji ? �bernimmt in Feld
  • Alternativ: Weiterhin manuelle Eingabe m�glich

Implementierung

  • Frontend-Library: emoji-picker-react oder emoji-mart
  • Komponente: <EmojiPicker onSelect={(emoji) => setIcon(emoji.native)}/>
  • Modal/Dropdown neben Icon-Textfeld

Betroffene Dateien

  • frontend/src/pages/SettingsPage.jsx (Admin Training Types Form)
  • Optional: Neue Komponente frontend/src/components/EmojiPicker.jsx

To-Do

  • Library evaluieren (Bundle-Size, React 18 Kompatibilit�t)
  • Komponente integrieren
  • UX testen (Mobile + Desktop)
**Status:** ? Ausstehend **Priorit�t:** Low (UX) **Branch:** develop ## Beschreibung Admin-UI zum Erstellen/Bearbeiten von Trainingstypen erfordert manuelle Emoji-Eingabe im Icon-Feld. Ein visueller Emoji-Picker w�rde die UX verbessern. ## Aktuelles Verhalten - Textfeld: "Icon (Emoji)" ? User muss Emoji manuell eingeben oder kopieren - Fehleranf�llig (falsches Format, kein Emoji) ## Erwartetes Verhalten - Button "Icon ausw�hlen" ? Emoji-Picker �ffnet sich - Kategorien: Sport, Natur, Objekte, etc. - Klick auf Emoji ? �bernimmt in Feld - Alternativ: Weiterhin manuelle Eingabe m�glich ## Implementierung - Frontend-Library: `emoji-picker-react` oder `emoji-mart` - Komponente: `<EmojiPicker onSelect={(emoji) => setIcon(emoji.native)}/>` - Modal/Dropdown neben Icon-Textfeld ## Betroffene Dateien - `frontend/src/pages/SettingsPage.jsx` (Admin Training Types Form) - Optional: Neue Komponente `frontend/src/components/EmojiPicker.jsx` ## To-Do - [ ] Library evaluieren (Bundle-Size, React 18 Kompatibilit�t) - [ ] Komponente integrieren - [ ] UX testen (Mobile + Desktop)
Lars added the
feature
low
develop
labels 2026-03-23 09:01:25 +01:00
Sign in to join this conversation.
No Milestone
No project
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: Lars/mitai-jinkendo#14
No description provided.