update categories of stories
This commit is contained in:
Tykayn
tykayn
parent
10c04630fb
commit
fdb3f962e5
13 changed files with 12 additions and 92 deletions
|
|
@ -22,7 +22,7 @@ import {ToolsOptions} from './tools-options/tools-options';
|
|||
const appReducer = reducers.app;
|
||||
|
||||
const meta: Meta<Chatbot> = {
|
||||
title: 'App/Chatbot',
|
||||
title: 'App/Features/Chatbot',
|
||||
component: Chatbot,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ class MockApiService {
|
|||
}
|
||||
|
||||
const meta: Meta<FeedbackButton> = {
|
||||
title: 'Components/FeedbackButton',
|
||||
title: 'UI/Feedback/FeedbackButton',
|
||||
component: FeedbackButton,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { FeedbackButton } from '../feedback-button/feedback-button';
|
|||
import { ChatbotMessage } from '../../services/chatbot.message.type';
|
||||
|
||||
const meta: Meta<MessageBox> = {
|
||||
title: 'Components/MessageBox',
|
||||
title: 'Chatbot/Messages/MessageBox',
|
||||
component: MessageBox,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import {FormsModule} from '@angular/forms';
|
|||
const appReducer = reducers.app;
|
||||
|
||||
const meta: Meta<NewInput> = {
|
||||
title: 'Components/NewInput',
|
||||
title: 'Chatbot/Input/NewInput',
|
||||
component: NewInput,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import {ApiService} from '../../services/api-service';
|
|||
const appReducer = reducers.app;
|
||||
|
||||
const meta: Meta<PromptInput> = {
|
||||
title: 'Components/PromptInput',
|
||||
title: 'Chatbot/Input/PromptInput',
|
||||
component: PromptInput,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { moduleMetadata } from '@storybook/angular';
|
|||
import { CommonModule } from '@angular/common';
|
||||
|
||||
const meta: Meta<SourceBlock> = {
|
||||
title: 'Components/SourceBlock',
|
||||
title: 'Chatbot/Sources/SourceBlock',
|
||||
component: SourceBlock,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import {ToggleButton} from './toggle-button';
|
|||
|
||||
// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
|
||||
const meta: Meta<ToggleButton> = {
|
||||
title: 'Components/ToggleButton',
|
||||
title: 'UI/Buttons/ToggleButton',
|
||||
component: ToggleButton,
|
||||
tags: ['autodocs'],
|
||||
argTypes: {
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import {Store} from '@ngrx/store';
|
|||
const storeMock = {};
|
||||
|
||||
const meta: Meta<WarningBugs> = {
|
||||
title: 'Chatbot/WarningBugs',
|
||||
title: 'Chatbot/Feedback/WarningBugs',
|
||||
component: WarningBugs,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { moduleMetadata } from '@storybook/angular';
|
|||
import { NgStyle } from '@angular/common';
|
||||
|
||||
const meta: Meta<ColorDisplay> = {
|
||||
title: 'Components/ColorDisplay',
|
||||
title: 'Design/Colors/ColorDisplay',
|
||||
component: ColorDisplay,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ const appReducer = reducers.app;
|
|||
* - Mobile-responsive hamburger menu
|
||||
*/
|
||||
const meta: Meta<DsNavbar> = {
|
||||
title: 'Navigation/DsNavbar',
|
||||
title: 'UI/Navigation/Navbar',
|
||||
component: DsNavbar,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Logo } from './logo';
|
|||
|
||||
// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
|
||||
const meta: Meta<Logo> = {
|
||||
title: 'Components/Logo',
|
||||
title: 'Design/Brand/Logo',
|
||||
component: Logo,
|
||||
tags: ['autodocs'],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { ButtonComponent } from './button.component';
|
|||
|
||||
// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
|
||||
const meta: Meta<ButtonComponent> = {
|
||||
title: 'Example/Button',
|
||||
title: 'UI/Buttons/ExampleButton',
|
||||
component: ButtonComponent,
|
||||
tags: ['autodocs'],
|
||||
argTypes: {
|
||||
|
|
|
|||
|
|
@ -1,80 +0,0 @@
|
|||
# Testing Storybook Category Changes
|
||||
|
||||
This document provides instructions for testing the new category structure in Storybook.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Node.js v20.19+ or v22.12+
|
||||
- Access to the project repository
|
||||
|
||||
## Steps to Test
|
||||
|
||||
1. **Update Story Categories**
|
||||
|
||||
Run the update script to apply the new category structure:
|
||||
|
||||
```bash
|
||||
cd /home/poule/encrypted/stockage-syncable/www/development/html/ng-implementation/old-sae-airwatch
|
||||
node src/stories/update-story-categories.js
|
||||
```
|
||||
|
||||
This will update all story files according to the mapping defined in the script.
|
||||
|
||||
2. **Start Storybook**
|
||||
|
||||
Launch Storybook to see the changes:
|
||||
|
||||
```bash
|
||||
npm run storybook
|
||||
```
|
||||
|
||||
If you encounter any Node.js version issues, you may need to use a compatible version:
|
||||
|
||||
```bash
|
||||
nvm use 20.19 # If you have nvm installed
|
||||
# OR
|
||||
export NODE_OPTIONS=--openssl-legacy-provider # For older Node versions
|
||||
npm run storybook
|
||||
```
|
||||
|
||||
3. **Verify the Category Structure**
|
||||
|
||||
In the Storybook UI, check that:
|
||||
|
||||
- The sidebar now shows the new hierarchical structure
|
||||
- Categories are organized as:
|
||||
- UI (Buttons, Feedback, Navigation, etc.)
|
||||
- Chatbot (Conversation, Messages, Input, Actions, etc.)
|
||||
- App (Features, Pages, etc.)
|
||||
- Design (Colors, Brand, etc.)
|
||||
- Components appear under the correct categories
|
||||
- Navigation between categories works as expected
|
||||
|
||||
4. **Check Component Rendering**
|
||||
|
||||
For each category:
|
||||
- Open a few components to ensure they render correctly
|
||||
- Verify that the component controls and documentation still work
|
||||
- Test any interactive features
|
||||
|
||||
5. **Troubleshooting**
|
||||
|
||||
If components don't appear in the expected categories:
|
||||
- Check the story file to ensure the title was updated correctly
|
||||
- Verify that the category mapping in the update script is correct
|
||||
- Restart Storybook if necessary
|
||||
|
||||
## Expected Results
|
||||
|
||||
- The sidebar should show a clear hierarchical structure
|
||||
- Related components should be grouped together
|
||||
- Navigation should be intuitive and logical
|
||||
- All components should render correctly
|
||||
|
||||
## Reporting Issues
|
||||
|
||||
If you encounter any issues:
|
||||
1. Check the browser console for errors
|
||||
2. Verify the story file's title property
|
||||
3. Check for any missing mappings in the update script
|
||||
4. Document the issue with screenshots and error messages
|
||||
Loading…
Add table
Add a link
Reference in a new issue