katello 3.7.0.rc1 → 3.7.0.rc2

data/webpack/scenes/Subscriptions/components/SubscriptionsTable/SubscriptionsTableHelpers.js

@@ -0,0 +1,60 @@
+const buildTableRow = (subscription, availableQuantities, updatedQuantity) => {
+  if (updatedQuantity[subscription.id]) {
+    return {
+      ...subscription,
+      entitlementsChanged: true,
+      quantity: updatedQuantity[subscription.id],
+      availableQuantity: availableQuantities[subscription.id],
+    };
+  }
+  return {
+    ...subscription,
+    availableQuantity: availableQuantities[subscription.id],
+  };
+};
+
+const buildTableRowsFromGroup = (subscriptionGroup, availableQuantities, updatedQuantity) => {
+  const { open, subscriptions } = subscriptionGroup;
+
+  // build row for each subscription
+  if (open) {
+    return subscriptions.map(subscription =>
+      buildTableRow(subscription, availableQuantities, updatedQuantity));
+  }
+
+  // build row only for the first subscription in the group
+  const [firstSubscription] = subscriptions;
+  return [buildTableRow(firstSubscription, availableQuantities, updatedQuantity)];
+};
+
+export const buildTableRows = (groupdSubscriptions, availableQuantities, updatedQuantity) => {
+  const rows = [];
+
+  Object.values(groupdSubscriptions).forEach(subscriptionGroup =>
+    rows.push(...buildTableRowsFromGroup(subscriptionGroup, availableQuantities, updatedQuantity)));
+
+  return rows;
+};
+
+export const groupSubscriptionsByProductId = ({ results: subscriptions }) => {
+  const grouped = {};
+
+  subscriptions.forEach((subscription) => {
+    if (grouped[subscription.product_id] === undefined) {
+      grouped[subscription.product_id] = {
+        open: false,
+        subscriptions: [],
+      };
+    }
+
+    grouped[subscription.product_id].subscriptions.unshift(subscription);
+  });
+
+  return grouped;
+};
+
+export const buildPools = updatedQuantity =>
+  Object.entries(updatedQuantity).map(([id, quantity]) => ({
+    id,
+    quantity,
+  }));

data/webpack/scenes/Subscriptions/{SubscriptionsTableSchema.js → components/SubscriptionsTable/SubscriptionsTableSchema.js}

@@ -1,10 +1,21 @@
+/* eslint-disable import/prefer-default-export */
 import React from 'react';
 import { Icon } from 'patternfly-react';
-import helpers, { selectionHeaderCellFormatter, selectionCellFormatter } from '../../move_to_foreman/common/helpers';
+import { Link } from 'react-router-dom';
+import helpers from '../../../../move_to_foreman/common/helpers';
 import { entitlementsInlineEditFormatter } from './EntitlementsInlineEditFormatter';
-import { headerFormat, cellFormat } from '../../move_to_foreman/components/common/table';
+import {
+  headerFormatter,
+  cellFormatter,
+  selectionHeaderCellFormatter,
+  collapseableAndSelectionCellFormatter,
+} from '../../../../move_to_foreman/components/common/table';
 
