quipucords · cdcabrera · Sep 30, 2022 · Sep 20, 2022
diff --git a/public/locales/en.json b/public/locales/en.json
@@ -56,9 +56,12 @@
     "label_option_TLSv1_2": "TLSv1.2",
     "label_option_sshKey": "SSH Key",
     "label_option_usernamePassword": "Username and Password",
-    "label_option_network": "Network Credential",
-    "label_option_satellite": "Satellite Credential",
-    "label_option_vcenter": "VCenter Credential",
+    "label_option_network": "Network",
+    "label_option_network_credential": "Network Credential",
+    "label_option_satellite": "Satellite",
+    "label_option_satellite_credential": "Satellite Credential",
+    "label_option_vcenter": "VCenter",
+    "label_option_vcenter_credential": "VCenter Credential",
     "label_placeholder_add-credential": "Add Credential",
     "label_placeholder_add-source_credential": "Select a credential",
     "label_placeholder_add-source_credential_add": "Add a credential",
@@ -202,6 +205,31 @@
     "title_error": "Error",
     "title_warning": "Warning"
   },
+  "toolbar": {
+    "label_chip": "{{context}}",
+    "label_chip_network": "Network",
+    "label_chip_satellite": "Satellite",
+    "label_chip_vcenter": "VCenter",
+    "label_clear-filters": "Reset filters",
+    "label_option": "",
+    "label_option_name": "Name",
+    "label_option_cred_type": "Credential type",
+    "label_option_most_recent_connect_scan__start_time": "Most recent",
+    "label_option_search_credentials_by_name": "Credential name",
+    "label_option_search_by_name": "Name",
+    "label_option_search_sources_by_name": "Source name",
+    "label_option_source_type": "Source type",
+    "label_placeholder_filter": "Filter by",
+    "label_placeholder_filter_cred_type": "Filter by credential type",
+    "label_placeholder_filter_search_credentials_by_name": "Filter by credential name",
+    "label_placeholder_filter_search_by_name": "Filter by name",
+    "label_placeholder_filter_search_sources_by_name": "Filter by source name",
+    "label_placeholder_filter_source_type": "Filter by source type",
+    "label_placeholder_sort": "Sort by",
+    "label_tooltip_sort": "Sort order",
+    "label_tooltip_sort_asc": "Sort ascending",
+    "label_tooltip_sort_dsc": "Sort descending"
+  },
   "view": {
     "empty-state_description_credentials": "Credentials contain authentication information needed to scan a source. A credential includes a username and a password or SSH key. {{name}} uses SSH to connect to servers on the network and uses credentials to access those servers.",
     "empty-state_description_scans": "Select a Source to scan from the Sources page.",

diff --git a/src/common/__tests__/__snapshots__/helpers.test.js.snap b/src/common/__tests__/__snapshots__/helpers.test.js.snap
@@ -64,13 +64,6 @@ Object {
 }
 `;
 
-exports[`Helpers should handle view related selectors and props updates: createViewQueryObject 1`] = `
-Object {
-  "page": 1,
-  "page_size": 10,
-}
-`;
-
 exports[`Helpers should have specific functions: helpers 1`] = `
 Object {
   "DEV_MODE": false,
@@ -85,7 +78,6 @@ Object {
   "UI_VERSION": "0.0.0.0000000",
   "aggregatedError": [Function],
   "copyClipboard": [Function],
-  "createViewQueryObject": [Function],
   "devModeNormalizeCount": [Function],
   "downloadData": [Function],
   "generateId": [Function],

diff --git a/src/common/__tests__/helpers.test.js b/src/common/__tests__/helpers.test.js
@@ -40,19 +40,6 @@ describe('Helpers', () => {
     expect(helpers.setPropIfTruthy(truthyObj, ['lorem'], '')).toMatchSnapshot('setPropIfTruthy string');
   });
 
-  it('should handle view related selectors and props updates', () => {
-    const viewOptions = {
-      currentPage: 1,
-      pageSize: 10
-    };
-
-    const queryObj = {
-      page: 2
-    };
-
-    expect(helpers.createViewQueryObject(viewOptions, queryObj)).toMatchSnapshot('createViewQueryObject');
-  });
-
   it('should handle http status less than 400 message from response', () => {
     const payload = {
       data: {},

diff --git a/src/common/helpers.js b/src/common/helpers.js
@@ -180,36 +180,6 @@ const setPropIfDefined = (obj, props, value) => (obj && value !== undefined ? _s
  */
 const setPropIfTruthy = (obj, props, value) => (obj && value ? _set(obj, props, value) : obj);
 
-/**
- * Generate a consistent query parameter object for views.
- *
- * @param {object} viewOptions
- * @param {object} queryObj
- * @returns {object}
- */
-const createViewQueryObject = (viewOptions, queryObj) => {
-  const queryObject = {
-    ...queryObj
-  };
-
-  if (viewOptions) {
-    if (viewOptions.sortField) {
-      queryObject.ordering = viewOptions.sortAscending ? viewOptions.sortField : `-${viewOptions.sortField}`;
-    }
-
-    if (viewOptions.activeFilters) {
-      viewOptions.activeFilters.forEach(filter => {
-        queryObject[filter.field.id] = filter.field.filterType === 'select' ? filter.value.id : filter.value;
-      });
-    }
-
-    queryObject.page = viewOptions.currentPage;
-    queryObject.page_size = viewOptions.pageSize;
-  }
-
-  return queryObject;
-};
-
 /**
  * A redux helper associated with getting a message from results.
  *
@@ -483,7 +453,6 @@ const helpers = {
   noopTranslate,
   setPropIfDefined,
   setPropIfTruthy,
-  createViewQueryObject,
   getMessageFromResults,
   getStatusFromResults,
   getTimeStampFromResults,

diff --git a/src/components/addCredentialType/addCredentialType.js b/src/components/addCredentialType/addCredentialType.js
@@ -10,9 +10,12 @@ import { translate } from '../i18n/i18n';
  * @type {{title: Function|string, value: string}[]}
  */
 const fieldOptions = [
-  { title: () => translate('form-dialog.label', { context: ['option', 'network'] }), value: 'network' },
-  { title: () => translate('form-dialog.label', { context: ['option', 'satellite'] }), value: 'satellite' },
-  { title: () => translate('form-dialog.label', { context: ['option', 'vcenter'] }), value: 'vcenter' }
+  { title: () => translate('form-dialog.label', { context: ['option', 'network', 'credential'] }), value: 'network' },
+  {
+    title: () => translate('form-dialog.label', { context: ['option', 'satellite', 'credential'] }),
+    value: 'satellite'
+  },
+  { title: () => translate('form-dialog.label', { context: ['option', 'vcenter', 'credential'] }), value: 'vcenter' }
 ];
 
 /**

diff --git a/src/components/addSourceWizard/__tests__/__snapshots__/addSourceWizard.test.js.snap b/src/components/addSourceWizard/__tests__/__snapshots__/addSourceWizard.test.js.snap
@@ -47,7 +47,8 @@ Array [
   ],
   Array [
     Object {
-      "type": "UPDATE_SOURCES",
+      "type": "UPDATE_VIEW",
+      "viewId": "sources",
     },
   ],
 ]

diff --git a/src/components/addSourceWizard/addSourceWizard.js b/src/components/addSourceWizard/addSourceWizard.js
@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ModalVariant } from '@patternfly/react-core';
 import { reduxActions, reduxTypes, storeHooks } from '../../redux';
+import { CONFIG as sourcesConfig } from '../sources/sources';
 import { addSourceWizardSteps, editSourceWizardSteps } from './addSourceWizardConstants';
 import { Wizard } from '../wizard/wizard';
 import { useGetAddSource } from './addSourceWizardContext';
@@ -74,7 +75,8 @@ const AddSourceWizard = ({
 
       if (fulfilled) {
         dispatch({
-          type: reduxTypes.sources.UPDATE_SOURCES
+          type: reduxTypes.view.UPDATE_VIEW,
+          viewId: sourcesConfig.viewId
         });
       }
     };

diff --git a/src/components/createCredentialDialog/__tests__/createCredentialDialog.test.js b/src/components/createCredentialDialog/__tests__/createCredentialDialog.test.js
@@ -12,7 +12,7 @@ describe('CreateCredentialDialog Component', () => {
   const generateEmptyStore = (obj = {}) => configureMockStore()(obj);
 
   it('should render a connected component', () => {
-    const store = generateEmptyStore({ credentials: { dialog: { show: true } }, viewOptions: {} });
+    const store = generateEmptyStore({ credentials: { dialog: { show: true } } });
 
     const component = mount(
       <Provider store={store}>

diff --git a/src/components/createCredentialDialog/createCredentialDialog.js b/src/components/createCredentialDialog/createCredentialDialog.js
@@ -86,7 +86,7 @@ class CreateCredentialDialog extends React.Component {
 
   // eslint-disable-next-line camelcase
   UNSAFE_componentWillReceiveProps(nextProps) {
-    const { edit, fulfilled, getCredentials, show, viewOptions } = this.props;
+    const { edit, fulfilled, getCredentials, show } = this.props;
 
     if (!show && nextProps.show) {
       this.resetInitialState(nextProps);
@@ -105,7 +105,7 @@ class CreateCredentialDialog extends React.Component {
       });
 
       this.onCancel();
-      getCredentials(helpers.createViewQueryObject(viewOptions));
+      getCredentials();
     }
   }
 
@@ -466,8 +466,7 @@ CreateCredentialDialog.propTypes = {
   fulfilled: PropTypes.bool,
   error: PropTypes.bool,
   errorMessage: PropTypes.string,
-  t: PropTypes.func,
-  viewOptions: PropTypes.object
+  t: PropTypes.func
 };
 
 CreateCredentialDialog.defaultProps = {
@@ -482,8 +481,7 @@ CreateCredentialDialog.defaultProps = {
   fulfilled: false,
   error: false,
   errorMessage: null,
-  t: translate,
-  viewOptions: {}
+  t: translate
 };
 
 const mapDispatchToProps = dispatch => ({
@@ -493,8 +491,7 @@ const mapDispatchToProps = dispatch => ({
 });
 
 const mapStateToProps = state => ({
-  ...state.credentials.dialog,
-  viewOptions: state.viewOptions[reduxTypes.view.CREDENTIALS_VIEW]
+  ...state.credentials.dialog
 });
 
 const ConnectedCreateCredentialDialog = connect(mapStateToProps, mapDispatchToProps)(CreateCredentialDialog);

diff --git a/src/components/createScanDialog/createScanDialog.js b/src/components/createScanDialog/createScanDialog.js
@@ -15,6 +15,7 @@ import {
 import { FieldLevelHelp } from 'patternfly-react';
 import { Modal } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
+import { CONFIG as sourcesConfig } from '../sources/sources';
 import { FormState } from '../formState/formState';
 import { formHelpers } from '../form/formHelpers';
 import { Checkbox } from '../form/checkbox';
@@ -148,7 +149,8 @@ class CreateScanDialog extends React.Component {
         });
 
         store.dispatch({
-          type: reduxTypes.sources.UPDATE_SOURCES
+          type: reduxTypes.view.UPDATE_VIEW,
+          viewId: sourcesConfig.viewId
         });
       },
       () => {

diff --git a/src/components/credentials/__tests__/__snapshots__/credentials.test.js.snap b/src/components/credentials/__tests__/__snapshots__/credentials.test.js.snap
@@ -21,7 +21,8 @@ exports[`Credentials Component should handle multiple display states, pending, e
     className="quipucords-view-container"
   >
     <ViewToolbar
-      actions={
+      lastRefresh={NaN}
+      secondaryFields={
         <React.Fragment>
           <AddCredentialType
             buttonVariant="primary"
@@ -56,68 +57,18 @@ exports[`Credentials Component should handle multiple display states, pending, e
           </Button>
         </React.Fragment>
       }
-      activeFilters={Array []}
-      filterFields={
-        Array [
-          Object {
-            "filterType": "text",
-            "id": "search_by_name",
-            "placeholder": "Filter by Name",
-            "title": "Name",
-          },
-          Object {
-            "filterType": "select",
-            "filterValues": Array [
-              Object {
-                "id": "network",
-                "title": "Network",
-              },
-              Object {
-                "id": "satellite",
-                "title": "Satellite",
-              },
-              Object {
-                "id": "vcenter",
-                "title": "VCenter",
-              },
-            ],
-            "id": "cred_type",
-            "placeholder": "Filter by Credential Type",
-            "title": "Credential Type",
-          },
-        ]
-      }
-      filterType={Object {}}
-      filterValue=""
-      itemsType="Credential"
-      itemsTypePlural="Credentials"
-      lastRefresh={NaN}
-      onRefresh={[Function]}
-      selectedCount={0}
-      sortAscending={true}
-      sortFields={
-        Array [
-          Object {
-            "id": "name",
-            "isNumeric": false,
-            "title": "Name",
-          },
-          Object {
-            "id": "cred_type",
-            "isNumeric": false,
-            "title": "Credential Type",
-          },
-        ]
-      }
-      sortType={Object {}}
-      totalCount={0}
-      viewType="CREDENTIALS_VIEW"
+      t={[Function]}
+      useOnRefresh={[Function]}
+      useSelector={[Function]}
+      useToolbarFieldClear={[Function]}
+      useToolbarFieldClearAll={[Function]}
+      useView={[Function]}
     />
     <ViewPaginationRow
-      currentPage={0}
-      pageSize={0}
-      totalCount={0}
-      viewType="CREDENTIALS_VIEW"
+      totalResults={0}
+      useOnPerPageSelect={[Function]}
+      useOnSetPage={[Function]}
+      useQuery={[Function]}
     />
     <div
       className="quipucords-list-container"

diff --git a/src/components/credentials/__tests__/__snapshots__/credentialsConstants.test.js.snap b/src/components/credentials/__tests__/__snapshots__/credentialsConstants.test.js.snap