# AMZ Seller - Helper: UI, Sidebar und Tabelle

Dieses Briefing beschreibt Aufbau, Styling und Interaktion der rechten Sidebar inklusive Sortierlogik.

## Zuständige Dateien

- `chrome-plugin/src/ui/SeoDayAmzStoreScannerOverlayUserInterfaceService.js`
- `chrome-plugin/src/table/SeoDayAmzStoreProductsTablePresentationService.js`
- `chrome-plugin/content.css`
- `chrome-plugin/src/app/SeoDayAmzStoreScannerApplicationController.js`

## UI-Anforderungen

1. Rechte Sidebar wird über Icon-Klick geöffnet/geschlossen.
2. Primärer Button: `Scrape`.
3. Tabelle aktualisiert sich live bei neuen Seitenresultaten.
4. Standard-Sortierung: `Umsatz` absteigend.
5. Sortierbare Header mit Richtungsindikator (`↑`/`↓`).
6. Statuszeile zeigt Fortschritt (`x / y`) und insgesamt extrahierte Produkte.
7. Tabelle wird kompakt dargestellt: weniger Spalten, dafür mehrere Werte pro Zelle.
8. Die Spalten `Umsatz`, `Sales`, `Preis`, `Ø Bewertung` und `Anzahl Bewertungen` bleiben als eigenständige Tabellenspalten erhalten und dürfen nicht in Sammelspalten aufgehen.
9. Die alte kombinierte Spalte `Bewertung` bleibt entfernt; stattdessen wird `Ø Bewertung` als eigene Spalte mit Icon im Spaltenkopf geführt.
10. Die vorhandenen Werte bleiben vollständig erhalten und werden in Multi-Line-Zellen gruppiert (z. B. Produktdaten).
11. Innerhalb der Zellen dürfen visuelle Farbakzente für Labels/Badges genutzt werden, um Lesbarkeit trotz kompakter Breite zu erhöhen; in der Sales-Spalte wird jedoch kein Badge mehr angezeigt.
12. `ASIN` und `Titel` sind direkt verlinkt, eine separate Spalte `Links` wird nicht angezeigt.
13. Das Feld `Badge` wird nicht in der Produkt-Spalte angezeigt.
14. Für das UI wird das quadratische SEO-DAY-Logo (`chrome-plugin/assets/logo.jpg`) verwendet.
15. In der Preis-Spalte wird kein `Preis`-Badge angezeigt, nur der Preiswert.
16. Die Spalte fuer die Anzahl Bewertungen nutzt im Spaltenkopf ein passendes Icon statt Text; in den Zeilen wird nur der Zahlenwert angezeigt.
17. ASIN und Titel verlinken auf die Produktseite; ein separater Store-Link als Icon in der Produkt-Spalte wird nicht angezeigt.
18. Alle Spaltenkoepfe zeigen beim Mouse-Over sofort ein Info-Popup mit der Bedeutung der jeweiligen Spalte.
25. Tooltip-Info-Popups im Tabellenkopf muessen innerhalb der sichtbaren Sidebar bleiben, mehrzeilig umbrechen duerfen und nicht nach rechts aus dem sichtbaren Bereich herauslaufen.
31. Der Tooltip der linken Nummern-Spalte (`#`) darf nicht links abgeschnitten werden und muss sichtbar nach rechts in den Tabellenbereich aufgehen.
26. Die Statuszeile muss zusaetzlich Gesamtmetriken ueber alle aktuell extrahierten Produkte zeigen: kalkulierter Gesamtumsatz pro Monat, Gesamtanzahl aller Bewertungen und den Overall-Durchschnitt der Produktbewertung.
29. In der Statuszeile muessen die KPI-Werte untereinander stehen (je KPI eine eigene Zeile) und duerfen nicht als lange Ein-Zeilen-Kette hintereinander ausgegeben werden.
19. Beim erstmaligen Oeffnen der Sidebar pulsiert der `Scrape`-Button leicht als Initial-Hinweis.
27. Die Initial-Pulsierung des `Scrape`-Buttons muss sehr deutlich sichtbar sein (sehr kraeftiger Glow, klar wahrnehmbare Groessenveraenderung und mehrere schnelle Pulse), ohne die Lesbarkeit der Beschriftung zu beeintraechtigen.
28. In der Produktspalte muessen die Linktexte von `ASIN` und Produkttitel weiss dargestellt werden, damit sie visuell konsistent zur hellen Zahlen-Darstellung (z. B. Umsatzwerte) sind.
20. Die Spalte `Ø Bewertung` nutzt robustes numerisches Parsing und zeigt den Wert einheitlich mit einer Nachkommastelle (z. B. `4,6`).
21. Die Spalte `Umsatz` wird als eigene Icon-Spalte links neben `Sales` geführt und berechnet sich aus `Verkäufe * Stückpreis`; der Spaltenkopf erklärt dies als kalkulierten monatlichen Umsatz.
30. Umsatzwerte werden ohne Nachkommastellen dargestellt (ganze Euro), sowohl in der Umsatz-Spalte als auch in der Status-KPI `Umsatz/Monat`.
24. Beim laufenden Scraping werden neu eingehende Einträge sofort nach der aktiven Sortierung (standardmäßig `Umsatz desc`) neu sortiert und dargestellt.
22. Während ein Scraping-Lauf aktiv ist, zeigt die Statuszeile links neben dem Fortschrittstext einen sichtbaren Loading-Spinner; nach Abschluss oder Fehler wird der Spinner wieder ausgeblendet.
23. Der Kopfbereich mit Logo und `AMZ-Seller Helper` verwendet einen weißen Hintergrund mit gut lesbaren dunklen Textfarben.

## Verlinkungsregel

- Alle UI-/Table-Dateien enthalten Briefing-Verweise.
- Änderungen an Interaktion, Sortierung oder Visualisierung müssen zuerst hier dokumentiert werden.
