Function NotificationBar

frontend/src/App.tsx:58–209

()

    `notification_bar_dismissed_persistent_${notificationBarRevisionKey(config)}`;

function NotificationBar() {
    const { i18n } = useTranslation();
    const isChinese = i18n.language?.startsWith('zh');
    const [config, setConfig] = useState<NotificationBarConfig | null>(null);
    const [dismissed, setDismissed] = useState(false);
    const [showDismissMenu, setShowDismissMenu] = useState(false);
    
    const textRef = useRef<HTMLSpanElement>(null);
    const containerRef = useRef<HTMLDivElement>(null);
    const dismissMenuRef = useRef<HTMLDivElement>(null);
    const [isMarquee, setIsMarquee] = useState(false);

    useEffect(() => {
        fetch('/api/enterprise/system-settings/notification_bar/public')
            .then(r => r.ok ? r.json() : null)
            .then(d => { if (d) setConfig(d); })
            .catch(() => { });
    }, []);

    useEffect(() => {
        const handleUpdate = (event: Event) => {
            const next = (event as NotificationBarUpdateEvent).detail;
            if (!next) return;
            setConfig(next);
            setShowDismissMenu(false);
            if (next.text) {
                const persistentKey = notificationBarPersistentDismissKey(next);
                const sessionKey = notificationBarSessionDismissKey(next);
                setDismissed(!!localStorage.getItem(persistentKey) || !!sessionStorage.getItem(sessionKey));
            } else {
                setDismissed(false);
            }
            if (!next.enabled || !next.text) {
                document.body.classList.remove(notificationBarClass);
            }
        };

        window.addEventListener('notification-bar-updated', handleUpdate);
        return () => window.removeEventListener('notification-bar-updated', handleUpdate);
    }, []);

    // Check sessionStorage for dismissal (keyed by text so new messages re-show)
    useEffect(() => {
        if (config?.text) {
            const persistentKey = notificationBarPersistentDismissKey(config);
            const sessionKey = notificationBarSessionDismissKey(config);
            setDismissed(!!localStorage.getItem(persistentKey) || !!sessionStorage.getItem(sessionKey));
        }
    }, [config?.text, config?.updated_at]);

    useEffect(() => {
        if (!showDismissMenu) return;
        const handleClickOutside = (event: MouseEvent) => {
            const target = event.target as Node;
            if (dismissMenuRef.current?.contains(target)) return;
            setShowDismissMenu(false);
        };
        document.addEventListener('mousedown', handleClickOutside);