Maintenance: Fix broken and outdated documentation links

code/core/assets/server/base-preview-body.html

@@ -93,7 +93,7 @@ <h1 id="error-message"></h1>
         <strong>Missing Context/Providers</strong>: You can use decorators to supply specific
         contexts or providers, which are sometimes necessary for components to render correctly. For
         detailed instructions on using decorators, please visit the
-        <a href="https://storybook.js.org/docs/react/writing-stories/decorators"
+        <a href="https://storybook.js.org/docs/writing-stories/decorators"
           >Decorators documentation</a
         >.
       </li>

code/core/src/common/presets.ts

@@ -198,7 +198,7 @@ const map =
       resolved = resolveAddonName(configDir, name, options);
     } catch (err) {
       logger.error(
-        `Addon value should end in /manager or /preview or /register OR it should be a valid preset https://storybook.js.org/docs/react/addons/writing-presets/\n${item}`
+        `Addon value should end in /manager or /preview or /register OR it should be a valid preset https://storybook.js.org/docs/addons/writing-presets/\n${item}`
       );
       return undefined;
     }

code/core/src/components/components/syntaxhighlighter/syntaxhighlighter.stories.tsx

@@ -187,10 +187,10 @@ export const Story = {
     const meta = {
       title: 'Example/Header',
       component: Header,
-      // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+      // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
       tags: ['autodocs'],
       parameters: {
-        // More on how to position stories at: https://storybook.js.org/docs/react/configure/story-layout
+        // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
         layout: 'fullscreen',
       },
     } satisfies Meta<typeof Header>;

code/core/src/core-server/utils/__tests__/remove-mdx-stories.test.ts

@@ -56,7 +56,7 @@ Your main configuration somehow does not contain a 'stories' field, or it resolv
 
 Please check your main configuration file and make sure it exports a 'stories' field that is not an empty array.
 
-More info: https://storybook.js.org/docs/react/faq#can-i-have-a-storybook-with-no-local-stories
+More info: https://storybook.js.org/docs/faq#can-i-have-a-storybook-with-no-local-stories
 ]
 `);
   });

code/core/src/csf-tools/CsfFile.ts

@@ -174,7 +174,7 @@ export class NoMetaError extends Error {
     super(dedent`
       CSF: ${message} ${formatLocation(ast, fileName)}
 
-      More info: https://storybook.js.org/docs/react/writing-stories#default-export
+      More info: https://storybook.js.org/docs/writing-stories#default-export
     `);
     this.name = this.constructor.name;
   }

code/core/src/manager/components/sidebar/RefIndicator.tsx

@@ -307,10 +307,7 @@ const ReadDocsMessage: FC = () => {
   const theme = useTheme();
 
   return (
-    <Message
-      href="https://storybook.js.org/docs/react/sharing/storybook-composition"
-      target="_blank"
-    >
+    <Message href="https://storybook.js.org/docs/sharing/storybook-composition" target="_blank">
       <DocumentIcon color={theme.color.green} />
       <div>
         <MessageTitle>Read Composition docs</MessageTitle>
@@ -348,14 +345,12 @@ const LoadingMessage: FC<{ url: string }> = ({ url }) => {
   );
 };
 
+// TODO: This is a temporary fix as the documentation link is not available with the 8.0 release, since the features it referenced were removed. See https://storybook.js.org/docs/7/sharing/storybook-composition#improve-your-storybook-composition for context.
 const PerformanceDegradedMessage: FC = () => {
   const theme = useTheme();
 
   return (
-    <Message
-      href="https://storybook.js.org/docs/react/sharing/storybook-composition#improve-your-storybook-composition"
-      target="_blank"
-    >
+    <Message href="https://storybook.js.org/docs/sharing/storybook-composition" target="_blank">
       <LightningIcon color={theme.color.gold} />
       <div>
         <MessageTitle>Reduce lag</MessageTitle>

code/core/src/preview-api/modules/preview-web/parseArgsParam.ts

@@ -115,7 +115,7 @@ export const parseArgsParam = (argsString: string): Args => {
     once.warn(dedent`
       Omitted potentially unsafe URL args.
 
