feat: enhance SuiteFavoritesMenu with settings link and icon integration
Some checks are pending
E2E / Playwright e2e (push) Waiting to run

- Added a settings button with a cog icon to the SuiteFavoritesMenu for quick access to mail settings.
- Updated button structure to improve layout and user interaction, maintaining accessibility standards.
- Retained the existing button for customizing favorites, ensuring functionality remains intact.
This commit is contained in:
R3D347HR4Y 2026-06-16 11:34:27 +02:00
parent b95948f980
commit 10d5215a8c

View File

@ -2,12 +2,14 @@
import { useEffect, useRef, useState } from "react"
import Link from "next/link"
import { Icon } from "@iconify/react"
import { LayoutGrid, Pencil } from "lucide-react"
import { Button } from "@/components/ui/button"
import {
SUITE_FAVORITE_APPS,
type FavoriteApp,
} from "@/lib/suite/favorite-apps"
import { MAIL_SETTINGS_BASE_PATH } from "@/lib/mail-settings/settings-nav"
import { SUITE_HEADER_DROPDOWN_CLASS, SUITE_ICON_BTN } from "@/lib/suite/suite-chrome-classes"
import { cn } from "@/lib/utils"
@ -160,6 +162,21 @@ export function SuiteFavoritesMenu({
<span className="text-lg font-normal text-foreground">
Vos favoris
</span>
<div className="flex items-center gap-1">
<Button
variant="ghost"
size="icon"
className={cn("h-8 w-8", iconButtonClass)}
aria-label="Réglages"
asChild
>
<Link
href={MAIL_SETTINGS_BASE_PATH}
onClick={() => setOpen(false)}
>
<Icon icon="mdi:cog-outline" className="size-5 shrink-0" aria-hidden />
</Link>
</Button>
<Button
variant="ghost"
size="icon"
@ -170,6 +187,7 @@ export function SuiteFavoritesMenu({
<Pencil className="h-4 w-4" />
</Button>
</div>
</div>
<div className="grid grid-cols-3 gap-1 p-3">
{SUITE_FAVORITE_APPS.map((app) => (
<FavoriteAppTile