Change to JS again

src/plugins/docs/index.ts → src/plugins/docs/index.mjs

@@ -1,56 +1,14 @@
-import type { LoadContext, Plugin } from '@docusaurus/types';
 import docsPlugin, {
   validateOptions as docsValidateOptions,
-  PropVersionMetadata,
 } from '@docusaurus/plugin-content-docs';
 import fs from 'fs/promises';
 import path from 'path';
-import {
-  Options as DocsOptions,
-  PluginOptions as DocsPluginOptions,
-  LoadedContent as DocsLoadedContent,
-  DocMetadata as DocsDocMetadata,
-} from '@docusaurus/plugin-content-docs';
-import {
-  OptionValidationContext as DocsOptionValidationContext,
-  Validate,
-} from '@docusaurus/types';
-
-export type DocMetadata = DocsDocMetadata & {
-  bannerContent?: string;
-};
-
-export type LoadedContent = DocsLoadedContent & {
-  bannerContent?: string;
-};
-
-export type PluginOptions = DocsPluginOptions & {
-  globalSidebars: string[];
-  bannerPath?: string;
-};
 
-export type Options = Partial<PluginOptions>;
-
-export type OptionValidationContext = {
-  // Docusaurus does not export their schemas for us to use,
-  // so we just pass validate function on to the docs plugin validation.
-  validate: Validate<DocsOptions, DocsPluginOptions>;
-  options: PluginOptions;
-};
-
-declare module '@docusaurus/plugin-content-docs' {
-  export function validateOptions(
-    arg: DocsOptionValidationContext<DocsOptions, DocsPluginOptions>,
-  ): DocsPluginOptions;
-}
-export default async function pluginDocs(
-  context: LoadContext,
-  options: PluginOptions,
-): Promise<Plugin<LoadedContent>> {
+export default async function pluginDocs(context, options) {
   // Destructure to separate the Docusaurus docs plugin options
   // and initialize the Docusaurus docs plugin to wrap.
   const { bannerPath, globalSidebars, ...docsOptions } = options;
-  const plugin = await docsPlugin(context, docsOptions);
+  const plugin = await docsPlugin.default(context, docsOptions);
 
   return {
     ...plugin,
@@ -92,9 +50,9 @@ export default async function pluginDocs(
       const { bannerContent, ...docsContent } = content;
       const globalSidebarEntries = [];
 
-      const createData = async (name: string, data: string) => {
+      const createData = async (name, data) => {
         // Hook into the `createData` call to extract the sidebars we need.
-        const versionMetadata = JSON.parse(data) as PropVersionMetadata;
+        const versionMetadata = JSON.parse(data);
         if (versionMetadata.docsSidebars) {
           // We can do this, because all `createData` calls are assured
           // to resolve before `setGlobalData` is called.
@@ -117,7 +75,7 @@ export default async function pluginDocs(
         );
       };
 
-      const setGlobalData = (data: object) => {
+      const setGlobalData = (data) => {
         actions.setGlobalData({
           ...data,
           globalSidebars: Object.fromEntries(globalSidebarEntries),
@@ -137,10 +95,7 @@ export default async function pluginDocs(
   };
 }
 
-export function validateOptions({
-  validate,
-  options,
-}: OptionValidationContext): PluginOptions {
+export function validateOptions({ validate, options }) {
   const { bannerPath, globalSidebars = [], ...docsOptions } = options;
   return {
     ...docsValidateOptions({ validate, options: docsOptions }),

src/plugins/docs/types.d.ts

@@ -0,0 +1,38 @@
+import {
+  Options as DocsOptions,
+  PluginOptions as DocsPluginOptions,
+  LoadedContent as DocsLoadedContent,
+  DocMetadata as DocsDocMetadata,
+} from '@docusaurus/plugin-content-docs';
+import {
+  OptionValidationContext as DocsOptionValidationContext,
+  Validate,
+} from '@docusaurus/types';
+
+export type DocMetadata = DocsDocMetadata & {
+  bannerContent?: string;
+};
+
+export type LoadedContent = DocsLoadedContent & {
+  bannerContent?: string;
+};
+
+export type PluginOptions = DocsPluginOptions & {
+  globalSidebars: string[];
+  bannerPath?: string;
+};
+
+export type Options = Partial<PluginOptions>;
+
+export type OptionValidationContext = {
+  // Docusaurus does not export their schemas for us to use,
+  // so we just pass validate function on to the docs plugin validation.
+  validate: Validate<DocsOptions, DocsPluginOptions>;
+  options: PluginOptions;
+};
+
+declare module '@docusaurus/plugin-content-docs' {
+  export function validateOptions(
+    arg: DocsOptionValidationContext<DocsOptions, DocsPluginOptions>,
+  ): DocsPluginOptions;
+}

src/plugins/tutorial/index.mjs

@@ -0,0 +1,19 @@
+export default function pluginTutorial(options) {
+  return {
+    name: '@iota-wiki/plugin-tutorial',
+    async contentLoaded({ actions }) {
+      actions.setGlobalData(options);
+    },
+  };
+}
+
+export function validateOptions({ options: userOptions }) {
+  const id = userOptions.title.normalize().toLowerCase().replace(/\W/, '-');
+
+  const defaultOptions = {
+    id,
+    route: id,
+  };
+
+  return Object.assign(defaultOptions, userOptions);
+}

src/plugins/tutorial/types.d.ts

@@ -0,0 +1,15 @@
+export interface Options {
+  title: string;
+  description: string;
+  tags: string[];
+  source?: string;
+  preview?: string;
+}
+
+export interface DefaultOptions {
+  id: string;
+  route: string;
+}
+
+export type UserOptions = Options & Partial<DefaultOptions>;
+export type NormalizedOptions = Options & DefaultOptions;

src/theme/DocBanner/index.tsx

@@ -1,10 +1,11 @@
 import React from 'react';
 import { useDoc } from '@docusaurus/theme-common/internal';
-import { DocMetadata } from '../../plugins/docs';
-import ReactMarkdown from 'react-markdown';
+import type { DocMetadata } from '../../plugins/docs/types.d.ts';
 import './styles.css';
 
 export default function DocBanner() {
+  const ReactMarkdown = require('react-markdown');
+
   const { bannerContent } = useDoc().metadata as DocMetadata;
 
   if (!bannerContent) return null;

src/utils/config.js

@@ -1,7 +1,6 @@
 const path = require('path');
 const defaultSettings = require('../common/defaultContentPlugin');
 const fs = require('fs');
-const pluginDocs = require('../plugins/docs');
 
 /**
  * Merges multiple configuration objects into one object.
@@ -113,6 +112,7 @@ async function globStatic(pattern, cwd = __dirname) {
  * @param {import('@docusaurus/plugin-content-docs').Options} options
  */
 async function create_doc_plugin({ ...options }) {
+  const pluginDocs = (await import('../plugins/docs/index.mjs')).default;
   const setting = await defaultSettings();
 
   // Check if options has a rehypePlugin array

src/utils/pluginConfigGenerators.js

@@ -19,6 +19,8 @@ function findMainVersion(plugin, badge = MAIN_BADGE) {
  */
 function generatePluginConfig(pluginConfig, basePath) {
   return pluginConfig.flatMap((doc) => {
+    const mainVersion = findMainVersion(doc);
+
     return doc.versions.map((version) => {
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
       const { label, badges, ...rest } = version;