diff --git a/src/theme/DocItem/TOC/Desktop/index.js b/src/theme/DocItem/TOC/Desktop/index.js index bf7d4daedaa..6c246dbac21 100644 --- a/src/theme/DocItem/TOC/Desktop/index.js +++ b/src/theme/DocItem/TOC/Desktop/index.js @@ -7,6 +7,8 @@ import IconClose from '@theme/Icon/Close'; import styles from './styles.module.css' import Feedback from '../../../../components/Feedback'; +const AD_DATA_ENDPOINT = 'https://cms.clickhouse-dev.com:1337/api/docs-ad' + export default function DocItemTOCDesktop() { const {toc, frontMatter} = useDoc(); const [isClosed, setClosed] = useState(() => { @@ -15,6 +17,63 @@ export default function DocItemTOCDesktop() { } return false; }); + const [title, setTitle] = useState(null); + const [description, setDescription] = useState(null); + const [href, setHref] = useState(null); + const [label, setLabel] = useState(null); + const [tag, setTag] = useState(null); + + useEffect(() => { + if (typeof window !== 'undefined') { + const fetchAdData = async () => { + const cacheKey = 'doc-cloud-card-banner-attributes'; + let attributes = {}; + + // Get cached ad data from session + if (window.sessionStorage.getItem(cacheKey)) { + try { + attributes = JSON.parse(window.sessionStorage.getItem(cacheKey)); + } catch (e) { + console.log('Failed to parse cached ad attributes', e); + } + } + + // Fetch new ad data if not in session + if ( + !attributes + || !attributes.hasOwnProperty('title') + || !attributes.hasOwnProperty('description') + || !attributes.hasOwnProperty('href') + || !attributes.hasOwnProperty('label') + || !attributes.hasOwnProperty('tag') + ) { + try { + const response = await window.fetch(AD_DATA_ENDPOINT); + const { data } = await response.json(); + + if (data && typeof data === 'object' && data.hasOwnProperty('attributes')) { + attributes = data.attributes; + window.sessionStorage.setItem(cacheKey, JSON.stringify(attributes)); + } + } catch (e) { + console.log('Failed to fetch ad content', e); + } + } + + return attributes; + } + + // Set ad states + fetchAdData().then(attributes => { + setTitle(attributes?.title || null); + setDescription(attributes?.description || null); + setHref(attributes?.href || null); + setLabel(attributes?.label || null); + setTag(attributes?.tag || null) + }) + + } + }, [setTitle, setDescription, setHref, setLabel, setTag]); return (
Separation of storage and compute, automatic scaling, built-in SQL console, and lots more. $300 in free credits when signing up.
- Try it for Free +{description}
+ {label}