diff --git a/CHANGELOG.md b/CHANGELOG.md index 903f316d5..8bc6b88a5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## Unreleased +### Added + +- Added a _Storybook_ story for the membership card component + ### Changed - Moved the support for changing the asset profile identifier (`dataSource` and `symbol`) in the asset profile details dialog of the admin control panel from experimental to general availability diff --git a/libs/ui/src/lib/membership-card/membership-card.component.stories.ts b/libs/ui/src/lib/membership-card/membership-card.component.stories.ts new file mode 100644 index 000000000..6b6fbe038 --- /dev/null +++ b/libs/ui/src/lib/membership-card/membership-card.component.stories.ts @@ -0,0 +1,50 @@ +import { CommonModule } from '@angular/common'; +import '@angular/localize/init'; +import { MatButtonModule } from '@angular/material/button'; +import { ActivatedRoute, RouterModule } from '@angular/router'; +import { IonIcon } from '@ionic/angular/standalone'; +import { moduleMetadata } from '@storybook/angular'; +import type { Meta, StoryObj } from '@storybook/angular'; +import { addYears } from 'date-fns'; + +import { GfLogoComponent } from '../logo'; +import { GfMembershipCardComponent } from './membership-card.component'; + +export default { + title: 'Membership Card', + component: GfMembershipCardComponent, + decorators: [ + moduleMetadata({ + imports: [ + CommonModule, + GfLogoComponent, + IonIcon, + MatButtonModule, + RouterModule.forChild([]) + ], + providers: [{ provide: ActivatedRoute, useValue: {} }] + }) + ], + argTypes: { + name: { + control: { type: 'select' }, + options: ['Basic', 'Premium'] + } + } +} as Meta; + +type Story = StoryObj; + +export const Basic: Story = { + args: { + name: 'Basic' + } +}; + +export const Premium: Story = { + args: { + expiresAt: addYears(new Date(), 1).toLocaleDateString(), + hasPermissionToCreateApiKey: true, + name: 'Premium' + } +};