Done 2 sections

storybookjs · Jun 13, 2024 · ef31c82 · ef31c82
1 parent c9b9a09
commit ef31c82
Show file tree

Hide file tree

Showing 17 changed files with 54 additions and 0 deletions.
diff --git a/docs/writing-docs/autodocs.mdx b/docs/writing-docs/autodocs.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Automatic documentation and Storybook'
+sidebar:
+  order: 1
+  title: Autodocs
 ---
 
 <YouTubeCallout id="BLUmt0j7OLY" title="INSTANT documentation with Storybook 7 AUTODOCS" />

diff --git a/docs/writing-docs/build-documentation.mdx b/docs/writing-docs/build-documentation.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Preview and build docs'
+sidebar:
+  order: 4
+  title: Preview and build docs
 ---
 
 Storybook allows you to create rich and extensive [documentation](./index.md) that will help you and any other stakeholder involved in the development process. Out of the box you have the tooling required to not only write it but also to preview it and build it.

diff --git a/docs/writing-docs/doc-blocks.mdx b/docs/writing-docs/doc-blocks.mdx
@@ -1,5 +1,8 @@
 ---
 title: Doc blocks
+sidebar:
+  order: 3
+  title: Doc blocks
 ---
 
 <YouTubeCallout id="uAA1JvLcl-w" title="Avoid Documentation Nightmares with Storybook Doc Blocks" />

diff --git a/docs/writing-docs/mdx.mdx b/docs/writing-docs/mdx.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'MDX'
+sidebar:
+  order: 2
+  title: MDX
 ---
 
 <YouTubeCallout id="YeIvFke5_5Y" title="MDX Storybook Quick Tips" />

diff --git a/docs/writing-stories/args.mdx b/docs/writing-stories/args.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Args'
+sidebar:
+  order: 1
+  title: Args
 ---
 
 <YouTubeCallout id="0gOfS6K0x0E" title="Build better UIs with Storybook Args" />

diff --git a/docs/writing-stories/build-pages-with-storybook.mdx b/docs/writing-stories/build-pages-with-storybook.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Building pages with Storybook'
+sidebar:
+  order: 9
+  title: Building pages and screens
 ---
 
 Storybook helps you build any component, from small “atomic” components to composed pages. But as you move up the component hierarchy toward the page level, you deal with more complexity.

diff --git a/docs/writing-stories/decorators.mdx b/docs/writing-stories/decorators.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Decorators'
+sidebar:
+  order: 3
+  title: Decorators
 ---
 
 <YouTubeCallout id="4yi_yCTkgng" title="Storybook Decorators Crash Course" />

diff --git a/docs/writing-stories/loaders.mdx b/docs/writing-stories/loaders.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Loaders'
+sidebar:
+  order: 5
+  title: Loaders
 ---
 
 Loaders are asynchronous functions that load data for a story and its [decorators](./decorators.md). A story's loaders run before the story renders, and the loaded data injected into the story via its render context.

diff --git a/docs/writing-stories/mocking-data-and-modules/index.mdx b/docs/writing-stories/mocking-data-and-modules/index.mdx
@@ -0,0 +1,6 @@
+---
+title: Mocking data and modules
+sidebar:
+  order: 8
+  title: Mocking data and modules
+---
diff --git a/docs/writing-stories/mocking-modules.mdx → ...king-data-and-modules/mocking-modules.mdx b/docs/writing-stories/mocking-modules.mdx → ...king-data-and-modules/mocking-modules.mdx
@@ -1,5 +1,8 @@
 ---
 title: Mocking modules
+sidebar:
+  order: 1
+  title: Modules
 ---
 
 Components can also depend on modules that are imported into the component file. These can be from external packages or internal to your project. When rendering those components in Storybook or testing them, you may want to mock those modules to control their behavior.

diff --git a/...ting-stories/mocking-network-requests.mdx → ...-and-modules/mocking-network-requests.mdx b/...ting-stories/mocking-network-requests.mdx → ...-and-modules/mocking-network-requests.mdx
@@ -1,5 +1,8 @@
 ---
 title: Mocking network requests
+sidebar:
+  order: 2
+  title: Network requests
 ---
 
 For components that make network requests (e.g. fetching data from a REST or GraphQL API), you can mock those requests using a tool like [Mock Service Worker (MSW)](https://mswjs.io/). MSW is an API mocking library, which relies on service workers to capture network requests and provides mocked data in response.

diff --git a/docs/writing-stories/mocking-providers.mdx → ...ng-data-and-modules/mocking-providers.mdx b/docs/writing-stories/mocking-providers.mdx → ...ng-data-and-modules/mocking-providers.mdx
@@ -1,5 +1,8 @@
 ---
 title: Mocking providers
+sidebar:
+  order: 3
+  title: Providers
 ---
 
 export const SUPPORTED_RENDERERS = ['preact', 'react', 'solid'];

diff --git a/docs/writing-stories/naming-components-and-hierarchy.mdx b/docs/writing-stories/naming-components-and-hierarchy.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Naming components and hierarchy'
+sidebar:
+  order: 7
+  title: Naming components and hierarchy
 ---
 
 <YouTubeCallout id="VPfjrhDlkVc" title="How to Name Stories and Components" />

diff --git a/docs/writing-stories/parameters.mdx b/docs/writing-stories/parameters.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Parameters'
+sidebar:
+  order: 2
+  title: Parameters
 ---
 
 <YouTubeCallout id="u32vmGVJY2U" title="Build Better Storybooks with Parameters" />

diff --git a/docs/writing-stories/play-function.mdx b/docs/writing-stories/play-function.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Play function'
+sidebar:
+  order: 4
+  title: Play function
 ---
 
 <YouTubeCallout id="dcuzwCHI940" title="Component testing in Storybook with play functions" />

diff --git a/docs/writing-stories/stories-for-multiple-components.mdx b/docs/writing-stories/stories-for-multiple-components.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Stories for multiple components'
+sidebar:
+  order: 10
+  title: Stories for multiple components
 ---
 
 It's useful to write stories that [render two or more components](./index.md#stories-for-two-or-more-components) at once if those components are designed to work together. For example, `ButtonGroup`, `List`, and `Page` components.

diff --git a/docs/writing-stories/tags.mdx b/docs/writing-stories/tags.mdx
@@ -1,5 +1,8 @@
 ---
 title: 'Tags'
+sidebar:
+  order: 6
+  title: Tags
 ---
 
 Tags allow you to control which stories are included in your Storybook, enabling many different uses of the same total set of stories. For example, you can use tags to include/exclude tests from the [test runner](../writing-tests/test-runner.md#run-tests-for-a-subset-of-stories). For more complex use cases, see the [recipes](#recipes) section, below.