"use client" import { useEffect, useRef, type CSSProperties } from "react" import { Printer, ExternalLink } from "lucide-react" import { Button } from "@/components/ui/button" import { Tooltip, TooltipContent, TooltipTrigger, } from "@/components/ui/tooltip" import { cn } from "@/lib/utils" import type { ApiMessageSummary } from "@/lib/api/types" import type { FolderTreeNode, LabelRowItem } from "@/lib/sidebar-nav-data" import { MailLabelPillStrip } from "@/components/gmail/mail-label-pills" import { MAIL_ICON_BTN, MAIL_PREVIEW_SUBJECT_HEADER_CLASS, MAIL_TOOLTIP_CONTENT_CLASS, } from "@/lib/mail-chrome-classes" import { useTheme } from "next-themes" import { emailPreviewSubjectCss, } from "@/lib/email-preview-dark-styles" const EMAIL_PREVIEW_IFRAME_STYLE: CSSProperties = { display: "block", background: "transparent", } function documentIsDark(): boolean { return document.documentElement.classList.contains("dark") } function SandboxedSubject({ text }: { text: string }) { const iframeRef = useRef(null) const { resolvedTheme } = useTheme() useEffect(() => { const iframe = iframeRef.current if (!iframe) return const doc = iframe.contentDocument if (!doc) return const isDark = documentIsDark() doc.open() doc.write(` ${text.replace(//g, ">")} `) doc.close() }, [text, resolvedTheme]) return (