Skip to content

[Feature]: Enforce consistent typing conventions for Storybook's meta #33130

@dmytrokirpa

Description

@dmytrokirpa

Area

Tooling

Describe the feature that you would like added

Implement the enforcement of consistent typing conventions for Storybook's metadata within the workspace's eslint-rules. Once completed, this can be quickly integrated into the future eslint-plugin-react-components for use across Fluent core and extension repositories.

Example:

import type { Meta } from '@storybook/react'; 

// Valid
const const meta = {
  title: 'Some Title',
  component: SomeComponent
} satisfies Meta<typeof SomeComponent>;

// Valid
export default {
  title: 'Some Title',
  component: SomeComponent
} satisfies Meta<typeof SomeComponent>;


// Invalid
const meta: Meta<typeof SomeComponent> =  {
  title: 'Some Title',
  component: SomeComponent
};

// Invalid
const meta =  {
  title: 'Some Title',
  component: SomeComponent
} as Meta<typeof SomeComponent>;

// Invalid
export default {
  title: 'Some Title',
  component: SomeComponent
} as Meta<typeof SomeComponent>;

Originally discussed here microsoft/fluentui-contrib#252 (comment)

Additional context

No response

Have you discussed this feature with our team

@microsoft/cxe-prg

Validations

  • Check that there isn't already an issue that requests the same feature to avoid creating a duplicate.

Priority

None

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions