@apify/docs-theme 1.0.22 → 1.0.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apify/docs-theme",
-  "version": "1.0.22",
+  "version": "1.0.24",
   "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,19 +1,28 @@
 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 findPathToParent(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');
 }
 
+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(
     context,
     options,
@@ -29,30 +38,24 @@ function theme(
         getTypeScriptThemePath() {
             return '../src/theme';
         },
+        async loadContent() {
+            try {
+                const docsPath = findPathToParent('docs');
+                const changelogPath = findPathToParent('CHANGELOG.md');
+                if (fs.existsSync(path.join(docsPath, 'changelog.md') || fs.statSync(
+                    path.join(docsPath, 'changelog.md')).mtime >= fs.statSync(changelogPath).mtime,
+                )) return;
+                fs.copyFileSync(changelogPath, 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,
             });
-
-            try {
-                const changelog = fs.readFileSync(findChangelogPath(), 'utf8');
-                const dataPath = await actions.createData(
-                    'changelog.json',
-                    JSON.stringify(changelog),
-                );
-
-                actions.addRoute({
-                    path: path.join(context.baseUrl, 'changelog'),
-                    component: require.resolve('./pages/ChangelogPage.jsx'),
-                    exact: true,
-                    modules: {
-                        changelog: dataPath,
-                    },
-                });
-            } catch (e) {
-                console.warn(`Changelog page could not be initialized: ${e.message}`);
-            }
         },
         getClientModules() {
             return [

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' }}>
-                    <div style={{ flexDirection: 'column' }} className='theme-doc-markdown markdown col--9'>
-                        <ReactMarkdown
-                            remarkPlugins={[remarkSlug]}
-                            rehypePlugins={[
-                                [rehypeHighlight,
-                                    {
-                                        languages: { dockerfile },
-                                        ignoreMissing: true,
-                                    },
-                                ]]}
-                        >
-                            {changelog}
-                        </ReactMarkdown>
-                    </div>
-                    <div 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' style={{ margin: 'auto' }}>
-                <TOCCollapsible
-                    {...{
-                        toc,
-                        minHeadingLevel: 1,
-                    }}
-                />
-                <div style={{ flexDirection: 'column' }} className='theme-doc-markdown markdown'>
-                    <ReactMarkdown
-                        remarkPlugins={[remarkSlug]}
-                    >
-                        {changelog}
-                    </ReactMarkdown>
-                </div>
-            </div>
-        </Layout>
-    );
-}