From 096828179d9b694457958d8bec28ff984815b23c Mon Sep 17 00:00:00 2001 From: tykayn Date: Mon, 22 Sep 2025 09:58:26 +0200 Subject: [PATCH] less storybook files --- .../.storybook/stories/foundations.stories.ts | 94 ++++++++++++++++++ .../.storybook/stories/patterns.stories.ts | 33 +++++++ .../main-button/main-button.stories.ts | 2 +- .../export-chat-button.stories.ts | 61 ------------ .../feedback-button.stories.ts | 22 ++--- .../prompt-input/prompt-input.stories.ts | 70 ------------- .../source-block/source-block.stories.ts | 65 ------------- .../toggle-button/toggle-button.stories.ts | 2 +- .../color-display/color-display.stories.ts | 97 ------------------- airwatch/src/app/logo/logo.stories.ts | 17 ---- 10 files changed, 140 insertions(+), 323 deletions(-) create mode 100644 airwatch/.storybook/stories/foundations.stories.ts create mode 100644 airwatch/.storybook/stories/patterns.stories.ts delete mode 100644 airwatch/src/app/chatbot/export-chat-button/export-chat-button.stories.ts delete mode 100644 airwatch/src/app/chatbot/prompt-input/prompt-input.stories.ts delete mode 100644 airwatch/src/app/chatbot/source-block/source-block.stories.ts delete mode 100644 airwatch/src/app/color-display/color-display.stories.ts delete mode 100644 airwatch/src/app/logo/logo.stories.ts diff --git a/airwatch/.storybook/stories/foundations.stories.ts b/airwatch/.storybook/stories/foundations.stories.ts new file mode 100644 index 0000000..b8102a6 --- /dev/null +++ b/airwatch/.storybook/stories/foundations.stories.ts @@ -0,0 +1,94 @@ +import type {StoryObj} from '@storybook/angular'; +import {ArrayButtons} from 'sae-lib/buttons/array-buttons/array-buttons'; + +/** + * sections : + * + * Colors + * Typography + * Icons + * Layouts + * Radius + * Strokes + * Effects + * + */ + +// Colors section +export default { + title: 'Foundations/colors/palette', +}; + +export const FoundationsColorsArray: StoryObj = { + name: 'Colors', + render: () => ({ + template: ` +
+ +
+ `, + moduleMetadata: { + imports: [ArrayButtons], + }, + }), +}; + +// Typography section +// export const Typography: StoryObj = { +// name: 'Typography', +// render: () => ({ +// template: ``, +// moduleMetadata: { +// imports: [Typography], +// }, +// }), +// }; +// +// // Icons section (placeholder) +// export const Icons: StoryObj = { +// name: 'Icons', +// render: () => ({ +// template: `
Icons component not yet implemented
`, +// }), +// }; +// +// // Layouts section +// export const Layouts: StoryObj = { +// name: 'Layouts', +// render: () => ({ +// template: ``, +// moduleMetadata: { +// imports: [Layouts], +// }, +// }), +// }; +// +// // Radius section +// export const Radius: StoryObj = { +// name: 'Radius', +// render: () => ({ +// template: ``, +// moduleMetadata: { +// imports: [Radius], +// }, +// }), +// }; + +// Strokes section +// export const Strokes: StoryObj = { +// name: 'Strokes', +// render: () => ({ +// template: ``, +// moduleMetadata: { +// imports: [Strokes], +// }, +// }), +// }; + +// Effects section (placeholder) +// export const Effects: StoryObj = { +// name: 'Effects', +// render: () => ({ +// template: `
Effects component not yet implemented
`, +// }), +// }; diff --git a/airwatch/.storybook/stories/patterns.stories.ts b/airwatch/.storybook/stories/patterns.stories.ts new file mode 100644 index 0000000..dc5e289 --- /dev/null +++ b/airwatch/.storybook/stories/patterns.stories.ts @@ -0,0 +1,33 @@ +// sections : +// BreadCrumbs +// Pagination +// FileUploader + +/** + * sections: + * + * BreadCrumbs + * Pagination + * FileUploader + * + */ + +import type {Meta, StoryObj} from '@storybook/angular'; +import {moduleMetadata} from '@storybook/angular'; +import {Index as ColorDisplayComponent} from 'sae-lib/typo/index'; +import {NgStyle} from '@angular/common'; + +const meta: Meta = { + title: 'Patterns/BreadCrumbs', + component: ColorDisplayComponent, + tags: ['autodocs'], + decorators: [ + moduleMetadata({ + imports: [NgStyle], + providers: [] + }) + ], +}; + +export default meta; +type Story = StoryObj; diff --git a/airwatch/src/app/buttons/main-button/main-button.stories.ts b/airwatch/src/app/buttons/main-button/main-button.stories.ts index 48031f8..261a30c 100644 --- a/airwatch/src/app/buttons/main-button/main-button.stories.ts +++ b/airwatch/src/app/buttons/main-button/main-button.stories.ts @@ -3,7 +3,7 @@ import {MainButton} from './main-button'; // More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction const meta: Meta = { - title: 'composants/boutons/MainButton', + title: 'composants/buttons/main', component: MainButton, tags: ['autodocs'], argTypes: { diff --git a/airwatch/src/app/chatbot/export-chat-button/export-chat-button.stories.ts b/airwatch/src/app/chatbot/export-chat-button/export-chat-button.stories.ts deleted file mode 100644 index ee187d8..0000000 --- a/airwatch/src/app/chatbot/export-chat-button/export-chat-button.stories.ts +++ /dev/null @@ -1,61 +0,0 @@ -import type {Meta, StoryObj} from '@storybook/angular'; -import {moduleMetadata} from '@storybook/angular'; -import {ExportChatButton} from './export-chat-button'; -import {NgClass} from '@angular/common'; - -// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction -const meta: Meta = { - title: 'composants/boutons/ExportChatButton', - component: ExportChatButton, - tags: ['autodocs'], - decorators: [ - moduleMetadata({ - imports: [NgClass], - providers: [] - }) - ], - argTypes: { - onExport: {action: 'exported'} - }, -}; - -export default meta; -type Story = StoryObj; - -// Default state -export const Default: Story = { - args: {}, -}; - -// Active dropdown -export const ActiveDropdown: Story = { - args: {}, - play: async ({canvasElement, component}) => { - // Simulate clicking the button to open the dropdown - component.isDropdownActive = true; - }, -}; - -// Custom story to demonstrate hover state -export const HoverState: Story = { - args: {}, - parameters: { - docs: { - description: { - story: 'Hover over the button to see the hover state. The button background changes to blue and text becomes white.' - } - } - } -}; - -// Custom story to demonstrate the export functionality -export const ExportFunctionality: Story = { - args: {}, - parameters: { - docs: { - description: { - story: 'Click on the button to open the dropdown, then select a format to export. The onExport event will be emitted with the selected format.' - } - } - } -}; diff --git a/airwatch/src/app/chatbot/feedback-button/feedback-button.stories.ts b/airwatch/src/app/chatbot/feedback-button/feedback-button.stories.ts index 621a59e..239e089 100644 --- a/airwatch/src/app/chatbot/feedback-button/feedback-button.stories.ts +++ b/airwatch/src/app/chatbot/feedback-button/feedback-button.stories.ts @@ -1,11 +1,11 @@ -import type { Meta, StoryObj } from '@storybook/angular'; -import { FeedbackButton } from './feedback-button'; -import { moduleMetadata } from '@storybook/angular'; -import { CommonModule } from '@angular/common'; -import { FormsModule } from '@angular/forms'; -import { Store, StoreModule } from '@ngrx/store'; -import { ApiService } from '../../services/api-service'; -import { reducers } from '../../reducers'; +import type {Meta, StoryObj} from '@storybook/angular'; +import {moduleMetadata} from '@storybook/angular'; +import {FeedbackButton} from './feedback-button'; +import {CommonModule} from '@angular/common'; +import {FormsModule} from '@angular/forms'; +import {Store, StoreModule} from '@ngrx/store'; +import {ApiService} from '../../services/api-service'; +import {reducers} from '../../reducers'; // Mock ApiService class MockApiService { @@ -13,14 +13,14 @@ class MockApiService { // Simulate API call return new Promise((resolve) => { setTimeout(() => { - resolve({ success: true }); + resolve({success: true}); }, 1000); }); } } const meta: Meta = { - title: 'composants/boutons/FeedbackButton', + title: 'composants/buttons/feedback', component: FeedbackButton, tags: ['autodocs'], decorators: [ @@ -32,7 +32,7 @@ const meta: Meta = { ], providers: [ Store, - { provide: ApiService, useClass: MockApiService } + {provide: ApiService, useClass: MockApiService} ] }) ], diff --git a/airwatch/src/app/chatbot/prompt-input/prompt-input.stories.ts b/airwatch/src/app/chatbot/prompt-input/prompt-input.stories.ts deleted file mode 100644 index a3c9f8d..0000000 --- a/airwatch/src/app/chatbot/prompt-input/prompt-input.stories.ts +++ /dev/null @@ -1,70 +0,0 @@ -import type {Meta, StoryObj} from '@storybook/angular'; -import {moduleMetadata} from '@storybook/angular'; -import {PromptInput} from './prompt-input'; -import {CommonModule} from '@angular/common'; -import {FormsModule} from '@angular/forms'; -import {Store, StoreModule} from '@ngrx/store'; -import {reducers} from '../../reducers'; -import {HttpClientModule} from '@angular/common/http'; -import {ApiService} from '../../services/api-service'; - -const appReducer = reducers.app; - -const meta: Meta = { - title: 'composants/inputs/PromptInput', - component: PromptInput, - tags: ['autodocs'], - decorators: [ - moduleMetadata({ - imports: [ - CommonModule, - FormsModule, - HttpClientModule, - StoreModule.forRoot({app: appReducer as any}) - ], - providers: [ - ApiService, - Store - ] - }) - ], - argTypes: { - // Vous pouvez définir des contrôles pour les propriétés ici - } -}; - -export default meta; -type Story = StoryObj; - -export const Default: Story = { - args: { - // Les propriétés par défaut - } -}; - -export const WithPlaceholder: Story = { - args: { - // Les propriétés avec un placeholder personnalisé - }, - parameters: { - // Vous pouvez surcharger certains paramètres ici - } -}; - -export const LoadingState: Story = { - args: { - // Les propriétés de base - }, - parameters: { - store: { - init: (store: Store) => { - store.dispatch({ - type: 'UPDATE_APP', - payload: { - loading: true - } - }); - } - } - } -}; diff --git a/airwatch/src/app/chatbot/source-block/source-block.stories.ts b/airwatch/src/app/chatbot/source-block/source-block.stories.ts deleted file mode 100644 index 952397f..0000000 --- a/airwatch/src/app/chatbot/source-block/source-block.stories.ts +++ /dev/null @@ -1,65 +0,0 @@ -import type { Meta, StoryObj } from '@storybook/angular'; -import { SourceBlock } from './source-block'; -import { ChatbotSource } from '../../services/conversations.service'; -import { moduleMetadata } from '@storybook/angular'; -import { CommonModule } from '@angular/common'; - -const meta: Meta = { - title: 'composants/conversation/SourceBlock', - component: SourceBlock, - tags: ['autodocs'], - decorators: [ - moduleMetadata({ - imports: [CommonModule], - providers: [] - }) - ], - argTypes: { - source: { - control: 'object', - description: 'Objet contenant les informations de la source' - } - }, -}; - -export default meta; -type Story = StoryObj; - -export const Default: Story = { - args: { - source: new ChatbotSource({ - title: 'Document technique.pdf', - url: 'https://example.com/document-technique.pdf', - description: 'Ce document contient des informations techniques sur les avions de ligne modernes et leur maintenance.' - }) - }, -}; - -export const ShortDescription: Story = { - args: { - source: new ChatbotSource({ - title: 'Rapport d\'accident.pdf', - url: 'https://example.com/rapport-accident.pdf', - description: 'Rapport concernant l\'incident de vol 123.' - }) - }, -}; - -export const LongDescription: Story = { - args: { - source: new ChatbotSource({ - title: 'Documentation complète.pdf', - url: 'https://example.com/documentation-complete.pdf', - description: 'DE GAGNE DATE: JANUARY 18, 2008 VEN #: V6-CAW-M2700-10 APPROVED BY: MARTIN SWAN DATE: FEBRUARY 5, 2008 -TITLE- DHC-6 ELEVATOR CONTROL CABLE WEAR SURVEY RESULTS ISSUE: 2 PAGE 2 respondents, representing 16 aircraft, operate outside the tropics and have a cycle/hour ratio of 1.6 to 2.8. Most respondents have reported that carbon steel elevator control cables are more wear resistant than stainless steel cables. Two operators in the tropics, representing 39 aircraft, use.' - }) - }, -}; - -export const WithoutUrl: Story = { - args: { - source: new ChatbotSource({ - title: 'Document interne.pdf', - description: 'Document à usage interne uniquement, sans lien externe.' - }) - }, -}; diff --git a/airwatch/src/app/chatbot/toggle-button/toggle-button.stories.ts b/airwatch/src/app/chatbot/toggle-button/toggle-button.stories.ts index 565796f..611e64f 100644 --- a/airwatch/src/app/chatbot/toggle-button/toggle-button.stories.ts +++ b/airwatch/src/app/chatbot/toggle-button/toggle-button.stories.ts @@ -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 = { - title: 'composants/boutons/ToggleButton', + title: 'composants/buttons/Chips', component: ToggleButton, tags: ['autodocs'], argTypes: { diff --git a/airwatch/src/app/color-display/color-display.stories.ts b/airwatch/src/app/color-display/color-display.stories.ts deleted file mode 100644 index c7f207d..0000000 --- a/airwatch/src/app/color-display/color-display.stories.ts +++ /dev/null @@ -1,97 +0,0 @@ -import type { Meta, StoryObj } from '@storybook/angular'; -import { ColorDisplay } from './color-display'; -import { moduleMetadata } from '@storybook/angular'; -import { NgStyle } from '@angular/common'; - -const meta: Meta = { - title: 'fondations/couleurs/ColorDisplay', - component: ColorDisplay, - tags: ['autodocs'], - decorators: [ - moduleMetadata({ - imports: [NgStyle], - providers: [] - }) - ], - argTypes: { - hexaCode: { - control: 'text', - description: "Code hexadécimal de la couleur" - }, - name: { - control: 'text', - description: "Nom de la couleur" - }, - backgroundColor: { - control: 'text', - description: "Couleur de fond (si différente du code hexa)" - } - } -}; - -export default meta; -type Story = StoryObj; - -export const Red: Story = { - args: { - hexaCode: '#cc0000', - name: 'Rouge', - backgroundColor: '' - } -}; - -export const Blue: Story = { - args: { - hexaCode: '#0000cc', - name: 'Bleu', - backgroundColor: '' - } -}; - -export const Green: Story = { - args: { - hexaCode: '#00cc00', - name: 'Vert', - backgroundColor: '' - } -}; - -export const Yellow: Story = { - args: { - hexaCode: '#ffcc00', - name: 'Jaune', - backgroundColor: '' - } -}; - -export const Purple: Story = { - args: { - hexaCode: '#9900cc', - name: 'Violet', - backgroundColor: '' - } -}; - -export const Orange: Story = { - args: { - hexaCode: '#ff6600', - name: 'Orange', - backgroundColor: '' - } -}; - -export const Black: Story = { - args: { - hexaCode: '#000000', - name: 'Noir', - backgroundColor: '' - } -}; - -export const White: Story = { - args: { - hexaCode: '#ffffff', - name: 'Blanc', - backgroundColor: '' - } -}; diff --git a/airwatch/src/app/logo/logo.stories.ts b/airwatch/src/app/logo/logo.stories.ts deleted file mode 100644 index d53f848..0000000 --- a/airwatch/src/app/logo/logo.stories.ts +++ /dev/null @@ -1,17 +0,0 @@ -import type { Meta, StoryObj } from '@storybook/angular'; -import { Logo } from './logo'; - -// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction -const meta: Meta = { - title: 'fondations/brand/Logo', - component: Logo, - tags: ['autodocs'], -}; - -export default meta; -type Story = StoryObj; - -// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args -export const Default: Story = { - args: {}, -}; \ No newline at end of file