foreman-tasks 0.17.6 → 1.2.0

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/RunningTasksCard/RunningTasksCard.stories.js

@@ -1,7 +1,6 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, number, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { number, select, action } from '@theforeman/stories';
+
 import { withCardsDecorator } from '../../../../../../../stories/decorators';
 
 import {
@@ -11,41 +10,47 @@ import {
 } from '../../../../TasksDashboardConstants';
 import RunningTasksCard from './RunningTasksCard';
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .addDecorator(withCardsDecorator)
-  .add('RunningTasksCard', () => {
-    const selectTime = select(
-      'time',
-      TASKS_DASHBOARD_AVAILABLE_TIMES,
-      RunningTasksCard.defaultProps.time
-    );
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/Cards/RunningTasksCard',
+  component: RunningTasksCard,
+  decorators: [withCardsDecorator],
+  parameters: {
+    centered: { disable: true },
+  },
+};
+
+export const Basic = () => {
+  const selectTime = select(
+    'time',
+    TASKS_DASHBOARD_AVAILABLE_TIMES,
+    RunningTasksCard.defaultProps.time
+  );
 
-    const selectMode = select(
-      'mode',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: 'none', TOTAL: null },
-      'none'
-    );
-    return (
-      <RunningTasksCard
-        data={{
-          last: number('data.last', 3),
-          older: number('data.older', 5),
-        }}
-        time={selectTime}
-        query={{
-          state: select(
-            'query.state',
-            {
-              ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
-              NONE: null,
-            },
-            TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.RUNNING
-          ),
-          mode: selectMode,
-          time: selectTime,
-        }}
-        updateQuery={action('updateQuery')}
-      />
-    );
-  });
+  const selectMode = select(
+    'mode',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: 'none', TOTAL: null },
+    'none'
+  );
+  return (
+    <RunningTasksCard
+      data={{
+        last: number('data.last', 3),
+        older: number('data.older', 5),
+      }}
+      time={selectTime}
+      query={{
+        state: select(
+          'query.state',
+          {
+            ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
+            NONE: null,
+          },
+          TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.RUNNING
+        ),
+        mode: selectMode,
+        time: selectTime,
+      }}
+      updateQuery={action('updateQuery')}
+    />
+  );
+};

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/RunningTasksCard/RunningTasksCard.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import RunningTasksCard from './RunningTasksCard';
 

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/ScheduledTasksCard/ScheduledTasksCard.stories.js

@@ -1,28 +1,33 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, number, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { number, select, action } from '@theforeman/stories';
+
 import { withCardsDecorator } from '../../../../../../../stories/decorators';
 
 import { TASKS_DASHBOARD_AVAILABLE_QUERY_STATES } from '../../../../TasksDashboardConstants';
 import ScheduledTasksCard from './ScheduledTasksCard';
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .addDecorator(withCardsDecorator)
-  .add('ScheduledTasksCard', () => {
-    const selectState = select(
-      'query.state',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES, NONE: 'none' },
-      'none'
-    );
-    return (
-      <ScheduledTasksCard
-        data={number('data', 1)}
-        query={{
-          state: selectState,
-        }}
-        updateQuery={action('updateQuery')}
-      />
-    );
-  });
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/Cards/ScheduledTasksCard',
+  component: ScheduledTasksCard,
+  decorators: [withCardsDecorator],
+  parameters: {
+    centered: { disable: true },
+  },
+};
+
+export const Basic = () => {
+  const selectState = select(
+    'query.state',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES, NONE: 'none' },
+    'none'
+  );
+  return (
+    <ScheduledTasksCard
+      data={number('data', 1)}
+      query={{
+        state: selectState,
+      }}
+      updateQuery={action('updateQuery')}
+    />
+  );
+};

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/ScheduledTasksCard/ScheduledTasksCard.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import { TASKS_DASHBOARD_AVAILABLE_QUERY_STATES } from '../../../../TasksDashboardConstants';
 import ScheduledTasksCard from './ScheduledTasksCard';

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/StoppedTasksCard/StoppedTasksCard.stories.js

