Some checks are pending
E2E / Playwright e2e (push) Waiting to run
- Introduced turbopack alias for canvas in next.config.mjs. - Updated package.json scripts for development and branding tasks. - Added new dependencies for Tiptap extensions. - Implemented new demo layouts for agenda, contacts, drive, and mail applications. - Enhanced globals.css for improved theming and splash screen animations. - Added OAuth callback handling for drive mounts. - Updated layout components to integrate new demo shells and improve structure.
97 lines
2.4 KiB
TypeScript
97 lines
2.4 KiB
TypeScript
"use client"
|
|
|
|
import { LayoutGrid } from "lucide-react"
|
|
import { AgendaMark } from "@/components/suite/agenda-mark"
|
|
import type { AutomationDomain } from "@/lib/mail-automation/domains"
|
|
import { AUTOMATION_DOMAIN_LABELS } from "@/lib/mail-automation/domains"
|
|
import { suitePublicAsset } from "@/lib/suite/suite-public-asset"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export const AUTOMATION_DOMAIN_MARK_SRC: Record<AutomationDomain, string> = {
|
|
mail: suitePublicAsset("/ultimail-mark.svg"),
|
|
drive: suitePublicAsset("/ultidrive-mark.svg"),
|
|
contacts: suitePublicAsset("/contacts-mark.svg"),
|
|
agenda: suitePublicAsset("/agenda-mark.svg"),
|
|
}
|
|
|
|
export function AutomationDomainMark({
|
|
domain,
|
|
className,
|
|
alt,
|
|
}: {
|
|
domain: AutomationDomain
|
|
className?: string
|
|
alt?: string
|
|
}) {
|
|
const label = alt ?? AUTOMATION_DOMAIN_LABELS[domain]
|
|
|
|
if (domain === "agenda") {
|
|
return <AgendaMark className={cn("shrink-0 object-contain", className)} alt={label} />
|
|
}
|
|
|
|
return (
|
|
<img
|
|
src={AUTOMATION_DOMAIN_MARK_SRC[domain]}
|
|
alt={label}
|
|
className={cn("shrink-0 object-contain", className)}
|
|
draggable={false}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export function AutomationDomainMarks({
|
|
domains,
|
|
className,
|
|
markClassName = "size-5",
|
|
}: {
|
|
domains: AutomationDomain[]
|
|
className?: string
|
|
markClassName?: string
|
|
}) {
|
|
if (domains.length === 0) return null
|
|
return (
|
|
<div className={cn("flex shrink-0 items-center gap-1", className)}>
|
|
{domains.map((domain) => (
|
|
<AutomationDomainMark
|
|
key={domain}
|
|
domain={domain}
|
|
className={markClassName}
|
|
alt=""
|
|
/>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function AutomationDomainFilterTab({
|
|
active,
|
|
onClick,
|
|
domain,
|
|
label,
|
|
}: {
|
|
active: boolean
|
|
onClick: () => void
|
|
domain: AutomationDomain | "all"
|
|
label: string
|
|
}) {
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={onClick}
|
|
className={cn(
|
|
"inline-flex items-center gap-2 rounded-md border px-2.5 py-1.5 text-xs transition-colors",
|
|
active
|
|
? "border-primary bg-primary/10 text-primary"
|
|
: "border-border bg-background text-muted-foreground hover:bg-muted"
|
|
)}
|
|
>
|
|
{domain === "all" ? (
|
|
<LayoutGrid className="size-4 shrink-0 opacity-80" aria-hidden />
|
|
) : (
|
|
<AutomationDomainMark domain={domain} className="size-4" alt="" />
|
|
)}
|
|
<span>{label}</span>
|
|
</button>
|
|
)
|
|
}
|