@apify/docs-theme 1.0.23 → 1.0.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apify/docs-theme",
-  "version": "1.0.23",
+  "version": "1.0.25",
   "description": "",
   "main": "./src/index.js",
   "files": [
@@ -17,15 +17,7 @@
   "license": "ISC",
   "dependencies": {
     "@docusaurus/theme-common": "^2.2.0",
-    "@vcarl/remark-headings": "^0.1.0",
     "babel-loader": "^9.1.0",
-    "highlight.js": "^11.7.0",
-    "prism-react-renderer": "^1.3.5",
-    "react-markdown": "^8.0.4",
-    "rehype-highlight": "^6.0.0",
-    "remark-parse": "^10.0.1",
-    "remark-slug": "^7.0.1",
-    "remark-stringify": "^10.0.2",
-    "unified": "^10.1.2"
+    "prism-react-renderer": "^1.3.5"
   }
 }

package/src/theme.js

@@ -1,17 +1,32 @@
 const path = require('path');
 const fs = require('fs');
 
-function findChangelogPath() {
-    let changelogPath = __dirname;
-    while (changelogPath !== path.join(changelogPath, '..')) {
-        const filePath = path.join(changelogPath, 'CHANGELOG.md');
+function findPathInParent(endPath) {
+    let parentPath = __dirname;
+    while (parentPath !== path.join(parentPath, '..')) {
+        const filePath = path.join(parentPath, endPath);
         if (fs.existsSync(filePath)) return filePath;
-        changelogPath = path.join(changelogPath, '..');
+        parentPath = path.join(parentPath, '..');
     }
-    const filePath = path.join(changelogPath, 'CHANGELOG.md');
+    const filePath = path.join(parentPath, endPath);
     if (fs.existsSync(filePath)) return filePath;
 
-    throw new Error('Could not find CHANGELOG.md in any parent directory');
+    return false;
+}
+
+function findPathInParentOrThrow(endPath) {
+    const filePath = findPathInParent(endPath);
+    if (!filePath) throw new Error(`Could not find ${endPath} in any parent directory`);
+    return filePath;
+}
+
+function updateChangelog(changelogPath) {
+    const changelog = fs.readFileSync(changelogPath, 'utf-8');
+    const updated = `---
+title: Changelog
+---
+${changelog.replaceAll(/\n#[^#]/g, '\n## ')}`;
+    fs.writeFileSync(changelogPath, updated, 'utf-8');
 }
 
 function theme(
@@ -29,31 +44,36 @@ function theme(
         getTypeScriptThemePath() {
             return '../src/theme';
         },
-        async contentLoaded({ actions }) {
-            const { setGlobalData } = actions;
-            setGlobalData({
-                options,
-            });
-
+        async loadContent() {
             try {
-                const changelog = fs.readFileSync(findChangelogPath(), 'utf8');
-                const dataPath = await actions.createData(
-                    'changelog.json',
-                    JSON.stringify(changelog),
-                );
+                const changelogPath = findPathInParentOrThrow('CHANGELOG.md');
+                const versioned = findPathInParent('website/versioned_docs');
+
+                const pathsToCopyChangelog = [
+                    findPathInParentOrThrow('docs'),
+                    ...(versioned
+                        ? fs.readdirSync(versioned).map((version) => path.join(versioned, version))
+                        : []
+                    ),
+                ];
 
-                actions.addRoute({
-                    path: path.join(context.baseUrl, 'changelog'),
-                    component: require.resolve('./pages/ChangelogPage.jsx'),
-                    exact: true,
-                    modules: {
-                        changelog: dataPath,
-                    },
-                });
+                for (const docsPath of pathsToCopyChangelog) {
+                    if (fs.existsSync(path.join(docsPath, 'changelog.md')) && fs.statSync(
+                        path.join(docsPath, 'changelog.md')).mtime >= fs.statSync(changelogPath).mtime) continue;
+                    fs.copyFileSync(changelogPath, path.join(docsPath, 'changelog.md'));
+                    console.log(`copied ${changelogPath} to ${path.join(docsPath, 'changelog.md')}`);
+                    updateChangelog(path.join(docsPath, 'changelog.md'));
+                }
             } catch (e) {
                 console.warn(`Changelog page could not be initialized: ${e.message}`);
             }
         },
+        async contentLoaded({ actions }) {
+            const { setGlobalData } = actions;
+            setGlobalData({
+                options,
+            });
+        },
         getClientModules() {
             return [
                 require.resolve('./theme/custom.css'),

package/src/pages/ChangelogPage.jsx

@@ -1,101 +0,0 @@
-import React from 'react';
-import Layout from '@theme/Layout';
-import ReactMarkdown from 'react-markdown';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-import TOC from '@theme/TOC';
-import TOCCollapsible from '@theme/TOCCollapsible';
-import { useWindowSize } from '@docusaurus/theme-common';
-
-import { unified } from 'unified';
-import remarkSlug from 'remark-slug';
-import remarkParse from 'remark-parse';
-import remarkStringify from 'remark-stringify';
-import remarkHeadings from '@vcarl/remark-headings';
-import rehypeHighlight from 'rehype-highlight';
-import dockerfile from 'highlight.js/lib/languages/dockerfile';
-
-export default function ChangelogPage({ changelog }) {
-    const windowSize = useWindowSize();
-
-    const { data: { headings: tocRaw } } = unified()
-        .use(remarkParse)
-        .use(remarkStringify)
-        .use(remarkSlug)
-        .use(remarkHeadings)
-        .processSync(changelog);
-
-    const toc = tocRaw.map((x) => ({
-        value: x.value,
-        level: x.depth,
-        id: x.data.id,
-    }));
-
-    return (windowSize === 'desktop' || windowSize === 'ssr') ? (
-        <ChangelogPageDesktop {...{ changelog, toc }} />
-    ) : <ChangelogPageMobile {...{ changelog, toc }}/>;
-}
-
-function ChangelogPageDesktop({ changelog, toc }) {
-    const { siteConfig } = useDocusaurusContext();
-
-    return (
-        <Layout
-            title={`Changelog · ${siteConfig.tagline}`}
-            description={siteConfig.tagline}
-        >
-            <div className='docPage docMainContainer' style={{ margin: 'auto' }}>
-                <div className="row" style={{ flexWrap: 'nowrap', margin: '10px' }}>
-                    <div style={{ flexDirection: 'column', flex: 3 }} className='theme-doc-markdown markdown col--9'>
-                        <ReactMarkdown
-                            remarkPlugins={[remarkSlug]}
-                            rehypePlugins={[
-                                [rehypeHighlight,
-                                    {
-                                        languages: { dockerfile },
-                                        ignoreMissing: true,
-                                    },
-                                ]]}
-                        >
-                            {changelog}
-                        </ReactMarkdown>
-                    </div>
-                    <div style={{ flex: 1 }} className="col--3">
-                        <TOC
-                            {...{
-                                toc,
-                                minHeadingLevel: 1,
-                            }}
-                        />
-                    </div>
-                </div>
-            </div>
-        </Layout>
-    );
-}
-
-function ChangelogPageMobile({ changelog, toc }) {
-    const { siteConfig } = useDocusaurusContext();
-
-    return (
-        <Layout
-            title={`Changelog · ${siteConfig.tagline}`}
-            description={siteConfig.tagline}
-        >
-            <div className='col apiItemCol' >
-                <TOCCollapsible
-                    {...{
-                        toc,
-                        minHeadingLevel: 1,
-                    }}
-                />
-                <div style={{ flexDirection: 'column' }} className='theme-doc-markdown markdown'>
-                    <ReactMarkdown
-                        remarkPlugins={[remarkSlug]}
-                    >
-                        {changelog}
-                    </ReactMarkdown>
-                </div>
-            </div>
-        </Layout>
-    );
-}