-export const columns = (inlineEditController, selectionController) => [
+export const createSubscriptionsTableSchema = (
+  inlineEditController,
+  selectionController,
+  groupingController,
+) => [
   {
     property: 'select',
     header: {
@@ -12,23 +23,27 @@ export const columns = (inlineEditController, selectionController) => [
       formatters: [label => selectionHeaderCellFormatter(selectionController, label)],
     },
     cell: {
-      formatters: [(value, additionalData) =>
-        selectionCellFormatter(selectionController, value, additionalData)],
+      formatters: [
+        (value, additionalData) =>
+          collapseableAndSelectionCellFormatter(
+            groupingController,
+            selectionController,
+            additionalData,
+          ),
+      ],
     },
   },
   {
     property: 'id',
     header: {
       label: __('Name'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
       formatters: [
         (value, { rowData }) => (
           <td>
-            <a href={helpers.urlBuilder('subscriptions', '', rowData.id)}>
-              {rowData.name}
-            </a>
+            <Link to={helpers.urlBuilder('subscriptions', '', rowData.id)}>{rowData.name}</Link>
           </td>
         ),
       ],
@@ -38,47 +53,47 @@ export const columns = (inlineEditController, selectionController) => [
     property: 'product_id',
     header: {
       label: __('SKU'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [cellFormat],
+      formatters: [cellFormatter],
     },
   },
   {
     property: 'contract_number',
     header: {
       label: __('Contract'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [cellFormat],
+      formatters: [cellFormatter],
     },
   }, // TODO: use date formatter from tomas' PR
   {
     property: 'start_date',
     header: {
       label: __('Start Date'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [cellFormat],
+      formatters: [cellFormatter],
     },
   },
   {
     property: 'end_date',
     header: {
       label: __('End Date'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [cellFormat],
+      formatters: [cellFormatter],
     },
   },
   {
     property: 'virt_who',
     header: {
       label: __('Requires Virt-Who'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
       formatters: [
@@ -94,24 +109,20 @@ export const columns = (inlineEditController, selectionController) => [
     property: 'consumed',
     header: {
       label: __('Consumed'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [cellFormat],
+      formatters: [cellFormatter],
     },
   },
   {
     property: 'quantity',
     header: {
       label: __('Entitlements'),
-      formatters: [headerFormat],
+      formatters: [headerFormatter],
     },
     cell: {
-      formatters: [
-        entitlementsInlineEditFormatter(inlineEditController),
-      ],
+      formatters: [entitlementsInlineEditFormatter(inlineEditController)],
     },
   },
 ];
-
-export default columns;

data/webpack/scenes/Subscriptions/components/SubscriptionsTable/__tests__/SubscriptionsTable.test.js

@@ -0,0 +1,56 @@
+import React from 'react';
+import { render } from 'enzyme';
+import toJson from 'enzyme-to-json';
+import { MemoryRouter } from 'react-router-dom';
+import SubscriptionsTable from '../SubscriptionsTable';
+import { successState, loadingState, emptyState } from '../../../__tests__/subscriptions.fixtures';
+import { loadSubscriptions, updateQuantity } from '../../../SubscriptionActions';
+
+describe('subscriptions table', () => {
+  it('should render a table', async () => {
+    // Wrapping SubscriptionTable in MemoryRouter here since it contains
+    // a Link componenent, which can't be used outside a Router
+    /* eslint-disable react/jsx-indent */
+    const page = render(<MemoryRouter>
+          <SubscriptionsTable
+            subscriptions={successState}
+            loadSubscriptions={loadSubscriptions}
+            updateQuantity={updateQuantity}
+            subscriptionDeleteModalOpen={false}
+            onSubscriptionDeleteModalClose={() => { }}
+            onDeleteSubscriptions={() => {}}
+            toggleDeleteButton={() => {}}
+          />
+                        </MemoryRouter>);
+    expect(toJson(page)).toMatchSnapshot();
+  });
+  /* eslint-enable react/jsx-indent */
+
+  it('should render an empty state', async () => {
+    const page = render(<MemoryRouter>
+      <SubscriptionsTable
+        subscriptions={emptyState}
+        loadSubscriptions={loadSubscriptions}
+        updateQuantity={updateQuantity}
+        subscriptionDeleteModalOpen={false}
+        onSubscriptionDeleteModalClose={() => {}}
+        onDeleteSubscriptions={() => {}}
+        toggleDeleteButton={() => {}}
+      />
+                        </MemoryRouter>);
+    expect(toJson(page)).toMatchSnapshot();
+  });
+
+  it('should render a loading state', async () => {
+    const page = render(<SubscriptionsTable
+      subscriptions={loadingState}
+      loadSubscriptions={loadSubscriptions}
+      updateQuantity={updateQuantity}
+      subscriptionDeleteModalOpen={false}
+      onSubscriptionDeleteModalClose={() => { }}
+      onDeleteSubscriptions={() => {}}
+      toggleDeleteButton={() => {}}
+    />);
+    expect(toJson(page)).toMatchSnapshot();
+  });
+});

data/webpack/scenes/Subscriptions/{__tests__ → components/SubscriptionsTable/__tests__}/__snapshots__/SubscriptionsTable.test.js.snap

@@ -2,8 +2,15 @@
 
 exports[`subscriptions table should render a loading state 1`] = `
 <div
-  class="small-spacer spinner spinner-md"
-/>
+  class="loading-state"
+>
+  <div
+    class="spinner spinner-lg"
+  />
+  <p>
+    Loading
+  </p>
+</div>
 `;
 
 exports[`subscriptions table should render a table 1`] = `
@@ -75,7 +82,9 @@ Array [
         </tr>
       </thead>
       <tbody>
-        <tr>
+        <tr
+          class=""
+        >
           <td
             class="table-view-pf-select"
           >
@@ -130,7 +139,9 @@ Array [
             Unlimited
           </td>
         </tr>
-        <tr>
+        <tr
+          class=""
+        >
           <td
             class="table-view-pf-select"
           >
@@ -188,7 +199,7 @@ Array [
       </tbody>
     </table>
     <form
-      class="content-view-pf-pagination table-view-pf-pagination clearfix "
+      class="content-view-pf-pagination table-view-pf-pagination clearfix"
     >
       <div
         class="form-group"

data/webpack/scenes/Subscriptions/components/SubscriptionsTable/index.js

@@ -0,0 +1,2 @@
+export { default as SubscriptionsTable } from './SubscriptionsTable';
+export { default as SubscriptionsTableSchema } from './SubscriptionsTableSchema';

data/webpack/scenes/Subscriptions/index.js

@@ -8,12 +8,12 @@ import * as settingActions from '../../move_to_foreman/Settings/SettingsActions'
 import reducer from './SubscriptionReducer';
 
 import SubscriptionsPage from './SubscriptionsPage';
-import './Subscriptions.scss';
 
+const EMPTY_ARRAY = [];
 // map state to props
 const mapStateToProps = state => ({
   subscriptions: state.katello.subscriptions,
-  tasks: state.katello.subscriptions.tasks,
+  tasks: state.katello.subscriptions.tasks || EMPTY_ARRAY,
 });
 
 // map action dispatchers to props

data/webpack/scenes/Tasks/TaskActions.js

@@ -52,24 +52,31 @@ export const loadTask = (taskId, extendedParams = {}) => (dispatch) => {
     }));
 };
 
+const isUnauthorized = action =>
+  (action.result && action.result.response && action.result.response.status === 401);
+
 export const pollBulkSearch = (extendedParams = {}, interval) => (dispatch) => {
-  const triggerPolling = () => {
-    setTimeout(() => dispatch(pollBulkSearch(extendedParams, interval)), interval);
+  const triggerPolling = (action) => {
+    if (!isUnauthorized(action)) {
+      setTimeout(() => dispatch(pollBulkSearch(extendedParams, interval)), interval);
+    }
   };
 
   return dispatch(bulkSearch(extendedParams)).then(triggerPolling);
 };
 
-export const pollTaskUntilDone = (taskId, extendedParams = {}, interval) =>
-  dispatch => new Promise((resolve) => {
-    const pollUntilDone = (task) => {
-      if (task.pending !== false) {
-        setTimeout(() => dispatch(loadTask(taskId, extendedParams))
-          .then(({ response }) => pollUntilDone(response)), interval);
+export const pollTaskUntilDone = (taskId, extendedParams = {}, interval) => dispatch => (
+  new Promise((resolve, reject) => {
+    const pollUntilDone = (action) => {
+      if (isUnauthorized(action)) {
+        reject(action.result);
+      } else if (action.response.pending !== false) {
+        setTimeout(() => dispatch(loadTask(taskId, extendedParams)).then(pollUntilDone), interval);
       } else {
-        resolve(task);
+        resolve(action.response);
       }
     };
 
-    pollUntilDone({ pending: true });
-  });
+    return dispatch(loadTask(taskId, extendedParams)).then(pollUntilDone);
+  })
+);

data/webpack/scenes/Tasks/__tests__/TaskActions.test.js

@@ -6,13 +6,15 @@ import configureMockStore from 'redux-mock-store';
 import {
   bulkSearchSuccessResponse,
   bulkSearchSuccessActions,
-  bulkSearchFailureActions,
+  buildBulkSearchFailureActions,
   getTaskSuccessResponse,
   getTaskSuccessActions,
-  getTaskFailureActions,
+  buildTaskFailureActions,
+  getTaskPendingResponse,
+  getTaskPendingActions,
 } from './task.fixtures';
 
-import { bulkSearch, loadTask, pollTaskUntilDone } from '../TaskActions';
+import { bulkSearch, loadTask, pollTaskUntilDone, pollBulkSearch } from '../TaskActions';
 
 const mockStore = configureMockStore([thunk]);
 const store = mockStore({ tasks: Immutable({}) });
@@ -24,13 +26,19 @@ beforeEach(() => {
 });
 
 let originalTimeout;
+let setTimeoutSpy;
 
 beforeEach(() => {
+  setTimeoutSpy = jest.spyOn(window, 'setTimeout');
+
   originalTimeout = jasmine.DEFAULT_TIMEOUT_INTERVAL;
   jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000;
 });
 
 afterEach(() => {
+  setTimeoutSpy.mockReset();
+  setTimeoutSpy.mockRestore();
+
   jasmine.DEFAULT_TIMEOUT_INTERVAL = originalTimeout;
 });
 
@@ -42,7 +50,7 @@ describe('task actions', () => {
       mockApi.onPost(url).reply(422);
 
       return store.dispatch(bulkSearch())
-        .then(() => expect(store.getActions()).toEqual(bulkSearchFailureActions));
+        .then(() => expect(store.getActions()).toEqual(buildBulkSearchFailureActions()));
     });
 
     it('and ends with success', () => {
@@ -61,7 +69,7 @@ describe('task actions', () => {
       mockApi.onGet(url).reply(422);
 
       return store.dispatch(loadTask(taskId))
-        .then(() => expect(store.getActions()).toEqual(getTaskFailureActions));
+        .then(() => expect(store.getActions()).toEqual(buildTaskFailureActions()));
     });
 
     it('and ends with success', () => {
@@ -70,12 +78,87 @@ describe('task actions', () => {
       return store.dispatch(loadTask(taskId))
         .then(() => expect(store.getActions()).toEqual(getTaskSuccessActions));
     });
+  });
 
-    it('and can poll', () => {
-      mockApi.onGet(url).reply(200, getTaskSuccessResponse);
+  describe('pollTaskUntilDone', () => {
+    const taskId = 'eb1b6271-8a69-4d98-84fc-bea06ddcc166';
+    const url = `/foreman_tasks/api/tasks/${taskId}`;
 
-      return store.dispatch(pollTaskUntilDone(taskId))
-        .then(() => expect(store.getActions()).toEqual(getTaskSuccessActions));
+    it("doesn't start polling when the task has finished", () => {
+      mockApi.onGet(url).replyOnce(200, getTaskSuccessResponse);
+
+      return store
+        .dispatch(pollTaskUntilDone(taskId, {}, 1))
+        .then(() => {
+          expect(store.getActions()).toEqual(getTaskSuccessActions);
+          expect(setTimeoutSpy).toHaveBeenCalledTimes(0);
+        });
+    });
+
+    it('polls until a task is done', () => {
+      mockApi
+        .onGet(url)
+        .replyOnce(200, getTaskPendingResponse)
+        .onGet(url)
+        .replyOnce(200, getTaskPendingResponse)
+        .onGet(url)
+        .replyOnce(200, getTaskSuccessResponse);
+
+      const expectedActions = getTaskPendingActions
+        .concat(getTaskPendingActions)
+        .concat(getTaskSuccessActions);
+
+      return store
+        .dispatch(pollTaskUntilDone(taskId, {}, 1))
+        .then(() => {
+          expect(store.getActions()).toEqual(expectedActions);
+          expect(setTimeoutSpy).toHaveBeenCalledTimes(2);
+        });
+    });
+
+    it('stops polling on unauthorized response', () => {
+      mockApi
+        .onGet(url).replyOnce(200, getTaskPendingResponse)
+        .onGet(url).replyOnce(401);
+
+      const expectedActions = getTaskPendingActions
+        .concat(buildTaskFailureActions(401));
+
+      return store
+        .dispatch(pollTaskUntilDone(taskId, {}, 1))
+        .catch(() => {
+          expect(store.getActions()).toEqual(expectedActions);
+          expect(setTimeoutSpy).toHaveBeenCalledTimes(1);
+        });
+    });
+  });
+
+  describe('pollBulkSearch', () => {
+    const url = '/foreman_tasks/api/tasks/bulk_search';
+
+    it('polls', () => {
+      mockApi
+        .onPost(url)
+        .replyOnce(200, bulkSearchSuccessResponse);
+
+      return store
+        .dispatch(pollBulkSearch({}, 1))
+        .then(() => {
+          expect(store.getActions()).toEqual(bulkSearchSuccessActions);
+          expect(setTimeoutSpy).toHaveBeenCalledTimes(1);
+        });
+    });
+
+    it('stops polling on unauthorized response', () => {
+      mockApi
+        .onPost(url).replyOnce(401);
+
+      return store
+        .dispatch(pollBulkSearch({}, 1))
+        .then(() => {
+          expect(store.getActions()).toEqual(buildBulkSearchFailureActions(401));
+          expect(setTimeoutSpy).toHaveBeenCalledTimes(0);
+        });
     });
   });
 });