TasksLabelsRow.stories.js in foreman-tasks-1.0.1

- old
+ new

@@ -1,22 +1,21 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, object } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
-import { Grid } from 'patternfly-react';
+import { object, action } from '@theforeman/stories';
 
 import { TASKS_DASHBOARD_AVAILABLE_TIMES } from '../../TasksDashboardConstants';
 import TasksLabelsRow from './TasksLabelsRow';
 
-storiesOf('TasksDashboard/TasksLabelsRow', module)
-  .addDecorator(withKnobs)
-  .addDecorator(storyFn => <Grid style={{ padding: 40 }}>{storyFn()}</Grid>)
-  .add('TasksLabelsRow', () => (
-    <TasksLabelsRow
-      query={object('query', {
-        state: 'running',
-        mode: 'last',
-        time: TASKS_DASHBOARD_AVAILABLE_TIMES.H24,
-      })}
-      deleteQueryKey={action('deleteQueryKey')}
-    />
-  ));
+export default {
+  title: 'TasksDashboard/TasksLabelsRow',
+  component: TasksLabelsRow,
+};
+
+export const Basic = () => (
+  <TasksLabelsRow
+    query={object('query', {
+      state: 'running',
+      mode: 'last',
+      time: TASKS_DASHBOARD_AVAILABLE_TIMES.H24,
+    })}
+    updateQuery={action('updateQuery')}
+  />
+);