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

[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