Add llm buttons only if we render html - v3

Author: patrikbraborec

apify-docs-theme/src/theme/Layout/index.jsx

@@ -10,6 +10,19 @@ export default function LayoutWrapper(props) {
     const { options: { subNavbar } } = usePluginData('@apify/docs-theme');
     const baseUrl = useBaseUrl('/');
     const currentPath = useLocation().pathname.replace(new RegExp(`^${baseUrl}`), '');
+    const isMarkdownView = currentPath.endsWith('.md');
+
+    // Add data attribute to HTML element when on markdown view
+    React.useEffect(() => {
+        if (typeof document !== 'undefined') {
+            const htmlElement = document.documentElement;
+            if (isMarkdownView) {
+                htmlElement.setAttribute('data-markdown-view', 'true');
+            } else {
+                htmlElement.removeAttribute('data-markdown-view');
+            }
+        }
+    }, [isMarkdownView]);
 
     return (
         <>

src/components/LLMButtons/index.tsx

@@ -1,18 +1,10 @@
-import { useLocation } from '@docusaurus/router';
 import React from 'react';
 
 import CopyForLLM from './CopyForLLM';
 import styles from './styles.module.css';
 import ViewAsMarkdown from './ViewAsMarkdown';
 
 export default function LLMButtons() {
-    const location = useLocation();
-
-    // Don't render LLMButtons if we're on a markdown view
-    if (location.pathname.endsWith('.md')) {
-        return null;
-    }
-
     return (
         <div className={styles.llmButtonsContainer}>
             <ViewAsMarkdown />

src/components/LLMButtons/styles.module.css

@@ -6,6 +6,11 @@
     margin-bottom: calc(var(--ifm-h1-vertical-rhythm-bottom) * var(--ifm-leading));
 }
 
+/* Hide LLMButtons on markdown pages (URLs ending with .md) */
+html[data-markdown-view="true"] .llmButtonsContainer {
+    display: none !important;
+}
+
 .llmButtonsSeparator {
     width: 1px;
     height: 16px;