export default function AnnouncementBar()

in src/theme/AnnouncementBar/index.tsx [11:41]


export default function AnnouncementBar(): React.ReactElement | null {
    const { announcementBar } = useThemeConfig();
    const { isActive, close } = useAnnouncementBar();
    const { i18n } = useDocusaurusContext();
    const { currentLocale } = i18n;
    const location = useLocation();
    const { backgroundColor, textColor, isCloseable, content } = announcementBar!;
    
    if (
        !isActive ||
        (currentLocale === 'en' && !JSON.parse(content).en) ||
        (currentLocale === 'zh-CN' && !JSON.parse(content).zh)
    ) {
        return null;
    }
    return (
        <div
            className={styles.announcementBar}
            style={
                location.pathname.startsWith('/zh-CN/docs') || location.pathname.startsWith('/docs')
                    ? { backgroundColor, color: textColor }
                    : { display: 'none' }
            }
            role="banner"
        >
            {isCloseable && <div className={styles.announcementBarPlaceholder} />}
            <AnnouncementBarContent className={styles.announcementBarContent} />
            {isCloseable && <AnnouncementBarCloseButton onClick={close} className={styles.announcementBarClose} />}
        </div>
    );
}