-      More info: https://storybook.js.org/docs/react/writing-stories/args#setting-args-through-the-url
+      More info: https://storybook.js.org/docs/writing-stories/args#setting-args-through-the-url
     `);
     return acc;
   }, {} as Args);

code/core/src/preview-api/modules/store/args.ts

@@ -120,7 +120,7 @@ export const validateOptions = (args: Args, argTypes: ArgTypes): Args => {
       once.error(dedent`
         Invalid argType: '${key}.options' should be an array.
 
-        More info: https://storybook.js.org/docs/react/api/argtypes
+        More info: https://storybook.js.org/docs/api/arg-types
       `);
       return allowArg();
     }
@@ -129,7 +129,7 @@ export const validateOptions = (args: Args, argTypes: ArgTypes): Args => {
       once.error(dedent`
         Invalid argType: '${key}.options' should only contain primitives. Use a 'mapping' for complex values.
 
-        More info: https://storybook.js.org/docs/react/writing-stories/args#mapping-to-complex-arg-values
+        More info: https://storybook.js.org/docs/writing-stories/args#mapping-to-complex-arg-values
       `);
       return allowArg();
     }

code/core/src/router/utils.ts

@@ -197,7 +197,7 @@ export const buildArgsParam = (initialArgs: Args | undefined, args: Args): strin
     once.warn(dedent`
       Omitted potentially unsafe URL args.
 
-      More info: https://storybook.js.org/docs/react/writing-stories/args#setting-args-through-the-url
+      More info: https://storybook.js.org/docs/writing-stories/args#setting-args-through-the-url
     `);
     return acc;
   }, {} as Args);

code/core/src/server-errors.ts

@@ -116,7 +116,7 @@ export class ConflictingStaticDirConfigError extends StorybookError {
       category: Category.CORE_SERVER,
       code: 1,
       documentation:
-        'https://storybook.js.org/docs/react/configure/images-and-assets#serving-static-files-via-storybook-configuration',
+        'https://storybook.js.org/docs/configure/integration/images-and-assets#serving-static-files-via-storybook-configuration',
       message: dedent`
         Storybook encountered a conflict when trying to serve statics. You have configured both:
         * Storybook's option in the config file: 'staticDirs'
