fix(docs): codeblock correct theme (#1006)

In page /sdk and /api expecially, now the color of the Codeblock texts is working with the color theme of the page --------- Co-authored-by: HonzaTuron <[email protected]>
apify · May 16, 2024 · ed5a39b · ed5a39b
1 parent cac9ff3
commit ed5a39b
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/UiLibraryWrapper.tsx b/src/components/UiLibraryWrapper.tsx
@@ -2,15 +2,21 @@ import { UiDependencyProvider } from '@apify-packages/ui-library';
 import Link from '@docusaurus/Link';
 import { useColorMode } from '@docusaurus/theme-common';
 import useBaseUrl from '@docusaurus/useBaseUrl';
-import React, { PropsWithChildren } from 'react';
+import React, { PropsWithChildren, useEffect, useState } from 'react';
 
 export default function UiLibraryWrapper({ children }: PropsWithChildren) {
+    const [themeIsDark, setThemeIsDark] = useState(true);
+    const isDark = useColorMode().isDarkTheme;
+    useEffect(() => {
+        setThemeIsDark(isDark);
+    }, [isDark]);
+
     return (
         <UiDependencyProvider dependencies={{
             InternalLink: (props) => <Link {...props} />,
             windowLocationHost: useBaseUrl(''),
             isHrefTrusted: () => true,
-            uiTheme: useColorMode().isDarkTheme ? 'DARK' : 'LIGHT',
+            uiTheme: themeIsDark ? 'DARK' : 'LIGHT',
         }}>{children}</UiDependencyProvider>
     );
 }