@@ -1,7 +1,6 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, number, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { number, select, action } from '@theforeman/stories';
+
 import { withCardsDecorator } from '../../../../../../../stories/decorators';
 
 import {
@@ -12,56 +11,62 @@ import {
 } from '../../../../TasksDashboardConstants';
 import StoppedTasksCard from './StoppedTasksCard';
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .addDecorator(withCardsDecorator)
-  .add('StoppedTasksCard', () => {
-    const selectTime = select(
-      'time',
-      TASKS_DASHBOARD_AVAILABLE_TIMES,
-      StoppedTasksCard.defaultProps.time
-    );
-    const selectState = select(
-      'query.state',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES, NONE: null },
-      TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.STOPPED
-    );
-    const selectResult = select(
-      'query.result',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS, NONE: null },
-      null
-    );
-    const selectMode = select(
-      'query.mode',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: null },
-      null
-    );
-    return (
-      <div>
-        <StoppedTasksCard
-          data={{
-            error: {
-              total: number('errorTotal', 8),
-              last: number('errorLast', 1),
-            },
-            warning: {
-              total: number('warningTotal', 20),
-              last: number('warningLast', 2),
-            },
-            success: {
-              total: number('successTotal', 25),
-              last: number('successLast', 3),
-            },
-          }}
-          time={selectTime}
-          query={{
-            state: selectState,
-            result: selectResult,
-            mode: selectMode,
-            time: selectTime,
-          }}
-          updateQuery={action('updateQuery')}
-        />
-      </div>
-    );
-  });
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/Cards/StoppedTasksCard',
+  component: StoppedTasksCard,
+  decorators: [withCardsDecorator],
+  parameters: {
+    centered: { disable: true },
+  },
+};
+
+export const Basic = () => {
+  const selectTime = select(
+    'time',
+    TASKS_DASHBOARD_AVAILABLE_TIMES,
+    StoppedTasksCard.defaultProps.time
+  );
+  const selectState = select(
+    'query.state',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_STATES, NONE: null },
+    TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.STOPPED
+  );
+  const selectResult = select(
+    'query.result',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS, NONE: null },
+    null
+  );
+  const selectMode = select(
+    'query.mode',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: null },
+    null
+  );
+  return (
+    <div>
+      <StoppedTasksCard
+        data={{
+          error: {
+            total: number('errorTotal', 8),
+            last: number('errorLast', 1),
+          },
+          warning: {
+            total: number('warningTotal', 20),
+            last: number('warningLast', 2),
+          },
+          success: {
+            total: number('successTotal', 25),
+            last: number('successLast', 3),
+          },
+        }}
+        time={selectTime}
+        query={{
+          state: selectState,
+          result: selectResult,
+          mode: selectMode,
+          time: selectTime,
+        }}
+        updateQuery={action('updateQuery')}
+      />
+    </div>
+  );
+};

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/StoppedTasksCard/StoppedTasksCard.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 import {
   TASKS_DASHBOARD_AVAILABLE_TIMES,
   TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/TasksDonutCard/TasksDonutCard.stories.js

@@ -1,7 +1,6 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, number, text, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { number, text, select, action } from '@theforeman/stories';
+
 import { withCardsDecorator } from '../../../../../../../stories/decorators';
 
 import {
@@ -10,37 +9,43 @@ import {
 } from '../../../../TasksDashboardConstants';
 import TasksDonutCard from './TasksDonutCard';
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .addDecorator(withCardsDecorator)
-  .add('TasksDonutCard', () => {
-    const selectTime = select(
-      'time',
-      TASKS_DASHBOARD_AVAILABLE_TIMES,
-      TasksDonutCard.defaultProps.time
-    );
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/Cards/TasksDonutCard',
+  component: TasksDonutCard,
+  decorators: [withCardsDecorator],
+  parameters: {
+    centered: { disable: true },
+  },
+};
+
+export const Basic = () => {
+  const selectTime = select(
+    'time',
+    TASKS_DASHBOARD_AVAILABLE_TIMES,
+    TasksDonutCard.defaultProps.time
+  );
 
-    const selectMode = select(
-      'mode',
-      { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: 'none' },
-      'none'
-    );
+  const selectMode = select(
+    'mode',
+    { ...TASKS_DASHBOARD_AVAILABLE_QUERY_MODES, NONE: 'none' },
+    'none'
+  );
 
-    return (
-      <TasksDonutCard
-        title={text('title', 'Some Title')}
-        data={{
-          last: number('data.last', 3),
-          older: number('data.older', 5),
-        }}
-        time={selectTime}
-        query={{
-          state: text('query.state', 'some-state'),
-          mode: selectMode,
-          time: selectTime,
-        }}
-        wantedQueryState={text('wantedQueryState', 'wanted-state')}
-        updateQuery={action('updateQuery')}
-      />
-    );
-  });
+  return (
+    <TasksDonutCard
+      title={text('title', 'Some Title')}
+      data={{
+        last: number('data.last', 3),
+        older: number('data.older', 5),
+      }}
+      time={selectTime}
+      query={{
+        state: text('query.state', 'some-state'),
+        mode: selectMode,
+        time: selectTime,
+      }}
+      wantedQueryState={text('wantedQueryState', 'wanted-state')}
+      updateQuery={action('updateQuery')}
+    />
+  );
+};

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/TasksDonutCard/TasksDonutCard.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import {
   TASKS_DASHBOARD_AVAILABLE_TIMES,

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/TasksDonutChart/TasksDonutChart.stories.js

@@ -1,25 +1,26 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, number, text, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { number, text, select, action } from '@theforeman/stories';
 
 import { TASKS_DONUT_CHART_FOCUSED_ON_OPTIONS_ARRAY } from './TasksDonutChartConstants';
 import TasksDonutChart from './TasksDonutChart';
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .add('TasksDonutChart', () => (
-    <TasksDonutChart
-      last={number('last', 3)}
-      older={number('older', 5)}
-      time={text('time', '24h')}
-      focusedOn={select(
-        'focusedOn',
-        TASKS_DONUT_CHART_FOCUSED_ON_OPTIONS_ARRAY,
-        TasksDonutChart.defaultProps.focusedOn
-      )}
-      onTotalClick={action('onTotalClick')}
-      onLastClick={action('onLastClick')}
-      onOlderClick={action('onOlderClick')}
-    />
-  ));
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/Charts/TasksDonutChart',
+  component: TasksDonutChart,
+};
+
+export const Basic = () => (
+  <TasksDonutChart
+    last={number('last', 3)}
+    older={number('older', 5)}
+    time={text('time', '24h')}
+    focusedOn={select(
+      'focusedOn',
+      TASKS_DONUT_CHART_FOCUSED_ON_OPTIONS_ARRAY,
+      TasksDonutChart.defaultProps.focusedOn
+    )}
+    onTotalClick={action('onTotalClick')}
+    onLastClick={action('onLastClick')}
+    onOlderClick={action('onOlderClick')}
+  />
+);

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/Components/TasksDonutChart/TasksDonutChart.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import { TASKS_DONUT_CHART_FOCUSED_ON_OPTIONS_ARRAY } from './TasksDonutChartConstants';
 import TasksDonutChart from './TasksDonutChart';

data/webpack/ForemanTasks/Components/TasksDashboard/Components/TasksCardsGrid/TasksCardsGrid.stories.js

@@ -1,7 +1,5 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { withKnobs, object, select } from '@storybook/addon-knobs';
-import { action } from '@storybook/addon-actions';
+import { object, select, action } from '@theforeman/stories';
 
 import {
   TASKS_DASHBOARD_AVAILABLE_TIMES,
@@ -12,43 +10,46 @@ import {
 import { MOCKED_DATA } from './TasksCardsGrid.fixtures';
 import TasksCardsGrid from './TasksCardsGrid';
 
+export default {
+  title: 'TasksDashboard/TasksCardsGrid/TasksCardsGrid',
+  component: TasksCardsGrid,
+};
+
 const createSelect = (name, options) =>
   select(name, { ...options, NONE: 'none' }, 'none');
 
-storiesOf('TasksDashboard/TasksCardsGrid', module)
-  .addDecorator(withKnobs)
-  .add('TasksCardsGrid', () => {
-    const selectTime = select(
-      'time',
-      TASKS_DASHBOARD_AVAILABLE_TIMES,
-      TasksCardsGrid.defaultProps.time
-    );
-    const selectState = createSelect(
-      'query.state',
-      TASKS_DASHBOARD_AVAILABLE_QUERY_STATES
-    );
-    const selectResult = createSelect(
-      'query.result',
-      TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS
-    );
-    const selectMode = createSelect(
-      'query.mode',
-      TASKS_DASHBOARD_AVAILABLE_QUERY_MODES
-    );
+export const Basic = () => {
+  const selectTime = select(
+    'time',
+    TASKS_DASHBOARD_AVAILABLE_TIMES,
+    TasksCardsGrid.defaultProps.time
+  );
+  const selectState = createSelect(
+    'query.state',
+    TASKS_DASHBOARD_AVAILABLE_QUERY_STATES
+  );
+  const selectResult = createSelect(
+    'query.result',
+    TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS
+  );
+  const selectMode = createSelect(
+    'query.mode',
+    TASKS_DASHBOARD_AVAILABLE_QUERY_MODES
+  );
 
-    return (
-      <div>
-        <TasksCardsGrid
-          time={selectTime}
-          query={{
-            state: selectState,
-            result: selectResult,
-            mode: selectMode,
-            time: selectTime,
-          }}
-          data={object('data', MOCKED_DATA)}
-          updateQuery={action('updateQuery')}
-        />
-      </div>
-    );
-  });
+  return (
+    <div>
+      <TasksCardsGrid
+        time={selectTime}
+        query={{
+          state: selectState,
+          result: selectResult,
+          mode: selectMode,
+          time: selectTime,
+        }}
+        data={object('data', MOCKED_DATA)}
+        updateQuery={action('updateQuery')}
+      />
+    </div>
+  );
+};