ultisuite-client/components/suite/header-account-actions.tsx
R3D347HR4Y 6ec95262af Add OnlyOffice integration and update project configurations
- Updated .env.example to include configuration for OnlyOffice Document Server.
- Modified the workspace configuration to remove the drive-suite path.
- Adjusted TypeScript environment imports for consistency.
- Enhanced Next.js configuration to disable canvas in Webpack.
- Updated package.json to include new dependencies for OnlyOffice and PDF.js.
- Added global styles for OnlyOffice theme integration in the CSS.
- Created new layout and page components for the Drive feature, including public sharing and editing functionalities.
- Updated metadata handling across various layouts to reflect the new app structure.
2026-06-07 15:49:21 +02:00

110 lines
3.3 KiB
TypeScript

"use client"
import { useEffect, useRef, useState } from "react"
import Link from "next/link"
import { toast } from "sonner"
import { Icon } from "@iconify/react"
import { HelpCircle } from "lucide-react"
import { AccountAvatar } from "@/components/suite/account-avatar"
import { AccountSwitcherDropdown } from "@/components/suite/account-switcher-dropdown"
import { SuiteFavoritesMenu } from "@/components/suite/suite-favorites-menu"
import { Button } from "@/components/ui/button"
import { useChromeIdentity } from "@/lib/hooks/use-chrome-identity"
import { SUITE_ICON_BTN } from "@/lib/suite/suite-chrome-classes"
import { cn } from "@/lib/utils"
const HEADER_ICON_BTN_CLASS = cn(
"rounded-full",
SUITE_ICON_BTN,
"hover:text-accent-foreground",
)
interface HeaderAccountActionsProps {
className?: string
settingsHref?: string
onSettingsClick?: () => void
}
export function HeaderAccountActions({
className,
settingsHref,
onSettingsClick,
}: HeaderAccountActionsProps) {
const [accountMenuOpen, setAccountMenuOpen] = useState(false)
const accountMenuRef = useRef<HTMLDivElement>(null)
const identity = useChromeIdentity()
useEffect(() => {
const notice = sessionStorage.getItem("ulti_account_notice")
if (notice === "same") {
sessionStorage.removeItem("ulti_account_notice")
toast.message("Vous utilisez déjà ce compte Ulti.")
}
}, [])
return (
<div className={cn("flex shrink-0 items-center gap-1", className)}>
<Button
variant="ghost"
size="icon"
className={cn("hidden sm:inline-flex", HEADER_ICON_BTN_CLASS)}
aria-label="Aide"
>
<HelpCircle className="size-6 shrink-0" aria-hidden />
</Button>
<Button
variant="ghost"
size="icon"
className={HEADER_ICON_BTN_CLASS}
aria-label="Réglages"
{...(settingsHref
? { asChild: true }
: { onClick: onSettingsClick })}
>
{settingsHref ? (
<Link href={settingsHref}>
<Icon icon="mdi:cog-outline" className="size-6 shrink-0" aria-hidden />
</Link>
) : (
<Icon icon="mdi:cog-outline" className="size-6 shrink-0" aria-hidden />
)}
</Button>
<SuiteFavoritesMenu
iconButtonClass={HEADER_ICON_BTN_CLASS}
onOpen={() => setAccountMenuOpen(false)}
/>
<div className="relative ml-2" ref={accountMenuRef}>
<Button
variant="ghost"
size="icon-lg"
className="size-11 overflow-hidden rounded-full p-0"
aria-label={`Compte : ${identity?.email ?? "Utilisateur"}`}
aria-expanded={accountMenuOpen}
aria-haspopup="dialog"
onClick={() => {
setAccountMenuOpen(!accountMenuOpen)
}}
>
{identity ? (
<AccountAvatar
account={{ name: identity.name, email: identity.email }}
size="md"
/>
) : (
<span className="flex size-10 items-center justify-center rounded-full bg-muted text-sm font-medium text-muted-foreground">
?
</span>
)}
</Button>
<AccountSwitcherDropdown
open={accountMenuOpen}
onOpenChange={setAccountMenuOpen}
containerRef={accountMenuRef}
/>
</div>
</div>
)
}