Merge pull request #23660 from storybookjs/replace-indexers

Core, Server, Addon-docs: Replace story indexers with new API
storybookjs · Aug 2, 2023 · 2952a90 · 2952a90
2 parents afc9fab + f5a249f
commit 2952a90
Show file tree

Hide file tree

Showing 18 changed files with 380 additions and 206 deletions.
diff --git a/code/addons/docs/src/preset.ts b/code/addons/docs/src/preset.ts
@@ -3,7 +3,7 @@ import remarkSlug from 'remark-slug';
 import remarkExternalLinks from 'remark-external-links';
 import { dedent } from 'ts-dedent';
 
-import type { DocsOptions, Options, StorybookConfig, StoryIndexer } from '@storybook/types';
+import type { DocsOptions, Indexer, Options, StorybookConfig } from '@storybook/types';
 import type { CsfPluginOptions } from '@storybook/csf-plugin';
 import type { JSXOptions, CompileOptions } from '@storybook/mdx2-csf';
 import { global } from '@storybook/global';
@@ -129,23 +129,35 @@ async function webpack(
   return result;
 }
 
-const storyIndexers: StorybookConfig['storyIndexers'] = (existingIndexers) => {
-  const mdxIndexer: StoryIndexer['indexer'] = async (fileName, opts) => {
+export const createStoriesMdxIndexer = (legacyMdx1?: boolean): Indexer => ({
+  test: /(stories|story)\.mdx$/,
+  index: async (fileName, opts) => {
     let code = (await fs.readFile(fileName, 'utf-8')).toString();
-    const { compile } = global.FEATURES?.legacyMdx1
+    const { compile } = legacyMdx1
       ? await import('@storybook/mdx1-csf')
       : await import('@storybook/mdx2-csf');
     code = await compile(code, {});
-    return loadCsf(code, { ...opts, fileName }).parse();
-  };
-  return [
-    {
-      test: /(stories|story)\.mdx$/,
-      indexer: mdxIndexer,
-    },
-    ...(existingIndexers || []),
-  ];
-};
+    const csf = loadCsf(code, { ...opts, fileName }).parse();
+
+    const { indexInputs, stories } = csf;
+
+    return indexInputs.map((input, index) => {
+      const docsOnly = stories[index].parameters?.docsOnly;
+      const tags = input.tags ? input.tags : [];
+      if (docsOnly) {
+        tags.push('stories-mdx-docsOnly');
+      }
+      // the mdx-csf compiler automatically adds the 'stories-mdx' tag to meta, here' we're just making sure it is always there
+      if (!tags.includes('stories-mdx')) {
+        tags.push('stories-mdx');
+      }
+      return { ...input, tags };
+    });
+  },
+});
+
+const indexers: StorybookConfig['indexers'] = (existingIndexers) =>
+  [createStoriesMdxIndexer(global.FEATURES?.legacyMdx1)].concat(existingIndexers || []);
 
 const docs = (docsOptions: DocsOptions) => {
   return {
@@ -164,9 +176,9 @@ export const addons: StorybookConfig['addons'] = [
  * something down the dependency chain is using typescript namespaces, which are not supported by rollup-plugin-dts
  */
 const webpackX = webpack as any;
-const storyIndexersX = storyIndexers as any;
+const indexersX = indexers as any;
 const docsX = docs as any;
 
 ensureReactPeerDeps();
 
-export { webpackX as webpack, storyIndexersX as storyIndexers, docsX as docs };
+export { webpackX as webpack, indexersX as indexers, docsX as docs };
diff --git a/code/lib/cli/src/generators/SERVER/index.ts b/code/lib/cli/src/generators/SERVER/index.ts
@@ -3,7 +3,7 @@ import type { Generator } from '../types';
 
 const generator: Generator = async (packageManager, npmOptions, options) => {
   await baseGenerator(packageManager, npmOptions, options, 'server', {
-    extensions: ['json'],
+    extensions: ['json', 'yaml', 'yml'],
   });
 };
 

diff --git a/code/lib/core-server/package.json b/code/lib/core-server/package.json
@@ -98,6 +98,7 @@
     "ws": "^8.2.3"
   },
   "devDependencies": {
+    "@storybook/addon-docs": "workspace:*",
     "@types/compression": "^1.7.0",
     "@types/ip": "^1.1.0",
     "@types/node-fetch": "^2.5.7",

diff --git a/code/lib/core-server/src/presets/common-preset.ts b/code/lib/core-server/src/presets/common-preset.ts
@@ -11,12 +11,12 @@ import {
 import type {
   CLIOptions,
   CoreConfig,
+  Indexer,
   Options,
   PresetPropertyFn,
   StorybookConfig,
-  StoryIndexer,
 } from '@storybook/types';
-import { loadCsf, printConfig, readConfig } from '@storybook/csf-tools';
+import { printConfig, readConfig, readCsf } from '@storybook/csf-tools';
 import { join } from 'path';
 import { dedent } from 'ts-dedent';
 import fetch from 'node-fetch';
@@ -194,20 +194,14 @@ export const features = async (
   legacyDecoratorFileOrder: false,
 });
 
-export const storyIndexers: StorybookConfig['storyIndexers'] = async (existingIndexers) => {
-  const csfIndexer: StoryIndexer['indexer'] = async (fileName, opts) => {
-    const code = (await readFile(fileName, 'utf-8')).toString();
-    return loadCsf(code, { ...opts, fileName }).parse();
-  };
-  return [
-    {
-      test: /(stories|story)\.(m?js|ts)x?$/,
-      indexer: csfIndexer,
-    },
-    ...(existingIndexers || []),
-  ];
+export const csfIndexer: Indexer = {
+  test: /\.stories\.(m?js|ts)x?$/,
+  index: async (fileName, options) => (await readCsf(fileName, options)).parse().indexInputs,
 };
 
+export const indexers: StorybookConfig['indexers'] = (existingIndexers) =>
+  [csfIndexer].concat(existingIndexers || []);
+
 export const frameworkOptions = async (
   _: never,
   options: Options

diff --git a/code/lib/core-server/src/utils/StoryIndexGenerator.deprecated.test.ts b/code/lib/core-server/src/utils/StoryIndexGenerator.deprecated.test.ts
@@ -93,6 +93,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -163,6 +164,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -307,6 +309,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -666,6 +669,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -792,6 +796,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -914,6 +919,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],
@@ -980,6 +986,7 @@ describe('StoryIndexGenerator with deprecated indexer API', () => {
                 "importPath": "./src/A.stories.js",
                 "name": "Story One",
                 "tags": Array [
+                  "component-tag",
                   "story-tag",
                   "story",
                 ],