89 bib hinzufügen user freundlicher machen#110
Conversation
There was a problem hiding this comment.
Pull request overview
Implements Issue #89, indem Aktionen in der eigenen Bibliothek sowie einzelne UI-Interaktionen „user-freundlicher“ gestaltet werden (mehr Aktionen im 3-Punkte-Menü, bessere Beschriftungen, Bestätigungsdialoge).
Changes:
- BookCard: Aktionen (Bewertung, Lesestatus, Löschen) in ein 3-Punkte-Dropdown-Menü verschoben.
- ProfileHeader: Entfolgen erfordert jetzt eine Bestätigung per AlertDialog.
- Navigation/PostCard: Navigation-Label/Icons angepasst und im Post-Dropdown ein Separator ergänzt.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
src/components/userProfile/ProfileHeader.tsx |
Bestätigungsdialog vor dem Entfolgen eingeführt. |
src/components/nav/Navigation.tsx |
Hauptnavigation auf „Beiträge“/„Freunde“/„Bibliothek“ umsortiert und umbenannt. |
src/components/PostCard.tsx |
Separator im Beitrags-Optionsmenü ergänzt. |
src/components/BookCard.tsx |
Bibliotheksaktionen in ein Dropdown-Menü (3 Punkte) konsolidiert; Delete-Dialog darüber angesteuert. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <DropdownMenuItem | ||
| onClick={() => handleStatusChange("want-to-read")} | ||
| className={book.userBook.state === "want-to-read" ? "font-semibold" : ""} | ||
| > | ||
| <BookOpen className="h-5 w-5" /> | ||
| </Button> | ||
| </PopoverTrigger> | ||
| <PopoverContent className="w-auto p-2" align="end"> | ||
| <div className="flex flex-col gap-1"> | ||
| <Button | ||
| variant={book.userBook.state === "want-to-read" ? "default" : "ghost"} | ||
| className="justify-start" | ||
| size="sm" | ||
| onClick={() => handleStatusChange("want-to-read")} | ||
| > | ||
| Möchte ich lesen | ||
| </Button> | ||
| <Button | ||
| variant={book.userBook.state === "reading" ? "default" : "ghost"} | ||
| className="justify-start" | ||
| size="sm" | ||
| onClick={() => handleStatusChange("reading")} | ||
| > | ||
| Lese ich gerade | ||
| </Button> | ||
| <Button | ||
| variant={book.userBook.state === "read" ? "default" : "ghost"} | ||
| className="justify-start" | ||
| size="sm" | ||
| onClick={() => handleStatusChange("read")} | ||
| > | ||
| Gelesen | ||
| </Button> | ||
| </div> | ||
| </PopoverContent> | ||
| </Popover> | ||
|
|
||
| <AlertDialog> | ||
| <AlertDialogTrigger asChild> | ||
| <Button | ||
| variant="ghost" | ||
| size="icon" | ||
| title="Löschen" | ||
| Möchte ich lesen | ||
| </DropdownMenuItem> | ||
| <DropdownMenuItem | ||
| onClick={() => handleStatusChange("reading")} | ||
| className={book.userBook.state === "reading" ? "font-semibold" : ""} | ||
| > | ||
| <Trash2 className="h-5 w-5 text-red-600" /> | ||
| </Button> | ||
| </AlertDialogTrigger> | ||
| Lese ich gerade | ||
| </DropdownMenuItem> | ||
| <DropdownMenuItem | ||
| onClick={() => handleStatusChange("read")} | ||
| className={book.userBook.state === "read" ? "font-semibold" : ""} | ||
| > |
There was a problem hiding this comment.
In Radix DropdownMenuItems sollten Aktionen über onSelect statt onClick verdrahtet werden, damit sie auch per Tastatur (Enter/Space) zuverlässig funktionieren. Die Lesestatus-Optionen verwenden aktuell onClick, was je nach Radix-Eventhandling Keyboard-Nutzung brechen kann.
| <DropdownMenuItem | ||
| onClick={() => setIsDeleteAlertOpen(true)} | ||
| className="text-red-600 focus:text-red-600" | ||
| > | ||
| <Trash2 className="w-4 h-4 mr-2" /> | ||
| Löschen | ||
| </DropdownMenuItem> |
There was a problem hiding this comment.
Der Menüpunkt "Löschen" nutzt onClick; für DropdownMenuItem-Interaktionen ist onSelect der vorgesehene Hook, damit Auswahl auch über Tastatur korrekt ausgelöst wird (und konsistent mit Radix).
| const [isDeleteAlertOpen, setIsDeleteAlertOpen] = useState(false) | ||
|
|
There was a problem hiding this comment.
Der State-Name isDeleteAlertOpen beschreibt hier ein Entfolgen-Confirm (kein Delete). Ein präziser Name (z.B. isUnfollowAlertOpen) reduziert Verwechslungen bei zukünftigen Änderungen.
closes #89