refactor: update various components to enhance styling consistency and improve user interaction by removing unnecessary classes and adjusting dialog and dropdown styles

This commit is contained in:
Anish Sarkar 2026-03-07 04:15:40 +05:30
parent b07f8699f6
commit 72337f326c
24 changed files with 127 additions and 158 deletions

View file

@ -78,7 +78,7 @@ export function DocumentsFilters({
)}
</Button>
</PopoverTrigger>
<PopoverContent className="w-64 !p-0 overflow-hidden bg-muted dark:border dark:border-neutral-700" align="end">
<PopoverContent className="w-64 !p-0 overflow-hidden" align="end">
<div>
{/* Search input */}
<div className="p-2 border-b border-neutral-700">

View file

@ -265,7 +265,6 @@ function RowContextMenu({
<>
<ContextMenuSeparator />
<ContextMenuItem
variant="destructive"
onClick={() => !isDeleteDisabled && onDelete(doc)}
disabled={isDeleteDisabled}
>

View file

@ -95,7 +95,6 @@ export function RowActions({
{/* Desktop Actions */}
<div className="hidden md:inline-flex items-center justify-center">
{isEditable ? (
// Editable documents: show 3-dot dropdown with edit + delete
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
@ -125,7 +124,7 @@ export function RowActions({
className={
isDeleteDisabled
? "text-muted-foreground cursor-not-allowed opacity-50"
: "text-destructive focus:text-destructive"
: ""
}
>
<Trash2 className="mr-2 h-4 w-4" />
@ -135,12 +134,11 @@ export function RowActions({
</DropdownMenuContent>
</DropdownMenu>
) : (
// Non-editable documents: show only delete button directly
shouldShowDelete && (
<Button
variant="ghost"
size="icon"
className={`h-8 w-8 ${isDeleteDisabled ? "text-muted-foreground cursor-not-allowed" : "text-muted-foreground hover:text-destructive hover:bg-destructive/10"}`}
className={`h-8 w-8 ${isDeleteDisabled ? "text-muted-foreground cursor-not-allowed" : "text-muted-foreground hover:text-foreground"}`}
onClick={() => !isDeleteDisabled && setIsDeleteOpen(true)}
disabled={isDeleting || isDeleteDisabled}
>
@ -154,7 +152,6 @@ export function RowActions({
{/* Mobile Actions Dropdown */}
<div className="inline-flex md:hidden items-center justify-center">
{isEditable ? (
// Editable documents: show 3-dot dropdown
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="h-8 w-8 text-muted-foreground">
@ -180,7 +177,7 @@ export function RowActions({
className={
isDeleteDisabled
? "text-muted-foreground cursor-not-allowed opacity-50"
: "text-destructive focus:text-destructive"
: ""
}
>
<Trash2 className="mr-2 h-4 w-4" />
@ -190,12 +187,11 @@ export function RowActions({
</DropdownMenuContent>
</DropdownMenu>
) : (
// Non-editable documents: show only delete button directly
shouldShowDelete && (
<Button
variant="ghost"
size="icon"
className={`h-8 w-8 ${isDeleteDisabled ? "text-muted-foreground cursor-not-allowed" : "text-muted-foreground hover:text-destructive hover:bg-destructive/10"}`}
className={`h-8 w-8 ${isDeleteDisabled ? "text-muted-foreground cursor-not-allowed" : "text-muted-foreground hover:text-foreground"}`}
onClick={() => !isDeleteDisabled && setIsDeleteOpen(true)}
disabled={isDeleting || isDeleteDisabled}
>

View file

@ -1222,7 +1222,6 @@ function LogRowActions({ row, t }: { row: Row<Log>; t: (key: string) => string }
<AlertDialog open={isOpen} onOpenChange={setIsOpen}>
<AlertDialogTrigger asChild>
<DropdownMenuItem
className="text-destructive focus:text-destructive"
onSelect={(e) => {
e.preventDefault();
setIsOpen(true);

View file

@ -564,7 +564,7 @@ function MemberRow({
<DropdownMenuContent
align="end"
onCloseAutoFocus={(e) => e.preventDefault()}
className="min-w-[120px] bg-muted dark:border dark:border-neutral-700"
className="min-w-[120px]"
>
{canManageRoles &&
roles
@ -581,8 +581,8 @@ function MemberRow({
<AlertDialog>
<AlertDialogTrigger asChild>
<DropdownMenuItem
className="text-destructive focus:text-destructive"
onSelect={(e) => e.preventDefault()}
className="text-destructive focus:text-destructive"
>
Remove
</DropdownMenuItem>
@ -607,7 +607,7 @@ function MemberRow({
</AlertDialogContent>
</AlertDialog>
)}
<DropdownMenuSeparator className="dark:bg-neutral-700" />
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={() =>
router.push(`/dashboard/${searchSpaceId}/settings?section=team-roles`)
@ -811,7 +811,7 @@ function CreateInviteDialog({
<Button
variant="outline"
className={cn(
"w-full justify-start text-left font-normal",
"w-full justify-start text-left font-normal bg-transparent",
!expiresAt && "text-muted-foreground"
)}
>
@ -833,7 +833,7 @@ function CreateInviteDialog({
</div>
</div>
<DialogFooter>
<Button variant="outline" onClick={handleClose}>
<Button variant="secondary" onClick={handleClose}>
Cancel
</Button>
<Button onClick={handleCreate} disabled={creating}>