256 lines
20 KiB
Markdown
256 lines
20 KiB
Markdown
<!-- status: plan -->
|
||
<!-- started: 2026-04-07 -->
|
||
<!-- component: ui-nyla | platform -->
|
||
|
||
# PORTA UI-Enhancements (Team-Meeting Inputs, 2026-04-07)
|
||
|
||
## Beschreibung und Kontext
|
||
|
||
**Quelle:** Transkript POL-Weekly vom 7. April 2026 (`c-work/1-plan/input2026-04-ui-enhancement-inbputs.txt`). Philipp Graf und Dominic Largo haben PORTA als **echte Erstnutzer** (KMU-Perspektive, nicht IT-heavy) getestet; Patrick Motsch und das Team haben Anforderungen präzisiert.
|
||
|
||
**Produkt:** PowerOn PORTA — Multi-Tenant SaaS mit AI-Agent-Workspace, siehe [wiki/README.md](../../README.md).
|
||
|
||
**Business-Treiber:** Die **Hürde bis zur ersten sinnvollen Interaktion** muss sinken. Ohne klare Userführung und sichtbares Vertrauen springen potenzielle Kunden ab, bevor sie den Mehrwert (ein Abo statt vieler, Datenkontrolle, Schweizer Gegenpartei) erleben. Das UI ist explizit als **Aushängeschild** und Human-Reaction-Hebel genannt.
|
||
|
||
**Abhängigkeiten:** Copy und rechtliche Zulässigkeit für Marken-/Partner-Hinweise; Billing-Daten müssen für Transparenz-UI verfügbar sein (Gateway/Billing bereits teilweise vorhanden laut Diskussion).
|
||
|
||
**Risiko bei Nicht-Umsetzung:** Weiterhin hohe Abbruchrate nach Login; AI-Workspace wirkt «versteckt» in typischen Fensterbreiten; Vertrauen bleibt abstrakt statt greifbar.
|
||
|
||
## Fokus und kritische Details
|
||
|
||
### Aus dem Meeting extrahierte UI/UX-Schwerpunkte
|
||
|
||
| Thema | Nutzerstimme / Intention | Konsequenz für UI |
|
||
|-------|--------------------------|-------------------|
|
||
| **Vertrauen & Substanz** | Nicht primär ISO-Badge; wichtig ist z. B. «Daten hosted in der Schweiz» (konkreter Anbieter/Standort sichtbar) | Trust-Badges/Copy: Hosting-Ort, ggf. Anbietername; kurze, scanbare Vertrauenszeile |
|
||
| **Marken- & Partneranker** | Swiss Registered (®) am Logo; «Recommended by» mit wenigen, kuratierten Partnern (Valion, PamoCreate, Swiss AI Association, Prescos, Soha Treuhand) | Footer/Landing/Login: Partner-Strip; Markenhinweis konsistent |
|
||
| **Erste Datenanbindung** | Sorge: «Baue ich Scheisse?» — Encoding/Sicherheit nicht fühlbar | Onboarding-Microcopy: Read-only/sichere Verbindung, «nichts kaputtmachen», Rollback/Wiederherstellung wo zutreffend |
|
||
| **AI-Workspace: Eingabe finden** | «Wo tippe ich die Frage?» — kleines Fenster, Plus, Hover; Vergleich zu Cloud/ChatGPT mit klarem Fragebalken | **Primäre Prompt-Zeile** dominant; sekundäre Aktionen nicht vor Eingabe verstecken |
|
||
| **Layout / Viewports** | Schmales Fenster (nicht Mobile, nicht Wide): Chat/Input **verschwindet** praktisch | Breakpoints testen; **Mobile (hoch/schmal)** vs **Desktop (breit)** als zwei klare Modi; mittlere Breiten nicht vernachlässigen |
|
||
| **Neuer Chat / Kontext** | Erwartung: schnell «neuer Chat» wie gewohnt; fehlte als klare Handlung | Sichtbarer CTA «Neuer Chat» / Kontext-Reset analog Erwartung aus Chat-Tools |
|
||
| **Datei / Prompt** | Drag-in-Prompt erwünscht; Entdeckbarkeit war mühsam | Klare Dropzone oder Hinweis in leerem Zustand |
|
||
| **Pricing & Billing Auffindbarkeit** | Erste Session: «Wo steht das Pricing?» Pfad Admin → Benutzer → Billing wirkt versteckt | **Ersteinstieg:** Link oder Teaser zu Kosten/Guthaben; ggf. leere States mit «So siehst du dein Budget» |
|
||
| **Informationsdichte** | «Flut der Informationen oder der Logik» — Berufsalltag vs. zu viel parallel | IA: Schichten, progressive Offenlegung; weniger gleichzeitig auf Startscreens |
|
||
|
||
### Kritische Details
|
||
|
||
- **Int vs. Prod:** Tester war teils auf falscher Instanz — für UX-Tests einheitliche **Test-Links** kommunizieren (Prozess, nicht nur UI).
|
||
- **Rollen:** Admin vs. User — Billing nur für Admins sichtbar; Empty States für User müssen trotzdem Orientierung geben («Frag deinen Admin»), ohne frustrierende Sackgassen.
|
||
- **Recht/Marken:** Partner-Logos und Formulierungen «Recommended by» mit Partnern abstimmen.
|
||
|
||
## Ziel und Nicht-Ziele
|
||
|
||
**Ziel:**
|
||
|
||
- Nach Login und im **AI-Workspace** ist die **primäre Eingabe** (Frage/Prompt) in typischen Viewports **sofort erkennbar**.
|
||
- **Vertrauen** ist ohne Deep-Dive erfassbar: Schweizer Hosting-Hinweis, Marken-/Partner-Elemente wie im Meeting skizziert.
|
||
- **Onboarding** zur ersten Connector-/Datenaktion reduziert Angst («sicher verbinden») durch klare Kurztexte.
|
||
- **Billing/Usage** ist für berechtigte Rollen **auffindbarer**; erste Orientierung zu Kosten ohne Graben durch Administration.
|
||
- **Responsive Verhalten** für schmale Desktop-Fenster und Mobile ist konsistent definiert und getestet.
|
||
|
||
**Explizit NICHT:**
|
||
|
||
- Neues Produkt-Splitting (z. B. «Teamspot») oder komplette Pricing-/Usage-Modelle neu erfinden — nur **UI/IA/Discoverability** und Anbindung an bestehende Billing-Fakten.
|
||
- ISO-Zertifizierung als Projekt; höchstens spätere Verknüpfung zu Compliance-Docs in `e-compliance/`.
|
||
- Vollständige Ersetzung der Produktstory zu externen LLM-Abos (Copy kann ergänzt werden, kein Marketing-Whitepaper im Scope).
|
||
|
||
## Betroffene Module
|
||
|
||
- **Frontend Nyla:** AI-Workspace-Layout, globale Shell (Login/Landing), Navigation/Empty States, ggf. Trust-Strip-Komponente, Breakpoints.
|
||
- **Gateway:** nur falls neue/angereicherte Felder für Trust-Copy (Hosting-Text) oder Billing-Summary für Dashboard nötig — zunächst statische/config-gestützte Copy prüfen.
|
||
- **DB-Migration:** nein (voraussichtlich).
|
||
- **Platform / Wiki:** nach Release `b-reference/ui-nyla/architecture.md` oder `platform/navigation.md` bei Routing-Änderungen.
|
||
|
||
---
|
||
|
||
## Codebase-Audit (Ist-Zustand, `ui-nyla`)
|
||
|
||
Stand: Abgleich mit Repo-Pfaden unter `poweron/ui-nyla/src/`. Tiefergehende Systemregeln: [b-reference/ui-nyla/architecture.md](../../b-reference/ui-nyla/architecture.md), Navigation: [b-reference/platform/navigation.md](../../b-reference/platform/navigation.md).
|
||
|
||
### Bereits vorhanden (positiv)
|
||
|
||
| Bereich | Was existiert | Wo im Code |
|
||
|--------|----------------|------------|
|
||
| **3-Spalten-Workspace** | Links `UnifiedDataBar` (Chats / Dateien / Quellen), Mitte `ChatStream` + `WorkspaceInput`, rechts Activity/Preview; resize handles; Collapse links/rechts | `pages/views/workspace/WorkspacePage.tsx` |
|
||
| **Mobile (≤1024px)** | Oberleiste «Workspace | Activity | Preview»; linke/rechte Panel als Overlay-Drawer; gleicher Breakpoint wie `MainLayout` Sidebar | `WorkspacePage.tsx`, `layouts/MainLayout.tsx` |
|
||
| **Dateien per Drag** | Overlay «Dateien hier ablegen» auf der **gesamten** Center-`main`-Fläche; Upload + `pendingFiles` | `WorkspacePage.tsx` (`onDragEnter`/`Drop` auf `<main>`) |
|
||
| **Prompt-Zeile** | Textarea, `+` Datei, optional Quellen-Picker, Provider-Multi-Select, Voice, Send/Stop; `@file` Autocomplete | `pages/views/workspace/WorkspaceInput.tsx` |
|
||
| **Drag auf Prompt-Bereich** | Nur **`application/tree-items`** (Baum) und **`application/chat-id`** (Chat-Referenz) — kein natives File-Drop im Input-Wrapper (Dateien laufen über Parent-`main`) | `WorkspaceInput.tsx` (`_handlePromptDragOver` / `_handlePromptDrop`) |
|
||
| **Neuer Chat** | `workspace.resetToNew` an UDB gebunden; in **Chats-Tab** Toolbar Button `+` mit `title="Neuer Chat"` | `WorkspacePage.tsx` → `UnifiedDataBar` → `ChatsTab.tsx` |
|
||
| **Billing-Funktionalität** | `BillingDataView`: Tabs Übersicht / Statistik / Transaktionen, Balance Cards, Hinweis auf Admin-Pfad für Aufladung | `pages/billing/BillingDataView.tsx`, `hooks/useBilling.ts`, `api/billingApi.ts` |
|
||
| **Guthaben im UI** | User-Menü: Eintrag «Guthaben» → `/billing/transactions` | `components/Navigation/UserSection.tsx` |
|
||
| **Quellen / Verbindungen** | Ausführlicher `SourcesTab` (Browse, Active Sources, Neutralize) | `components/UnifiedDataBar/SourcesTab.tsx` |
|
||
| **Login** | Logo, Credentials, Microsoft/Google, Registrierung, Kurz-Disclaimer KI/Datenschutz | `pages/Login.tsx`, `Login.module.css` |
|
||
| **Rechtstexte** | Modal «Rechtliche Hinweise» + Links zu statischen HTML-Seiten | `UserSection.tsx` |
|
||
|
||
### Konkrete Issues (Lücken vs. Meeting-Feedback)
|
||
|
||
| # | Problem | Ursache im Code / Verhalten |
|
||
|---|---------|------------------------------|
|
||
| I1 | **Eingabe wirkt «versteckt»** | Chat-Fläche frisst vertikal Platz; Prompt unten, enges Fenster + zwei Sidebars → Mittelspalte wird sehr schmal (>1024px, beide Sidebars offen). Kein **Empty-State** in `ChatStream`, der die Eingabe einrahmt oder zur Aktion führt. |
|
||
| I2 | **«Wo tippe ich?» / kein ChatGPT-Balken** | Textarea ist funktional, aber **Placeholder auf Englisch** (`Type a message...`); visuell keine «Hero»-Eingabe. Sekundäraktionen (`+`, 🔗, Voice, Provider) stehen **in einer Zeile** neben dem Feld — bei wenig Breite wirkt das «nur ein Plus». |
|
||
| I3 | **Neuer Chat unsichtbar** | Nur **`+`** in `ChatsTab` Toolbar; wenn linke Spalte eingeklappt oder Mobile-User nicht auf Tab «Chats» wechselt, fehlt ein **zentrale CTA** in der Mitte. |
|
||
| I4 | **Schmale Desktop-Breite (ca. 1025–1280px)** | `isMobile` ist **false**, also **beide** Sidebars standardmäßig aktiv (280px + 320px + Handles). Zentrum `flex: 1`, `minWidth: 0` — Eingabe bleibt im DOM, wirkt aber «Wischiwaschi» oder abgeschnitten. Meeting: «A4-Fenster» genau diese Zone. |
|
||
| I5 | **Dateien: Entdeckbarkeit** | Vollflächen-Drop existiert, aber ohne **dauerhaften Hinweis** im leeren Chat; Nutzer erwarten oft Drop **direkt auf das Textfeld**. |
|
||
| I6 | **Vertrauen / Schweiz / Partner** | Login: **kein** Hosting-Hinweis, kein Partner-Strip, kein ® am Logo in der UI (nur Bildasset — rechtlich/Marken separat klären). Compliance-Texte eher in `e-compliance/` und statischen HTML, nicht **scanbar** auf Login. |
|
||
| I7 | **Billing / Pricing Auffindbarkeit** | Funktional stark (`BillingDataView`), aber **Einstieg** primär: Nav-Baum (`GET /api/navigation`, siehe Gateway `NAVIGATION_SECTIONS`) + verstecktes User-Menü «Guthaben». Kein **Dashboard-Teaser** nach erstem Login. |
|
||
| I8 | **Connector-Sorge** | `SourcesTab` ist technisch mächtig, aber ohne **kuratierte Erstnutzer-Copy** («Verbindung ist read-only / nichts kaputt») am Einstieg — Meeting-Thema «baue ich Scheisse». |
|
||
| I9 | **Informationsdichte** | Workspace + UDB + rechte Spalte parallel; kein **progressives** Onboarding in der Mitte (ausser globalem OnboardingWizard nach Google). |
|
||
|
||
---
|
||
|
||
## Umsetzungsplan (integriert)
|
||
|
||
Ziele: Issues I1–I9 adressieren, **ohne** Billing-Logik oder Gateway-Tarife neu zu erfinden. Reihenfolge nach **Aufwand × Wirkung** für KMU-Erstnutzung.
|
||
|
||
### Phase A — Quick Wins (1–3 Tage)
|
||
|
||
| Task | Änderung | Dateien / Hinweise |
|
||
|------|-----------|-------------------|
|
||
| A1 | Placeholder + primäre Labels **DE** (und i18n Keys, falls `locales` für Workspace genutzt werden soll) | `WorkspaceInput.tsx` — z. B. «Frage stellen oder @Dateiname für Kontext» |
|
||
| A2 | **Empty State** in der Mitte: kurzer Titel, Bullet «Hier unten Frage eingeben», «Dateien auf die Fläche ziehen», Button **Neuer Chat** (ruft `onCreateNew`/`resetToNew` — Props von `WorkspacePage` durchreichen) | `ChatStream.tsx` + optionell schmale Props von `WorkspacePage.tsx` |
|
||
| A3 | **Neuer Chat** zusätzlich: Button in der **mittleren Kopfzeile** (nur Desktop) oder neben Mobile-«Workspace»-Leiste, sichtbar ohne UDB | `WorkspacePage.tsx` |
|
||
| A4 | Billing-Hinweis für **Nicht-Admins**: ein Zeiler im Empty State oder unter Prompt mit Link zu Hilfe («Guthaben: Administrator») — Text mit `BillingDataView` / BalanceCard abgleichen | `ChatStream` oder `WorkspacePage`, Copy-only |
|
||
|
||
### Phase B — Layout & Breakpoints (3–5 Tage)
|
||
|
||
| Task | Änderung | Dateien / Hinweise |
|
||
|------|-----------|-------------------|
|
||
| B1 | **Zwischen-Breakpoint** (z. B. `≤1280` oder `≤1360`): **automatisch linke und/oder rechte Sidebar einklappen** oder nur eine Sidebar standardmäßig offen, damit `mindestens ~480px` für die Mittelspalte garantiert sind | `WorkspacePage.tsx` — `useEffect` auf `innerWidth` + lokaler State, dokumentierte Schwellwerte |
|
||
| B2 | Optional: **minWidth** auf `<main>` mit «Seite zu schmal»-Hinweis statt silent squeeze | `WorkspacePage.tsx` |
|
||
| B3 | **Visuelle Hierarchie Prompt**: Eingabezeile leicht hervorgehoben (Schatten/Rand), ggf. erste Zeile höher (`minHeight`) | `WorkspaceInput.tsx` oder ausgelagertes CSS Module |
|
||
| B4 | E2E/Visuell: Viewports **1100 / 1200 / 1280 / 1440** in Testplan festhalten | Playwright oder manuelle Matrix |
|
||
|
||
### Phase C — Vertrauen & Marketing-UI (2–4 Tage, abhängig von Legal)
|
||
|
||
| Task | Änderung | Dateien / Hinweise |
|
||
|------|-----------|-------------------|
|
||
| C1 | Wiederverwendbare **`TrustFooter` / `TrustStrip`**: Zeile Hosting Schweiz (Formulierung mit Legal abgleichen — ggf. Verweis auf [e-compliance/security-overview.md](../../e-compliance/security-overview.md)) | Neue Komponente unter `components/`, einbinden in `Login.tsx`, optional `Register`, optional `MainLayout` Footer |
|
||
| C2 | **Recommended by** — statische Logos/Links (max. 5) nur nach **Partner-Freigabe** | Gleiche Komponente; Assets unter `public/` |
|
||
| C3 | Swiss **®** am Logo nur nach Markenfreigabe — sonst Textlink «Marke» | `Login.module.css` / Layout-Logo |
|
||
| C4 | **SourcesTab** oder erster Besuch «Quellen»: ein **Info-Banner** (1–2 Sätze) zu sicherer Verbindung / keine Zerstörung von Quelldaten — mit Product Owner fact-checken | `SourcesTab.tsx` oben |
|
||
|
||
### Phase D — Billing-Discovery (2–3 Tage)
|
||
|
||
| Task | Änderung | Dateien / Hinweise |
|
||
|------|-----------|-------------------|
|
||
| D1 | Nach Login: **einmaliger** Banner oder Home-Teaser «Guthaben & Nutzung» mit Link zu `/billing/transactions` (nur wenn Route erlaubt — Permission prüfen wie andere Nav-Items) | `MainLayout.tsx`, `App.tsx` Home-Route, oder dedizierte `HomePage` — je nachdem wo Landing liegt |
|
||
| D2 | Optional: **kleine Balance-Zahl** in UserSection neben Avatar (nur wenn API schon geladen wird und Mandate eindeutig) — Performance/UX mit `useBilling` prüfen | `UserSection.tsx` |
|
||
| D3 | Gateway: Navigations-**Label/Reihenfolge** für Billing in «Meine Sicht» nach oben ziehen (wenn gewünscht) — **kein** Frontend-Workaround ohne Backend | `platform-core` `NAVIGATION_SECTIONS` / `mainSystem.py` (siehe Wiki navigation.md) |
|
||
|
||
### Phase E — Feinschliff (laufend)
|
||
|
||
| Task | Änderung |
|
||
|------|-----------|
|
||
| E1 | `WorkspaceInput`: optional natives **File** im Prompt-`onDragOver`/`Drop` spiegeln (gleiche Logik wie `WorkspacePage._uploadAndAttach`) — dann expliziter Drop auf Eingabe |
|
||
| E2 | i18n: alle neuen Strings in `locales/` |
|
||
| E3 | Nach Merge: `b-reference/ui-nyla/architecture.md` um Workspace-UX-Notizen ergänzen |
|
||
|
||
### Abhängigkeiten & Risiken
|
||
|
||
- **D3** erfordert Gateway-Deploy und gehört fachlich zu «IA», nicht nur CSS.
|
||
- **C1–C3** müssen mit **Legal/Marketing** sign-off; keine konkreten Hosting-Anbieter-Namen ohne Vertragslage.
|
||
- **D1** braucht klare Regel, wann der Banner **nicht** nervt (localStorage `dismissed`).
|
||
|
||
---
|
||
|
||
## Entscheidungen
|
||
|
||
| Datum | Entscheidung | Begründung |
|
||
|-------|-------------|------------|
|
||
| 2026-04-07 | Plan aus Meeting-Transkript abgeleitet; Fokus UI/UX, nicht Pricing-Tarife | Entscheidungen zu Tarifen und Modellen sind separat zu treffen |
|
||
| 2026-04-07 | Codebase-Audit gegen `ui-nyla` — Umsetzung in Phasen A–E | Issues I1–I9 und bestehende Bausteine im Dokument festgehalten |
|
||
|
||
*Weitere Einträge nach UX-Review und Abstimmung Partner/Hosting-Formulierung.*
|
||
|
||
## Umsetzungs-Checkliste
|
||
|
||
Die detaillierte Aufgabenzerlegung steht in **Umsetzungsplan** (Phasen A–E). Hier die Cross-Cutting-Checks:
|
||
|
||
**Phase A (Quick Wins)**
|
||
|
||
- [ ] A1: `WorkspaceInput.tsx` — DE-Placeholder / Copy
|
||
- [ ] A2: `ChatStream.tsx` + Props — Empty State + Kurzhelp
|
||
- [ ] A3: `WorkspacePage.tsx` — «Neuer Chat» sichtbar ohne UDB
|
||
- [ ] A4: Copy für Nicht-Admins (Guthaben)
|
||
|
||
**Phase B (Layout)**
|
||
|
||
- [ ] B1–B2: `WorkspacePage.tsx` — Zwischen-Breakpoint / Sidebar-Strategie
|
||
- [ ] B3: `WorkspaceInput.tsx` — visuelle Hierarchie Eingabe
|
||
- [ ] B4: Viewport-Testmatrix dokumentiert
|
||
|
||
**Phase C (Trust)**
|
||
|
||
- [ ] C1–C3: Trust-Komponente + Login/Register/Layout — Legal OK
|
||
- [ ] C4: `SourcesTab.tsx` — Sicherheits-Banner
|
||
|
||
**Phase D (Billing-Discovery)**
|
||
|
||
- [ ] D1: Home / nach Login — Teaser-Link Billing
|
||
- [ ] D2: optional `UserSection.tsx` — Balance-Snippet
|
||
- [ ] D3: optional Gateway — `NAVIGATION_SECTIONS` Billing-Prominenz
|
||
|
||
**Phase E / Plattform**
|
||
|
||
- [ ] E1: optional File-Drop auf Prompt synchron zu `WorkspacePage`
|
||
- [ ] E2: `locales/*` für neue Strings
|
||
- [ ] E3: Wiki `b-reference/ui-nyla/architecture.md` aktualisieren
|
||
|
||
**Querschnitt**
|
||
|
||
- [ ] API-Endpunkte: nur bei D2/D3 oder neuen Summary-APIs nötig
|
||
- [ ] DB-Migration: nein (Planstand)
|
||
- [ ] RBAC: Billing-Routen nur anzeigen wenn wie heute erlaubt
|
||
- [ ] Neutralisierung: nur Copy in C4, kein Verhalten
|
||
- [ ] Navigation / Routing: nur bei D1/D3
|
||
- [ ] Billing-Impact: Darstellung/Auffindbarkeit, keine Tariflogik
|
||
|
||
## Akzeptanzkriterien
|
||
|
||
| # | Kriterium (Given-When-Then) | Prio |
|
||
|---|---------------------------|------|
|
||
| 1 | Given ein eingeloggter User ohne verbundene Datenquellen, When er den AI-Workspace öffnet (Desktop ≥1280px und Mobile-Viewport), Then ist die Haupt-Eingabe für Prompt/Frage ohne Hover oder Scrollen in den ersten sichtbaren 50 % des Hauptbereichs erkennbar | must |
|
||
| 2 | Given schmales Desktop-Fenster (z. B. 900–1024px Breite), When der AI-Workspace angezeigt wird, Then bleibt die Prompt-Eingabe zugänglich (kein «verschwindendes» Chatfenster ohne Alternativlayout) | must |
|
||
| 3 | Given Login- oder Startansicht, When der User die Seite scannt (5–10 Sekunden), Then sind mindestens ein **Schweiz-Hosting**-Hinweis und der **Partner-/Recommended-by**-Block gemäss kuratierter Liste sichtbar oder mit einem klaren «Vertrauen»-Einstieg erreichbar | should |
|
||
| 4 | Given User mit Rolle Admin, When er nach dem ersten Login Orientierung zu Kosten sucht, Then führt ein in der UI sichtbarer Einstieg innerhalb ≤2 Klicks zur Billing-/Usage-Übersicht (bestehender Pfad darf erhalten bleiben, muss aber nicht mehr alleinige Entdeckungsquelle sein) | should |
|
||
| 5 | Given AI-Workspace, When der User eine neue Unterhaltung beginnen will, Then ist eine explizite «Neuer Chat»- oder gleichwertige Handlung sichtbar und erklärt sich ohne externe Doku | should |
|
||
| 6 | Given leerer Chat ohne Nachrichten, When der User eine Datei einbinden will, Then ist erkennbar, ob und wie Drag-and-Drop in den Prompt funktioniert (Text oder Dropzone) | could |
|
||
|
||
## Testplan
|
||
|
||
| ID | AC | Art | Automatisiert | Repo-Pfad | Status |
|
||
|----|----|-----|--------------|-----------|--------|
|
||
| T1 | 1,2 | e2e / manuell Viewports | teilweise | `ui-nyla` — `WorkspacePage.tsx` bei 1100/1200/1280/1440px | pending |
|
||
| T2 | 3 | manuell UX-Review | nein | — | pending |
|
||
| T3 | 4 | manuell Rolle Admin | nein | — | pending |
|
||
| T4 | 5,6 | manuell Explorer/Safari/Edge | nein | — | pending |
|
||
|
||
## Links
|
||
|
||
- Input: [input2026-04-ui-enhancement-inbputs.txt](./input2026-04-ui-enhancement-inbputs.txt)
|
||
- Produkt-Überblick: [README.md](../../README.md)
|
||
- Frontend-Referenz: [b-reference/ui-nyla/architecture.md](../../b-reference/ui-nyla/architecture.md)
|
||
- Navigation API: [b-reference/platform/navigation.md](../../b-reference/platform/navigation.md)
|
||
- Billing (Backend-Kontext): [b-reference/platform-core/billing.md](../../b-reference/platform-core/billing.md)
|
||
- Compliance (Copy-Grundlage): [e-compliance/security-overview.md](../../e-compliance/security-overview.md)
|
||
|
||
**Code (Haupt-Einstiegspunkte, Repo `ui-nyla`)**
|
||
|
||
- `src/pages/views/workspace/WorkspacePage.tsx` — Layout, Mobile, Drag-Drop, UDB
|
||
- `src/pages/views/workspace/WorkspaceInput.tsx` — Prompt, Anhänge, STT
|
||
- `src/pages/views/workspace/ChatStream.tsx` — Nachrichtenliste
|
||
- `src/components/UnifiedDataBar/ChatsTab.tsx` — Chat-Liste, `+` Neuer Chat
|
||
- `src/components/UnifiedDataBar/SourcesTab.tsx` — Verbindungen / Quellen
|
||
- `src/pages/Login.tsx` — Login-Shell
|
||
- `src/components/Navigation/UserSection.tsx` — Guthaben-Menü
|
||
- `src/pages/billing/BillingDataView.tsx` — Nutzer-Billing
|
||
|
||
- PR: …
|
||
- Issue: …
|
||
|
||
## Abschluss
|
||
|
||
- [ ] b-reference/ aktualisiert (`ui-nyla/architecture.md`, ggf. `platform/navigation.md`)
|
||
- [ ] TOPICS.md aktualisiert (falls neues Thema «Trust-UI» o. ä.)
|
||
- [ ] Dieses Dokument → `z-archive/` verschoben (nach Release)
|