Migrate repository directory to CSF3 notation

komodorio · Nov 1, 2023 · ec8831e · ec8831e
1 parent 7b68020
commit ec8831e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 19 deletions.
diff --git a/frontend/src/components/repository/ChartViewer.stories.tsx b/frontend/src/components/repository/ChartViewer.stories.tsx
@@ -1,6 +1,6 @@
 // ChartViewer.stories.ts|tsx
 
-import { ComponentStory, ComponentMeta } from "@storybook/react";
+import { StoryFn, Meta } from "@storybook/react";
 import ChartViewer from "./ChartViewer";
 
 //👇 This default export determines where your story goes in the story list
@@ -11,14 +11,11 @@ export default {
    */
   title: "ChartViewer",
   component: ChartViewer,
-} as ComponentMeta<typeof ChartViewer>;
+} as Meta<typeof ChartViewer>;
 
-//👇 We create a “template” of how args map to rendering
-const Template: ComponentStory<typeof ChartViewer> = (args) => (
-  <ChartViewer {...args} />
-);
-
-export const Default = Template.bind({});
+export const Default = {
+  args: defaultArgs,
+};
 
 const defaultArgs = {
   chart: {
@@ -27,6 +24,3 @@ const defaultArgs = {
     version: "v1.0.0",
   },
 };
-
-//@ts-ignore
-Default.args = defaultArgs;
diff --git a/frontend/src/components/repository/RepositoriesList.stories.tsx b/frontend/src/components/repository/RepositoriesList.stories.tsx
@@ -1,6 +1,6 @@
 // RepositoriesList.stories.ts|tsx
 
-import { ComponentStory, ComponentMeta } from "@storybook/react";
+import { StoryFn, Meta } from "@storybook/react";
 import RepositoriesList from "./RepositoriesList";
 
 //👇 This default export determines where your story goes in the story list
@@ -11,10 +11,10 @@ export default {
    */
   title: "RepositoriesList",
   component: RepositoriesList,
-} as ComponentMeta<typeof RepositoriesList>;
+} as Meta<typeof RepositoriesList>;
 
 //👇 We create a “template” of how args map to rendering
-const Template: ComponentStory<typeof RepositoriesList> = () => (
+const Template: StoryFn<typeof RepositoriesList> = () => (
   <RepositoriesList
     selectedRepository={undefined}
     // in this case we allow Unexpected empty method
@@ -24,4 +24,6 @@ const Template: ComponentStory<typeof RepositoriesList> = () => (
   />
 );
 
-export const Default = Template.bind({});
+export const Default = {
+  render: Template,
+};
diff --git a/frontend/src/components/repository/RepositoryViewer.stories.tsx b/frontend/src/components/repository/RepositoryViewer.stories.tsx
@@ -1,6 +1,6 @@
 // RepositoryViewer.stories.ts|tsx
 
-import { ComponentStory, ComponentMeta } from "@storybook/react";
+import { StoryFn, Meta } from "@storybook/react";
 import RepositoryViewer from "./RepositoryViewer";
 
 //👇 This default export determines where your story goes in the story list
@@ -11,11 +11,13 @@ export default {
    */
   title: "RepositoryViewer",
   component: RepositoryViewer,
-} as ComponentMeta<typeof RepositoryViewer>;
+} as Meta<typeof RepositoryViewer>;
 
 //👇 We create a “template” of how args map to rendering
-const Template: ComponentStory<typeof RepositoryViewer> = () => (
+const Template: StoryFn<typeof RepositoryViewer> = () => (
   <RepositoryViewer repository={undefined} />
 );
 
-export const Default = Template.bind({});
+export const Default = {
+  render: Template,
+};