✨ Added autodocs to component Storybook Stories (#9547)

## Feature description

For the Storybook component template, I added `tags: ['autodocs']` to
the `meta` block. In context:

```TypeScript
const meta: Meta<typeof ${pascalName}> = {
  component: ${pascalName},
  tags: ['autodocs']
}
```

By adding this tag, it will generate documentation for you within
Storybook:

![CleanShot 2023-11-17 at 12 39
12](https://github.com/redwoodjs/redwood/assets/212300/d10927d8-bb9c-4201-a614-62493b84b80a)

_NOTE: screenshots are from another project, but demonstrate what this
tag will do_

In the sidebar, you'll notice a new link called "Docs." This includes a
summary of all the component, all the props that are passed in, and an
overview of all the stories for this component.

![CleanShot 2023-11-17 at 12 38
52](https://github.com/redwoodjs/redwood/assets/212300/d063b0c8-0875-4b91-accf-7bb47d1dfc96)

We could do this for cells, layouts, and pages, but I figured it's the
most relevant and helpful on the component level.

---------

Co-authored-by: Dominic Saadi <[email protected]>

__fixtures__/test-project/web/src/components/Author/Author.stories.tsx

@@ -16,6 +16,7 @@ import Author from './Author'
 
 const meta: Meta<typeof Author> = {
   component: Author,
+  tags: ['autodocs'],
 }
 
 export default meta

__fixtures__/test-project/web/src/components/AuthorCell/AuthorCell.stories.tsx

@@ -5,6 +5,7 @@ import { standard } from './AuthorCell.mock'
 
 const meta: Meta = {
   title: 'Cells/AuthorCell',
+  tags: ['autodocs'],
 }
 
 export default meta

__fixtures__/test-project/web/src/components/BlogPost/BlogPost.stories.tsx

@@ -16,6 +16,7 @@ import BlogPost from './BlogPost'
 
 const meta: Meta<typeof BlogPost> = {
   component: BlogPost,
+  tags: ['autodocs'],
 }
 
 export default meta

__fixtures__/test-project/web/src/components/BlogPostCell/BlogPostCell.stories.tsx

@@ -5,6 +5,7 @@ import { standard } from './BlogPostCell.mock'
 
 const meta: Meta = {
   title: 'Cells/BlogPostCell',
+  tags: ['autodocs'],
 }
 
 export default meta

__fixtures__/test-project/web/src/components/BlogPostsCell/BlogPostsCell.stories.tsx

@@ -5,6 +5,7 @@ import { standard } from './BlogPostsCell.mock'
 
 const meta: Meta = {
   title: 'Cells/BlogPostsCell',
+  tags: ['autodocs'],
 }
 
 export default meta

__fixtures__/test-project/web/src/components/WaterfallBlogPostCell/WaterfallBlogPostCell.stories.tsx

@@ -5,6 +5,7 @@ import { standard } from './WaterfallBlogPostCell.mock'
 
 const meta: Meta = {
   title: 'Cells/WaterfallBlogPostCell',
+  tags: ['autodocs'],
 }
 
 export default meta

packages/cli/src/commands/generate/cell/__tests__/__snapshots__/cell.test.js.snap

@@ -91,6 +91,7 @@ import { standard } from './UserProfileCell.mock'
 
 const meta = {
   title: 'Cells/UserProfileCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -205,6 +206,7 @@ import { standard } from './UserProfileCell.mock'
 
 const meta = {
   title: 'Cells/UserProfileCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -319,6 +321,7 @@ import { standard } from './UserCell.mock'
 
 const meta = {
   title: 'Cells/UserCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -433,6 +436,7 @@ import { standard } from './UserProfileCell.mock'
 
 const meta = {
   title: 'Cells/UserProfileCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -592,6 +596,7 @@ import { standard } from './BazingaCell.mock'
 
 const meta: Meta = {
   title: 'Cells/BazingaCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -704,6 +709,7 @@ import { standard } from './UserProfileCell.mock'
 
 const meta = {
   title: 'Cells/UserProfileCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -853,6 +859,7 @@ import { standard } from './AddressCell.mock'
 
 const meta = {
   title: 'Cells/AddressCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -973,6 +980,7 @@ import { standard } from './AddressesCell.mock'
 
 const meta = {
   title: 'Cells/AddressesCell',
+  tags: ['autodocs'],
 }
 
 export default meta
@@ -1091,6 +1099,7 @@ import { standard } from './MembersCell.mock'
 
 const meta = {
   title: 'Cells/MembersCell',
+  tags: ['autodocs'],
 }
 
 export default meta

packages/cli/src/commands/generate/cell/templates/stories.tsx.template

@@ -5,6 +5,7 @@ import { standard } from './${pascalName}Cell.mock'
 
 const meta: Meta = {
   title: 'Cells/${pascalName}Cell',
+  tags: ['autodocs']
 }
 
 export default meta

packages/cli/src/commands/generate/component/templates/stories.tsx.template

@@ -16,6 +16,7 @@ import ${pascalName} from './${pascalName}'
 
 const meta: Meta<typeof ${pascalName}> = {
   component: ${pascalName},
+  tags: ['autodocs']
 }
 
 export default meta

tasks/smoke-tests/storybook/tests/storybook.spec.ts

@@ -9,6 +9,7 @@ test('Loads Cell stories', async ({ page }: PlaywrightTestArgs) => {
 
   // Click text=BlogPostCell
   await page.locator('text=/\\bBlogPostCell\\b/').click()
+  await page.getByRole('link', { name: 'Loading' }).click()
 
   await expect(page).toHaveURL(
     `http://localhost:7910/?path=/story/cells-blogpostcell--loading`