@@ -133,7 +133,7 @@ export class InvalidStoriesEntryError extends StorybookError {
       category: Category.CORE_COMMON,
       code: 4,
       documentation:
-        'https://storybook.js.org/docs/react/faq#can-i-have-a-storybook-with-no-local-stories',
+        'https://storybook.js.org/docs/faq#can-i-have-a-storybook-with-no-local-stories',
       message: dedent`
         Storybook could not index your stories.
         Your main configuration somehow does not contain a 'stories' field, or it resolved to an empty array.
@@ -150,7 +150,7 @@ export class WebpackMissingStatsError extends StorybookError {
       code: 1,
       documentation: [
         'https://webpack.js.org/configuration/stats/',
-        'https://storybook.js.org/docs/react/builders/webpack#configure',
+        'https://storybook.js.org/docs/builders/webpack#configure',
       ],
       message: dedent`
         No Webpack stats found. Did you turn off stats reporting in your Webpack config?
@@ -217,7 +217,7 @@ export class MissingAngularJsonError extends StorybookError {
     super({
       category: Category.CLI_INIT,
       code: 2,
-      documentation: 'https://storybook.js.org/docs/angular/faq#error-no-angularjson-file-found',
+      documentation: 'https://storybook.js.org/docs/faq#error-no-angularjson-file-found',
       message: dedent`
         An angular.json file was not found in the current working directory: ${data.path}
         Storybook needs it to work properly, so please rerun the command at the root of your project, where the angular.json file is located.`,

code/core/src/types/modules/addons.ts

@@ -178,22 +178,22 @@ export interface Addon_BaseAnnotations<
   /**
    * Dynamic data that are provided (and possibly updated by) Storybook and its addons.
    *
-   * @see [Arg story inputs](https://storybook.js.org/docs/react/api/csf#args-story-inputs)
+   * @see [Arg story inputs](https://storybook.js.org/docs/api/csf#args-story-inputs)
    */
   args?: Partial<TArgs>;
 
   /**
    * ArgTypes encode basic metadata for args, such as `name`, `description`, `defaultValue` for an
    * arg. These get automatically filled in by Storybook Docs.
    *
-   * @see [Arg types](https://storybook.js.org/docs/react/api/arg-types)
+   * @see [Arg types](https://storybook.js.org/docs/api/arg-types)
    */
   argTypes?: Addons_ArgTypes<TArgs>;
 
   /**
    * Custom metadata for a story.
    *
-   * @see [Parameters](https://storybook.js.org/docs/react/writing-stories/parameters)
+   * @see [Parameters](https://storybook.js.org/docs/writing-stories/parameters)
    */
   parameters?: Parameters;
 
@@ -202,7 +202,7 @@ export interface Addon_BaseAnnotations<
    *
    * Decorators defined in Meta will be applied to every story variation.
    *
-   * @see [Decorators](https://storybook.js.org/docs/addons/#1-decorators)
+   * @see [Decorators](https://storybook.js.org/docs/writing-stories/decorators)
    */
   decorators?: Addon_BaseDecorators<StoryFnReturnType>;
 
@@ -229,7 +229,7 @@ export interface Addon_Annotations<TArgs, StoryFnReturnType>
    * includeStories: /.*Story$/;
    * ```
    *
-   * @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
+   * @see [Non-story exports](https://storybook.js.org/docs/api/csf#non-story-exports)
    */
   includeStories?: string[] | RegExp;
 
@@ -244,7 +244,7 @@ export interface Addon_Annotations<TArgs, StoryFnReturnType>
    * excludeStories: /.*Data$/;
    * ```
    *
-   * @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
+   * @see [Non-story exports](https://storybook.js.org/docs/api/csf#non-story-exports)
    */
   excludeStories?: string[] | RegExp;
 }
@@ -263,7 +263,7 @@ export interface Addon_BaseMeta<ComponentType> {
    * export default { title: 'Design System/Atoms/Button' };
    * ```
    *
-   * @see [Story Hierarchy](https://storybook.js.org/docs/basics/writing-stories/#story-hierarchy)
+   * @see [Story Hierarchy](https://storybook.js.org/docs/writing-stories/naming-components-and-hierarchy)
    */
   title?: string;
 
@@ -274,7 +274,7 @@ export interface Addon_BaseMeta<ComponentType> {
    * Storybook will prioritize the id over the title for ID generation, if provided, and will
    * prioritize the story.storyName over the export key for display.
    *
-   * @see [Sidebar and URLs](https://storybook.js.org/docs/react/configure/sidebar-and-urls#permalinking-to-stories)
+   * @see [Sidebar and URLs](https://storybook.js.org/docs/configure/user-interface/sidebar-and-urls#permalink-to-stories)
    */
   id?: string;
 

code/frameworks/angular/src/builders/build-storybook/schema.json

@@ -51,7 +51,7 @@
     },
     "docs": {
       "type": "boolean",
-      "description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",
+      "description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/writing-docs/build-documentation#preview-storybooks-documentation.",
       "default": false
     },
     "test": {

code/frameworks/angular/src/builders/start-storybook/schema.json

@@ -83,7 +83,7 @@
     },
     "docs": {
       "type": "boolean",
-      "description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/react/writing-docs/build-documentation#preview-storybooks-documentation.",
+      "description": "Starts Storybook in documentation mode. Learn more about it : https://storybook.js.org/docs/writing-docs/build-documentation#preview-storybooks-documentation.",
       "default": false
     },
     "compodoc": {

code/lib/cli-storybook/src/automigrate/fixes/remove-argtypes-regex.ts

@@ -59,7 +59,7 @@ export const removeArgtypesRegex: Fix<{ argTypesRegex: NodePath; previewConfigPa
 
       Then, refer to our docs to migrate your play functions to Storybook 8: 
       ${picocolors.yellow(
-        'https://storybook.js.org/docs/8.0/essentials/actions#via-storybooktest-fn-spy-function'
+        'https://storybook.js.org/docs/essentials/actions#via-storybooktest-fn-spy-function'
       )}
     `;
   },

code/lib/cli-storybook/src/automigrate/fixes/remove-legacymdx1.ts

@@ -31,6 +31,7 @@ export const removeLegacyMDX1: Fix<RemoveLegacyMDX1Options> = {
     return null;
   },
 
+  // TODO: This is a temporary fix to prevent a 500 error when running the migration and the user clicks the link in the prompt to preview the docs. We'll probably need to account for future releases.
   prompt({}) {
     return dedent`
       You have features.legacyMdx1 in your Storybook main config file. This feature has been removed. Shall we remove it from your Storybook main config file?

code/lib/cli-storybook/src/automigrate/fixes/vite-config-file.ts

@@ -97,6 +97,7 @@ export const viteConfigFile = {
     return null;
   },
 
+  // TODO: This is a temporary fix to prevent a 500 error when running the migration and the user clicks the link in the prompt to preview the docs. We'll probably need to account for future releases.
   prompt({ existed, plugins }) {
     if (existed) {
       return dedent`
@@ -108,7 +109,7 @@ export const viteConfigFile = {
         If you already have these plugins, you can ignore this message.
 
         You can find more information on how to do this here:
-        https://storybook.js.org/docs/8.0/migration-guide/#missing-viteconfigjs-file
+        https://storybook.js.org/docs/8.0/migration-guide#missing-viteconfigjs-file
 
         This change was necessary to support newer versions of Vite.
       `;
@@ -118,7 +119,7 @@ export const viteConfigFile = {
       Please add a vite.config.js file to your project root.
 
       You can find more information on how to do this here:
-      https://storybook.js.org/docs/8.0/migration-guide/#missing-viteconfigjs-file
+      https://storybook.js.org/docs/8.0/migration-guide#missing-viteconfigjs-file
 
       This change was necessary to support newer versions of Vite.
     `;

code/lib/cli-storybook/src/automigrate/fixes/webpack5-compiler-setup.test.ts

@@ -415,7 +415,7 @@ describe('prompt', () => {
         In the next step, Storybook will install @storybook/addon-webpack5-compiler-swc and will add it to your addons list in your Storybook config.
 
         After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
-        You can find more information here: https://storybook.js.org/docs/8.0/builders/webpack#compiler-support"
+        You can find more information here: https://storybook.js.org/docs/builders/webpack#compiler-support"
       `);
   });
 
@@ -434,7 +434,7 @@ describe('prompt', () => {
         In the next step, Storybook will install @storybook/addon-webpack5-compiler-swc and will add it to your addons list in your Storybook config.
 
         After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
-        You can find more information here: https://storybook.js.org/docs/8.0/builders/webpack#compiler-support"
+        You can find more information here: https://storybook.js.org/docs/builders/webpack#compiler-support"
       `);
   });
 
@@ -454,7 +454,7 @@ describe('prompt', () => {
         In the next step, Storybook will ask you to choose a compiler to automatically set it up for you.
 
         After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
-        You can find more information here: https://storybook.js.org/docs/8.0/builders/webpack#compiler-support"
+        You can find more information here: https://storybook.js.org/docs/builders/webpack#compiler-support"
       `);
   });
 
@@ -494,7 +494,7 @@ describe('prompt', () => {
         In the next step, Storybook will install @storybook/addon-webpack5-compiler-swc and will add it to your addons list in your Storybook config.
 
         After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
-        You can find more information here: https://storybook.js.org/docs/8.0/builders/webpack#compiler-support"
+        You can find more information here: https://storybook.js.org/docs/builders/webpack#compiler-support"
       `);
   });
 
@@ -514,7 +514,7 @@ describe('prompt', () => {
         In the next step, Storybook will ask you to choose a compiler to automatically set it up for you.
 
         After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
-        You can find more information here: https://storybook.js.org/docs/8.0/builders/webpack#compiler-support"
+        You can find more information here: https://storybook.js.org/docs/builders/webpack#compiler-support"
       `);
   });
 });

code/lib/cli-storybook/src/automigrate/fixes/webpack5-compiler-setup.ts

@@ -143,7 +143,7 @@ export const webpack5CompilerSetup = {
       In the next step, Storybook will ask you to choose a compiler to automatically set it up for you.\n
       After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
       You can find more information here: ${picocolors.yellow(
-        'https://storybook.js.org/docs/8.0/builders/webpack#compiler-support'
+        'https://storybook.js.org/docs/builders/webpack#compiler-support'
       )}
       `);
     } else {
@@ -153,7 +153,7 @@ export const webpack5CompilerSetup = {
       In the next step, Storybook will install @storybook/addon-webpack5-compiler-swc and will add it to your addons list in your Storybook config.\n
       After the migration, you can switch Webpack5 compilers by swapping the addon in your project.
       You can find more information here: ${picocolors.yellow(
-        'https://storybook.js.org/docs/8.0/builders/webpack#compiler-support'
+        'https://storybook.js.org/docs/builders/webpack#compiler-support'
       )}
       `);
     }

code/lib/cli-storybook/src/automigrate/fixes/wrap-require.ts

@@ -57,7 +57,7 @@ export const wrapRequire: Fix<WrapRequireRunOptions> = {
     } project. 
     For Storybook to work correctly, some fields in your main config must be updated. We can do this for you automatically.
 
-    More info: https://storybook.js.org/docs/react/faq#how-do-i-fix-module-resolution-in-special-environments`;
+    More info: https://storybook.js.org/docs/faq#how-do-i-fix-module-resolution-in-special-environments`;
   },
 
   async run({ dryRun, mainConfigPath, result }) {

code/lib/cli-storybook/src/automigrate/helpers/getMigrationSummary.test.ts

@@ -110,7 +110,7 @@ describe('getMigrationSummary', () => {
 
       The automigrations try to migrate common patterns in your project, but might not contain everything needed to migrate to the latest version of Storybook.
 
-      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/8.0/migration-guide
+      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/migration-guide
       And reach out on Discord if you need help: https://discord.gg/storybook"
     `);
   });
@@ -130,7 +130,7 @@ describe('getMigrationSummary', () => {
 
       The automigrations try to migrate common patterns in your project, but might not contain everything needed to migrate to the latest version of Storybook.
 
-      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/8.0/migration-guide
+      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/migration-guide
       And reach out on Discord if you need help: https://discord.gg/storybook"
     `);
   });
@@ -150,7 +150,7 @@ describe('getMigrationSummary', () => {
 
       The automigrations try to migrate common patterns in your project, but might not contain everything needed to migrate to the latest version of Storybook.
 
-      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/8.0/migration-guide
+      Please check the changelog and migration guide for manual migrations and more information: https://storybook.js.org/docs/migration-guide
       And reach out on Discord if you need help: https://discord.gg/storybook"
     `);
   });

code/lib/cli-storybook/src/automigrate/helpers/getMigrationSummary.ts

@@ -73,7 +73,7 @@ export function getMigrationSummary({
     The automigrations try to migrate common patterns in your project, but might not contain everything needed to migrate to the latest version of Storybook.
 
     Please check the changelog and migration guide for manual migrations and more information: ${picocolors.yellow(
-      'https://storybook.js.org/docs/8.0/migration-guide'
+      'https://storybook.js.org/docs/migration-guide'
     )}
     And reach out on Discord if you need help: ${picocolors.yellow('https://discord.gg/storybook')}
   `);