diff --git a/public/locales/en.json b/public/locales/en.json
index 6186fad9..b18545cb 100644
--- a/public/locales/en.json
+++ b/public/locales/en.json
@@ -9,7 +9,20 @@
     "ui-version": "UI Version",
     "username": "Username"
   },
+  "form-dialog": {
+    "label_cancel": "Cancel",
+    "label_close": "Close",
+    "label_submit": "Submit",
+    "label_submit_confirmation": "Confirm",
+    "label_submit_create-credential": "Save",
+    "label_submit_create-scan": "Scan",
+    "label_submit_merge-reports": "Merge"
+  },
   "modal": {
     "aria-label-default": "Application modal"
+  },
+  "view": {
+    "loading": "Loading...",
+    "loading_credentials": "Loading credentials..."
   }
 }
diff --git a/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap b/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap
index 50e85f91..e02ba140 100644
--- a/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap
+++ b/src/components/authentication/__tests__/__snapshots__/authentication.test.js.snap
@@ -183,43 +183,26 @@ exports[`Authentication Component should render a non-connected component error:
 
 exports[`Authentication Component should render a non-connected component pending: non-connected pending 1`] = `
 <Modal
-  animation={false}
-  autoFocus={true}
+  aria-label={null}
   backdrop={false}
-  bsClass="modal"
-  bsSize="lg"
-  dialogComponentClass={[Function]}
-  enforceFocus={true}
-  keyboard={true}
-  manager={
-    ModalManager {
-      "add": [Function],
-      "containers": Array [],
-      "data": Array [],
-      "handleContainerOverflow": true,
-      "hideSiblingNodes": true,
-      "isTopModal": [Function],
-      "modals": Array [],
-      "remove": [Function],
-    }
-  }
-  onHide={[Function]}
-  renderBackdrop={[Function]}
-  restoreFocus={true}
-  show={true}
+  className={null}
+  disableFocusTrap={true}
+  footer={null}
+  header={null}
+  isOpen={true}
+  position="top"
+  positionOffset="5%"
+  showClose={false}
+  t={[Function]}
+  variant="medium"
 >
-  <ModalBody
-    bsClass="modal-body"
-    componentClass="div"
+  <div
+    className="spinner spinner-xl"
+  />
+  <div
+    className="text-center"
   >
-    <div
-      className="spinner spinner-xl"
-    />
-    <div
-      className="text-center"
-    >
-      Logging in...
-    </div>
-  </ModalBody>
+    Logging in...
+  </div>
 </Modal>
 `;
diff --git a/src/components/authentication/authentication.js b/src/components/authentication/authentication.js
index e4df0ea5..37ef665c 100644
--- a/src/components/authentication/authentication.js
+++ b/src/components/authentication/authentication.js
@@ -1,7 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
-import { Alert, EmptyState, Modal } from 'patternfly-react';
+import { Alert, EmptyState } from 'patternfly-react';
+import { Modal, ModalVariant } from '../modal/modal';
 import { reduxActions } from '../../redux';
 import helpers from '../../common/helpers';
 import { PageLayout } from '../pageLayout/pageLayout';
@@ -24,11 +25,9 @@ class Authentication extends React.Component {
 
     if (session.pending) {
       return (
-        <Modal bsSize="lg" backdrop={false} show animation={false}>
-          <Modal.Body>
-            <div className="spinner spinner-xl" />
-            <div className="text-center">Logging in...</div>
-          </Modal.Body>
+        <Modal variant={ModalVariant.medium} backdrop={false} isOpen disableFocusTrap>
+          <div className="spinner spinner-xl" />
+          <div className="text-center">Logging in...</div>
         </Modal>
       );
     }
diff --git a/src/components/confirmationModal/__tests__/__snapshots__/confirmationModal.test.js.snap b/src/components/confirmationModal/__tests__/__snapshots__/confirmationModal.test.js.snap
index a593f4d1..ebf3774b 100644
--- a/src/components/confirmationModal/__tests__/__snapshots__/confirmationModal.test.js.snap
+++ b/src/components/confirmationModal/__tests__/__snapshots__/confirmationModal.test.js.snap
@@ -4,82 +4,121 @@ exports[`Confirmation Modal Component should NOT display a confirmation modal: h
 
 exports[`Confirmation Modal Component should display a confirmation modal: show 1`] = `
 <div
-  role="dialog"
+  class="pf-c-backdrop"
 >
   <div
-    class="fade modal-backdrop in"
-  />
-  <div
-    aria-describedby=""
-    aria-labelledby=""
-    aria-modal="true"
-    class="fade message-dialog-pf in modal"
-    role="dialog"
-    style="display: block; padding-right: 0px;"
-    tabindex="-1"
+    class="pf-l-bullseye"
   >
     <div
-      class="modal-dialog"
+      aria-describedby="pf-modal-part-2"
+      aria-label="t(modal.aria-label-default)"
+      aria-labelledby="pf-modal-part-0"
+      aria-modal="true"
+      class="pf-c-modal-box pf-m-align-top"
+      data-ouia-component-id="OUIA-Generated-Modal-1"
+      data-ouia-component-type="PF4/ModalContent"
+      data-ouia-safe="true"
+      id="pf-modal-part-0"
+      role="dialog"
+      style="--pf-c-modal-box--m-align-top--spacer: 5%;"
     >
+      <button
+        aria-disabled="false"
+        aria-label="Close"
+        class="pf-c-button pf-m-plain"
+        data-ouia-component-id="OUIA-Generated-Modal-1-ModalBoxCloseButton"
+        data-ouia-component-type="PF4/Button"
+        data-ouia-safe="true"
+        type="button"
+      >
+        <svg
+          aria-hidden="true"
+          fill="currentColor"
+          height="1em"
+          role="img"
+          style="vertical-align: -0.125em;"
+          viewBox="0 0 352 512"
+          width="1em"
+        >
+          <path
+            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+          />
+        </svg>
+      </button>
+      <header
+        class="pf-c-modal-box__header"
+      >
+        <h4
+          class="pf-c-title pf-m-md"
+          data-ouia-component-id="OUIA-Generated-Title-1"
+          data-ouia-component-type="PF4/Title"
+          data-ouia-safe="true"
+        >
+          Confirm
+        </h4>
+      </header>
       <div
-        class="modal-content"
-        role="document"
+        aria-live="polite"
+        class="pf-c-modal-box__body"
+        id="pf-modal-part-2"
       >
         <div
-          class="modal-header"
+          aria-label="Default Alert"
+          class="pf-c-alert pf-m-inline pf-m-plain"
+          data-ouia-component-id="OUIA-Generated-Alert-default-1"
+          data-ouia-component-type="PF4/Alert"
+          data-ouia-safe="true"
         >
-          <button
-            class="close"
+          <div
+            class="pf-c-alert__icon"
           >
-            <span
+            <svg
               aria-hidden="true"
-              class="pficon pficon-close"
-              title="Close"
-            />
-            <span
-              class="sr-only"
+              fill="currentColor"
+              height="1em"
+              role="img"
+              style="vertical-align: -0.125em;"
+              viewBox="0 0 896 1024"
+              width="1em"
             >
-              Close
-            </span>
-          </button>
+              <path
+                d="M448,0 C465.333333,0 480.333333,6.33333333 493,19 C505.666667,31.6666667 512,46.6666667 512,64 L512,106 L514.23,106.45 C587.89,121.39 648.48,157.24 696,214 C744,271.333333 768,338.666667 768,416 C768,500 780,568.666667 804,622 C818.666667,652.666667 841.333333,684 872,716 C873.773676,718.829136 875.780658,721.505113 878,724 C890,737.333333 896,752.333333 896,769 C896,785.666667 890,800.333333 878,813 C866,825.666667 850.666667,832 832,832 L63.3,832 C44.9533333,831.84 29.8533333,825.506667 18,813 C6,800.333333 0,785.666667 0,769 C0,752.333333 6,737.333333 18,724 L24,716 L25.06,714.9 C55.1933333,683.28 77.5066667,652.313333 92,622 C116,568.666667 128,500 128,416 C128,338.666667 152,271.333333 200,214 C248,156.666667 309.333333,120.666667 384,106 L384,63.31 C384.166667,46.27 390.5,31.5 403,19 C415.666667,6.33333333 430.666667,0 448,0 Z M576,896 L576,897.08 C575.74,932.6 563.073333,962.573333 538,987 C512.666667,1011.66667 482.666667,1024 448,1024 C413.333333,1024 383.333333,1011.66667 358,987 C332.666667,962.333333 320,932 320,896 L576,896 Z"
+              />
+            </svg>
+          </div>
           <h4
-            class="modal-title"
-            id=""
+            class="pf-c-alert__title"
           >
-            Confirm
+            <span
+              class="pf-u-screen-reader"
+            >
+              Default alert:
+            </span>
+            test
           </h4>
-        </div>
-        <div
-          class="modal-body"
-        >
           <div
-            id=""
+            class="pf-c-alert__description"
           >
-            <p>
-              test
-            </p>
             <p>
               Test body
             </p>
           </div>
         </div>
-        <div
-          class="modal-footer"
-        >
-          <button
-            class="btn btn-default"
-            type="button"
-          >
-            Cancel
-          </button>
-          <button
-            class="btn btn-primary"
-            type="button"
-          >
-            Confirm
-          </button>
-        </div>
       </div>
+      <footer
+        class="pf-c-modal-box__footer"
+      >
+        <button
+          aria-disabled="false"
+          class="pf-c-button pf-m-secondary"
+          data-ouia-component-id="OUIA-Generated-Button-secondary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
+        >
+          Cancel
+        </button>
+      </footer>
     </div>
   </div>
 </div>
diff --git a/src/components/confirmationModal/__tests__/confirmationModal.test.js b/src/components/confirmationModal/__tests__/confirmationModal.test.js
index 68913aad..08e98e0f 100644
--- a/src/components/confirmationModal/__tests__/confirmationModal.test.js
+++ b/src/components/confirmationModal/__tests__/confirmationModal.test.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import configureMockStore from 'redux-mock-store';
 import { Provider } from 'react-redux';
-import { mount, shallow } from 'enzyme';
+import { shallow } from 'enzyme';
 import { ConnectedConfirmationModal, ConfirmationModal } from '../confirmationModal';
 
 describe('Confirmation Modal Component', () => {
@@ -28,7 +28,7 @@ describe('Confirmation Modal Component', () => {
     expect(component.find(ConnectedConfirmationModal)).toMatchSnapshot('connected');
   });
 
-  it('should display a confirmation modal', () => {
+  it('should display a confirmation modal', async () => {
     const onCancel = jest.fn();
     const props = {
       show: true,
@@ -41,21 +41,19 @@ describe('Confirmation Modal Component', () => {
       onCancel
     };
 
-    const component = mount(<ConfirmationModal {...props} />);
-
+    const component = await mountHookComponent(<ConfirmationModal {...props} />);
     expect(component.render()).toMatchSnapshot('show');
 
-    component.find('button[className="btn btn-default"]').simulate('click');
+    component.find('button[className="pf-c-button pf-m-secondary"]').simulate('click');
     expect(onCancel).toHaveBeenCalledTimes(1);
   });
 
-  it('should NOT display a confirmation modal', () => {
+  it('should NOT display a confirmation modal', async () => {
     const props = {
       show: false
     };
 
-    const component = mount(<ConfirmationModal {...props} />);
-
+    const component = await mountHookComponent(<ConfirmationModal {...props} />);
     expect(component.render()).toMatchSnapshot('hidden');
   });
 });
diff --git a/src/components/confirmationModal/confirmationModal.js b/src/components/confirmationModal/confirmationModal.js
index f96c996a..aee1f6f8 100644
--- a/src/components/confirmationModal/confirmationModal.js
+++ b/src/components/confirmationModal/confirmationModal.js
@@ -1,8 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { MessageDialog, Icon } from 'patternfly-react';
+import { Alert, AlertVariant, Button, ButtonVariant, Title } from '@patternfly/react-core';
+import { Modal } from '../modal/modal';
 import { connect, store, reduxTypes } from '../../redux';
-import helpers from '../../common/helpers';
+import { translate } from '../i18n/i18n';
 
 const ConfirmationModal = ({
   show,
@@ -13,7 +14,8 @@ const ConfirmationModal = ({
   confirmButtonText,
   cancelButtonText,
   onConfirm,
-  onCancel
+  onCancel,
+  t
 }) => {
   const cancel = () => {
     if (onCancel) {
@@ -25,19 +27,43 @@ const ConfirmationModal = ({
     }
   };
 
+  const setActions = () => {
+    const actions = [];
+
+    if (onConfirm) {
+      actions.push(
+        <Button key="submit" onClick={onConfirm}>
+          {confirmButtonText || t('form-dialog.label', { context: ['submit', 'confirmation'] })}
+        </Button>
+      );
+    }
+
+    actions.push(
+      <Button key="cancel" variant={ButtonVariant.secondary} onClick={cancel}>
+        {cancelButtonText || t('form-dialog.label', { context: 'cancel' })}
+      </Button>
+    );
+
+    return actions;
+  };
+
   return (
-    <MessageDialog
-      primaryAction={onConfirm}
-      secondaryAction={cancel}
-      onHide={cancel}
-      icon={icon}
-      show={show}
-      title={title}
-      primaryActionButtonContent={confirmButtonText}
-      secondaryActionButtonContent={cancelButtonText}
-      primaryContent={<p>{heading}</p>}
-      secondaryContent={<p>{body}</p>}
-    />
+    <Modal
+      className="quipucords-modal__confirmation"
+      isOpen={show}
+      backdrop={false}
+      showClose
+      onClose={cancel}
+      actions={setActions()}
+      header={
+        <Title headingLevel="h4">{title || t('form-dialog.label', { context: ['submit', 'confirmation'] })}</Title>
+      }
+      disableFocusTrap
+    >
+      <Alert isInline isPlain variant={icon || undefined} title={heading}>
+        {body && <p>{body}</p>}
+      </Alert>
+    </Modal>
   );
 };
 
@@ -50,18 +76,20 @@ ConfirmationModal.propTypes = {
   confirmButtonText: PropTypes.string,
   cancelButtonText: PropTypes.string,
   onConfirm: PropTypes.func,
-  onCancel: PropTypes.func
+  onCancel: PropTypes.func,
+  t: PropTypes.func
 };
 
 ConfirmationModal.defaultProps = {
-  title: 'Confirm',
+  title: null,
   heading: null,
   body: null,
-  icon: <Icon type="pf" name="warning-triangle-o" />,
-  confirmButtonText: 'Confirm',
-  cancelButtonText: '',
-  onConfirm: helpers.noop,
-  onCancel: null
+  icon: AlertVariant.warning,
+  confirmButtonText: null,
+  cancelButtonText: null,
+  onConfirm: null,
+  onCancel: null,
+  t: translate
 };
 
 const mapStateToProps = state => ({ ...state.confirmationModal });
diff --git a/src/components/createCredentialDialog/__tests__/__snapshots__/createCredentialDialog.test.js.snap b/src/components/createCredentialDialog/__tests__/__snapshots__/createCredentialDialog.test.js.snap
index 7cc8ee11..ca4a2d72 100644
--- a/src/components/createCredentialDialog/__tests__/__snapshots__/createCredentialDialog.test.js.snap
+++ b/src/components/createCredentialDialog/__tests__/__snapshots__/createCredentialDialog.test.js.snap
@@ -2,47 +2,64 @@
 
 exports[`CreateCredentialDialog Component should render a connected component: connected 1`] = `
 <div
-  role="dialog"
+  class="pf-c-backdrop"
 >
   <div
-    class="fade modal-backdrop in"
-  />
-  <div
-    class="fade in modal"
-    role="dialog"
-    style="display: block; padding-right: 0px;"
-    tabindex="-1"
+    class="pf-l-bullseye"
   >
     <div
-      class="modal-dialog"
+      aria-describedby="pf-modal-part-2"
+      aria-label="t(modal.aria-label-default)"
+      aria-labelledby="pf-modal-part-0"
+      aria-modal="true"
+      class="pf-c-modal-box pf-m-align-top"
+      data-ouia-component-id="OUIA-Generated-Modal-1"
+      data-ouia-component-type="PF4/ModalContent"
+      data-ouia-safe="true"
+      id="pf-modal-part-0"
+      role="dialog"
+      style="--pf-c-modal-box--m-align-top--spacer: 5%;"
     >
-      <div
-        class="modal-content"
-        role="document"
+      <button
+        aria-disabled="false"
+        aria-label="Close"
+        class="pf-c-button pf-m-plain"
+        data-ouia-component-id="OUIA-Generated-Modal-1-ModalBoxCloseButton"
+        data-ouia-component-type="PF4/Button"
+        data-ouia-safe="true"
+        type="button"
       >
-        <div
-          class="modal-header"
+        <svg
+          aria-hidden="true"
+          fill="currentColor"
+          height="1em"
+          role="img"
+          style="vertical-align: -0.125em;"
+          viewBox="0 0 352 512"
+          width="1em"
         >
-          <button
-            aria-hidden="true"
-            aria-label="Close"
-            class="close btn btn-default"
-            type="button"
-          >
-            <span
-              aria-hidden="true"
-              class="pficon pficon-close"
-            />
-          </button>
-          <h4
-            class="modal-title"
-          >
-            Add Credential
-          </h4>
-        </div>
-        <div
-          class="modal-body"
-        />
+          <path
+            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+          />
+        </svg>
+      </button>
+      <header
+        class="pf-c-modal-box__header"
+      >
+        <h4
+          class="pf-c-title pf-m-md"
+          data-ouia-component-id="OUIA-Generated-Title-1"
+          data-ouia-component-type="PF4/Title"
+          data-ouia-safe="true"
+        >
+          Add Credential
+        </h4>
+      </header>
+      <div
+        aria-live="polite"
+        class="pf-c-modal-box__body"
+        id="pf-modal-part-2"
+      >
         <div
           class="container-fluid"
         >
@@ -191,24 +208,32 @@ exports[`CreateCredentialDialog Component should render a connected component: c
             </div>
           </form>
         </div>
-        <div
-          class="modal-footer"
-        >
-          <button
-            class="btn-cancel btn btn-default"
-            type="button"
-          >
-            Cancel
-          </button>
-          <button
-            class="btn btn-primary"
-            disabled=""
-            type="button"
-          >
-            Save
-          </button>
-        </div>
       </div>
+      <footer
+        class="pf-c-modal-box__footer"
+      >
+        <button
+          aria-disabled="true"
+          class="pf-c-button pf-m-primary pf-m-disabled"
+          data-ouia-component-id="OUIA-Generated-Button-primary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          disabled=""
+          type="button"
+        >
+          t(form-dialog.label, {"context":"submit_create-credential"})
+        </button>
+        <button
+          aria-disabled="false"
+          class="pf-c-button pf-m-secondary"
+          data-ouia-component-id="OUIA-Generated-Button-secondary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
+        >
+          t(form-dialog.label, {"context":"cancel"})
+        </button>
+      </footer>
     </div>
   </div>
 </div>
diff --git a/src/components/createCredentialDialog/createCredentialDialog.js b/src/components/createCredentialDialog/createCredentialDialog.js
index 76ae544f..4c58c5e3 100644
--- a/src/components/createCredentialDialog/createCredentialDialog.js
+++ b/src/components/createCredentialDialog/createCredentialDialog.js
@@ -1,10 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Modal, Alert, Button, Icon, Form, Grid } from 'patternfly-react';
+import { Button, ButtonVariant, Title } from '@patternfly/react-core';
+import { Alert, Form, Grid } from 'patternfly-react';
+import { Modal } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
 import { helpers } from '../../common/helpers';
 import { authDictionary, dictionary } from '../../constants/dictionaryConstants';
 import DropdownSelect from '../dropdownSelect/dropdownSelect';
+import { translate } from '../i18n/i18n';
 
 class CreateCredentialDialog extends React.Component {
   static renderFormLabel(label) {
@@ -396,7 +399,7 @@ class CreateCredentialDialog extends React.Component {
   }
 
   render() {
-    const { show, edit } = this.props;
+    const { show, edit, t } = this.props;
     const {
       credentialType,
       credentialName,
@@ -408,14 +411,20 @@ class CreateCredentialDialog extends React.Component {
     } = this.state;
 
     return (
-      <Modal show={show} onHide={this.onCancel}>
-        <Modal.Header>
-          <Button className="close" onClick={this.onCancel} aria-hidden="true" aria-label="Close">
-            <Icon type="pf" name="close" />
+      <Modal
+        isOpen={show}
+        showClose
+        onClose={this.onCancel}
+        header={<Title headingLevel="h4">{edit ? `View Credential - ${credentialName}` : 'Add Credential'}</Title>}
+        actions={[
+          <Button key="save" onClick={this.onSave} isDisabled={!this.validateForm()}>
+            {t('form-dialog.label', { context: ['submit', 'create-credential'] })}
+          </Button>,
+          <Button key="cancel" variant={ButtonVariant.secondary} autoFocus={edit} onClick={this.onCancel}>
+            {t('form-dialog.label', { context: 'cancel' })}
           </Button>
-          <Modal.Title>{edit ? `View Credential - ${credentialName}` : 'Add Credential'}</Modal.Title>
-        </Modal.Header>
-        <Modal.Body />
+        ]}
+      >
         <Grid fluid>
           {this.renderErrorMessage()}
           <Form horizontal>
@@ -474,14 +483,6 @@ class CreateCredentialDialog extends React.Component {
             {this.renderNetworkForm()}
           </Form>
         </Grid>
-        <Modal.Footer>
-          <Button bsStyle="default" className="btn-cancel" autoFocus={edit} onClick={this.onCancel}>
-            Cancel
-          </Button>
-          <Button bsStyle="primary" onClick={this.onSave} disabled={!this.validateForm()}>
-            Save
-          </Button>
-        </Modal.Footer>
       </Modal>
     );
   }
@@ -499,6 +500,7 @@ CreateCredentialDialog.propTypes = {
   fulfilled: PropTypes.bool,
   error: PropTypes.bool,
   errorMessage: PropTypes.string,
+  t: PropTypes.func,
   viewOptions: PropTypes.object
 };
 
@@ -514,6 +516,7 @@ CreateCredentialDialog.defaultProps = {
   fulfilled: false,
   error: false,
   errorMessage: null,
+  t: translate,
   viewOptions: {}
 };
 
diff --git a/src/components/createScanDialog/__tests__/__snapshots__/createScanDialog.test.js.snap b/src/components/createScanDialog/__tests__/__snapshots__/createScanDialog.test.js.snap
index 20285467..70eedbeb 100644
--- a/src/components/createScanDialog/__tests__/__snapshots__/createScanDialog.test.js.snap
+++ b/src/components/createScanDialog/__tests__/__snapshots__/createScanDialog.test.js.snap
@@ -64,307 +64,330 @@ exports[`CreateScanDialog Component should render a connected component with def
 
 exports[`CreateScanDialog Component should render a non-connected component: non-connected 1`] = `
 <div
-  role="dialog"
+  class="pf-c-backdrop"
 >
   <div
-    class="fade modal-backdrop in"
-  />
-  <div
-    class="fade in modal"
-    role="dialog"
-    style="display: block; padding-right: 0px;"
-    tabindex="-1"
+    class="pf-l-bullseye"
   >
     <div
-      class="modal-dialog"
+      aria-describedby="pf-modal-part-2"
+      aria-label="t(modal.aria-label-default)"
+      aria-labelledby="pf-modal-part-0"
+      aria-modal="true"
+      class="pf-c-modal-box pf-m-align-top"
+      data-ouia-component-id="OUIA-Generated-Modal-1"
+      data-ouia-component-type="PF4/ModalContent"
+      data-ouia-safe="true"
+      id="pf-modal-part-0"
+      role="dialog"
+      style="--pf-c-modal-box--m-align-top--spacer: 5%;"
     >
+      <button
+        aria-disabled="false"
+        aria-label="Close"
+        class="pf-c-button pf-m-plain"
+        data-ouia-component-id="OUIA-Generated-Modal-1-ModalBoxCloseButton"
+        data-ouia-component-type="PF4/Button"
+        data-ouia-safe="true"
+        type="button"
+      >
+        <svg
+          aria-hidden="true"
+          fill="currentColor"
+          height="1em"
+          role="img"
+          style="vertical-align: -0.125em;"
+          viewBox="0 0 352 512"
+          width="1em"
+        >
+          <path
+            d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
+          />
+        </svg>
+      </button>
+      <header
+        class="pf-c-modal-box__header"
+      >
+        <h4
+          class="pf-c-title pf-m-md"
+          data-ouia-component-id="OUIA-Generated-Title-1"
+          data-ouia-component-type="PF4/Title"
+          data-ouia-safe="true"
+        >
+          Scan
+        </h4>
+      </header>
       <div
-        class="modal-content"
-        role="document"
+        aria-live="polite"
+        class="pf-c-modal-box__body"
+        id="pf-modal-part-2"
       >
         <form
           class="form-horizontal"
         >
           <div
-            class="modal-header"
+            class="form-group"
           >
-            <button
-              aria-hidden="true"
-              aria-label="Close"
-              class="close"
-              type="button"
+            <label
+              class="col-sm-3 control-label"
+              for="generatedid-"
             >
-              <span
-                aria-hidden="true"
-                class="pficon pficon-close"
-              />
-            </button>
-            <h4
-              class="modal-title"
+              Name
+            </label>
+            <div
+              class="col-sm-9"
             >
-              Scan
-            </h4>
+              <input
+                class="form-control"
+                id="generatedid-"
+                maxlength="256"
+                name="scanName"
+                placeholder="Enter a name for the scan"
+                type="text"
+                value=""
+              />
+            </div>
           </div>
           <div
-            aria-live="polite"
-            class="modal-body"
+            class="form-group"
           >
-            <div
-              class="form-group"
+            <label
+              class="col-sm-3 control-label"
+              for="generatedid-"
             >
-              <label
-                class="col-sm-3 control-label"
-                for="generatedid-"
-              >
-                Name
-              </label>
-              <div
-                class="col-sm-9"
-              >
-                <input
-                  class="form-control"
-                  id="generatedid-"
-                  maxlength="256"
-                  name="scanName"
-                  placeholder="Enter a name for the scan"
-                  type="text"
-                  value=""
-                />
-              </div>
-            </div>
+              Sources
+            </label>
             <div
-              class="form-group"
+              class="col-sm-9"
             >
-              <label
-                class="col-sm-3 control-label"
-                for="generatedid-"
-              >
-                Sources
-              </label>
-              <div
-                class="col-sm-9"
+              <textarea
+                class="quipucords-form-control form-control"
+                id="generatedid-"
+                name="displayScanSources"
+                readonly=""
+                rows="2"
               >
-                <textarea
-                  class="quipucords-form-control form-control"
-                  id="generatedid-"
-                  name="displayScanSources"
-                  readonly=""
-                  rows="2"
-                >
-                  test name
-                </textarea>
-              </div>
+                test name
+              </textarea>
             </div>
+          </div>
+          <div
+            class="form-group"
+          >
+            <label
+              class="col-sm-3 control-label"
+              for="scanConcurrency"
+            >
+              Maximum concurrent scans
+            </label>
             <div
-              class="form-group"
+              class="col-sm-9"
             >
-              <label
-                class="col-sm-3 control-label"
-                for="scanConcurrency"
-              >
-                Maximum concurrent scans
-              </label>
-              <div
-                class="col-sm-9"
+              <span
+                class="cloudmeter-touchspin cloudmeter-scan-dialog-touchspin input-group"
               >
                 <span
-                  class="cloudmeter-touchspin cloudmeter-scan-dialog-touchspin input-group"
+                  class="input-group-btn"
                 >
-                  <span
-                    class="input-group-btn"
-                  >
-                    <button
-                      aria-hidden="true"
-                      class="cloudmeter-touchspin-min-button form-control btn btn-default"
-                      tabindex="-1"
-                      title="Decrease number input"
-                      type="button"
-                    >
-                      <span
-                        aria-hidden="true"
-                        class="fa fa-minus"
-                      />
-                    </button>
-                  </span>
-                  <input
-                    class="cloudmeter-touchspin-input form-control"
-                    id="scanConcurrency"
-                    name="scanConcurrency"
-                    type="text"
-                    value="25"
-                  />
-                  <span
-                    class="input-group-btn"
+                  <button
+                    aria-hidden="true"
+                    class="cloudmeter-touchspin-min-button form-control btn btn-default"
+                    tabindex="-1"
+                    title="Decrease number input"
+                    type="button"
                   >
-                    <button
+                    <span
                       aria-hidden="true"
-                      class="cloudmeter-touchspin-max-button form-control btn btn-default"
-                      tabindex="-1"
-                      title="Increase number input"
-                      type="button"
-                    >
-                      <span
-                        aria-hidden="true"
-                        class="fa fa-plus"
-                      />
-                    </button>
-                  </span>
+                      class="fa fa-minus"
+                    />
+                  </button>
                 </span>
+                <input
+                  class="cloudmeter-touchspin-input form-control"
+                  id="scanConcurrency"
+                  name="scanConcurrency"
+                  type="text"
+                  value="25"
+                />
                 <span
-                  class="help-block"
+                  class="input-group-btn"
                 >
-                  <abbr
-                    title="Minimum value 1, maximum value 200"
-                  >
-                    1 - 200
-                  </abbr>
-                </span>
-              </div>
-            </div>
-            <div
-              class="form-group"
-            >
-              <label
-                class="col-sm-3 control-label"
-                for="generatedid-"
-              >
-                <div>
-                  Deep scan
-                  <br />
-                  for these
-                  <br />
-                  products
                   <button
-                    class="popover-pf-info btn btn-link"
+                    aria-hidden="true"
+                    class="cloudmeter-touchspin-max-button form-control btn btn-default"
+                    tabindex="-1"
+                    title="Increase number input"
                     type="button"
                   >
                     <span
                       aria-hidden="true"
-                      class="pficon pficon-info"
+                      class="fa fa-plus"
                     />
                   </button>
-                </div>
-              </label>
-              <div
-                class="col-sm-9"
+                </span>
+              </span>
+              <span
+                class="help-block"
               >
-                <div
-                  class="checkbox"
+                <abbr
+                  title="Minimum value 1, maximum value 200"
                 >
-                  <label
-                    title=""
-                  >
-                    <input
-                      name="jbossEap"
-                      type="checkbox"
-                    />
-                    <abbr
-                      title="Red Hat JBoss Enterprise Application Platform"
-                    >
-                      JBoss EAP
-                    </abbr>
-                  </label>
-                </div>
-                <div
-                  class="checkbox"
+                  1 - 200
+                </abbr>
+              </span>
+            </div>
+          </div>
+          <div
+            class="form-group"
+          >
+            <label
+              class="col-sm-3 control-label"
+              for="generatedid-"
+            >
+              <div>
+                Deep scan
+                <br />
+                for these
+                <br />
+                products
+                <button
+                  class="popover-pf-info btn btn-link"
+                  type="button"
                 >
-                  <label
-                    title=""
-                  >
-                    <input
-                      name="jbossFuse"
-                      type="checkbox"
-                    />
-                    <abbr
-                      title="Red Hat Fuse"
-                    >
-                      Fuse
-                    </abbr>
-                  </label>
-                </div>
-                <div
-                  class="checkbox"
+                  <span
+                    aria-hidden="true"
+                    class="pficon pficon-info"
+                  />
+                </button>
+              </div>
+            </label>
+            <div
+              class="col-sm-9"
+            >
+              <div
+                class="checkbox"
+              >
+                <label
+                  title=""
                 >
-                  <label
-                    title=""
+                  <input
+                    name="jbossEap"
+                    type="checkbox"
+                  />
+                  <abbr
+                    title="Red Hat JBoss Enterprise Application Platform"
                   >
-                    <input
-                      name="jbossWs"
-                      type="checkbox"
-                    />
-                    <abbr
-                      title="Red Hat JBoss Web Server"
-                    >
-                      JBoss Web Server
-                    </abbr>
-                  </label>
-                </div>
-                <div
-                  class="checkbox"
+                    JBoss EAP
+                  </abbr>
+                </label>
+              </div>
+              <div
+                class="checkbox"
+              >
+                <label
+                  title=""
                 >
-                  <label
-                    title=""
+                  <input
+                    name="jbossFuse"
+                    type="checkbox"
+                  />
+                  <abbr
+                    title="Red Hat Fuse"
                   >
-                    <input
-                      name="jbossBrms"
-                      type="checkbox"
-                    />
-                    <abbr
-                      title="Red Hat Decision Manager, formerly Red Hat JBoss BRMS"
-                    >
-                      Decision Manager
-                    </abbr>
-                  </label>
-                </div>
+                    Fuse
+                  </abbr>
+                </label>
               </div>
-            </div>
-            <div
-              class="form-group"
-            >
-              <label
-                class="col-sm-3 control-label"
-                for="generatedid-"
+              <div
+                class="checkbox"
               >
-                Scan alternate directories
-              </label>
+                <label
+                  title=""
+                >
+                  <input
+                    name="jbossWs"
+                    type="checkbox"
+                  />
+                  <abbr
+                    title="Red Hat JBoss Web Server"
+                  >
+                    JBoss Web Server
+                  </abbr>
+                </label>
+              </div>
               <div
-                class="col-sm-9"
+                class="checkbox"
               >
-                <textarea
-                  class="vertical-scroll form-control"
-                  disabled=""
-                  id="generatedid-"
-                  name="displayScanDirectories"
-                  placeholder="Optional. Enter values separated by commas"
-                  rows="4"
-                />
-                <span
-                  class="help-block"
+                <label
+                  title=""
                 >
-                  Default directories are /, /opt, /app, /home, /usr
-                </span>
+                  <input
+                    name="jbossBrms"
+                    type="checkbox"
+                  />
+                  <abbr
+                    title="Red Hat Decision Manager, formerly Red Hat JBoss BRMS"
+                  >
+                    Decision Manager
+                  </abbr>
+                </label>
               </div>
             </div>
           </div>
           <div
-            class="modal-footer"
+            class="form-group"
           >
-            <button
-              class="btn-cancel btn btn-default"
-              type="button"
+            <label
+              class="col-sm-3 control-label"
+              for="generatedid-"
             >
-              Cancel
-            </button>
-            <button
-              class="btn btn-primary"
-              disabled=""
-              type="submit"
+              Scan alternate directories
+            </label>
+            <div
+              class="col-sm-9"
             >
-              Scan
-            </button>
+              <textarea
+                class="vertical-scroll form-control"
+                disabled=""
+                id="generatedid-"
+                name="displayScanDirectories"
+                placeholder="Optional. Enter values separated by commas"
+                rows="4"
+              />
+              <span
+                class="help-block"
+              >
+                Default directories are /, /opt, /app, /home, /usr
+              </span>
+            </div>
           </div>
         </form>
       </div>
+      <footer
+        class="pf-c-modal-box__footer"
+      >
+        <button
+          aria-disabled="true"
+          class="pf-c-button pf-m-primary pf-m-disabled"
+          data-ouia-component-id="OUIA-Generated-Button-primary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          disabled=""
+          type="button"
+        >
+          t(form-dialog.label, {"context":"submit_create-scan"})
+        </button>
+        <button
+          aria-disabled="false"
+          class="pf-c-button pf-m-secondary"
+          data-ouia-component-id="OUIA-Generated-Button-secondary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
+        >
+          t(form-dialog.label, {"context":"cancel"})
+        </button>
+      </footer>
     </div>
   </div>
 </div>
diff --git a/src/components/createScanDialog/createScanDialog.js b/src/components/createScanDialog/createScanDialog.js
index 4ae395d9..f7fb60ab 100644
--- a/src/components/createScanDialog/createScanDialog.js
+++ b/src/components/createScanDialog/createScanDialog.js
@@ -1,12 +1,15 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Alert, Button, FieldLevelHelp, Form, Icon, Modal, Spinner } from 'patternfly-react';
+import { Button, ButtonVariant, Title } from '@patternfly/react-core';
+import { Alert, FieldLevelHelp, Form, Spinner } from 'patternfly-react';
+import { Modal } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
 import { FormState } from '../formState/formState';
 import { FormField, fieldValidation } from '../formField/formField';
 import { TouchSpin } from '../touchspin/touchspin';
 import helpers from '../../common/helpers';
 import apiTypes from '../../constants/apiConstants';
+import { translate } from '../i18n/i18n';
 
 class CreateScanDialog extends React.Component {
   onClose = () => {
@@ -319,63 +322,70 @@ class CreateScanDialog extends React.Component {
   }
 
   render() {
-    const { pending, show, sources } = this.props;
+    const { pending, show, sources, t } = this.props;
 
     if (!sources || sources.length === 0 || !sources[0]) {
       return null;
     }
 
+    const formActions = (onSubmit, isValid) => {
+      const updatedActions = [];
+      if (!pending) {
+        updatedActions.push(
+          <Button key="scan" onClick={onSubmit} isDisabled={!isValid}>
+            {t('form-dialog.label', { context: ['submit', 'create-scan'] })}
+          </Button>
+        );
+        updatedActions.push(
+          <Button key="cancel" variant={ButtonVariant.secondary} onClick={this.onClose}>
+            {t('form-dialog.label', { context: 'cancel' })}
+          </Button>
+        );
+      }
+      return updatedActions;
+    };
+
     return (
-      <Modal show={show} onHide={this.onClose}>
-        <FormState
-          validateOnMount={false}
-          setValues={{
-            displayScanDirectories: '',
-            displayScanSources: sources.map(item => item.name).join(', '),
-            scanConcurrency: 25,
-            scanDirectories: [],
-            jbossEap: false,
-            jbossFuse: false,
-            jbossWs: false,
-            jbossBrms: false,
-            scanName: '',
-            scanSources: sources.map(item => item.id)
-          }}
-          validate={this.onValidateForm}
-          onSubmit={this.onSubmit}
-        >
-          {({ handleOnSubmit, isValid, ...options }) => (
+      <FormState
+        validateOnMount={false}
+        setValues={{
+          displayScanDirectories: '',
+          displayScanSources: sources.map(item => item.name).join(', '),
+          scanConcurrency: 25,
+          scanDirectories: [],
+          jbossEap: false,
+          jbossFuse: false,
+          jbossWs: false,
+          jbossBrms: false,
+          scanName: '',
+          scanSources: sources.map(item => item.id)
+        }}
+        validate={this.onValidateForm}
+        onSubmit={this.onSubmit}
+      >
+        {({ handleOnSubmit, isValid, ...options }) => (
+          <Modal
+            isOpen={show}
+            showClose
+            onClose={this.onClose}
+            header={<Title headingLevel="h4">Scan</Title>}
+            actions={formActions(handleOnSubmit, isValid)}
+          >
             <Form horizontal onSubmit={handleOnSubmit}>
-              <Modal.Header>
-                <button type="button" className="close" onClick={this.onClose} aria-hidden="true" aria-label="Close">
-                  <Icon type="pf" name="close" />
-                </button>
-                <Modal.Title>Scan</Modal.Title>
-              </Modal.Header>
-              <Modal.Body aria-live="polite">
-                {pending && (
-                  <React.Fragment>
-                    <Spinner loading size="lg" className="blank-slate-pf-icon" />
-                    <div className="text-center">Scan updating...</div>
-                  </React.Fragment>
-                )}
-                {!pending && this.renderErrorMessage(options)}
-                {!pending && this.renderNameSources(options)}
-                {!pending && this.renderConcurrentScans(options)}
-                {!pending && this.renderAdditionalProducts(options)}
-              </Modal.Body>
-              <Modal.Footer>
-                <Button bsStyle="default" className="btn-cancel" onClick={this.onClose}>
-                  Cancel
-                </Button>
-                <Button bsStyle="primary" type="submit" disabled={!isValid}>
-                  Scan
-                </Button>
-              </Modal.Footer>
+              {pending && (
+                <React.Fragment>
+                  <Spinner loading size="lg" className="blank-slate-pf-icon" />
+                  <div className="text-center">Scan updating...</div>
+                </React.Fragment>
+              )}
+              {!pending && this.renderErrorMessage(options)}
+              {!pending && this.renderNameSources(options)}
+              {!pending && this.renderConcurrentScans(options)}
+              {!pending && this.renderAdditionalProducts(options)}
             </Form>
-          )}
-        </FormState>
-      </Modal>
+          </Modal>
+        )}
+      </FormState>
     );
   }
 }
@@ -394,7 +404,8 @@ CreateScanDialog.propTypes = {
     scanDirectories: PropTypes.string,
     scanName: PropTypes.string,
     scanSources: PropTypes.string
-  })
+  }),
+  t: PropTypes.func
 };
 
 CreateScanDialog.defaultProps = {
@@ -404,7 +415,8 @@ CreateScanDialog.defaultProps = {
   fulfilled: false,
   pending: false,
   startScan: helpers.noop,
-  submitErrorMessages: {}
+  submitErrorMessages: {},
+  t: translate
 };
 
 const mapDispatchToProps = dispatch => ({
diff --git a/src/components/credentials/credentials.js b/src/components/credentials/credentials.js
index 36ca4fa3..ced3d0bb 100644
--- a/src/components/credentials/credentials.js
+++ b/src/components/credentials/credentials.js
@@ -1,9 +1,10 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Alert, Button, DropdownButton, EmptyState, Form, Grid, ListView, MenuItem, Modal } from 'patternfly-react';
 import _get from 'lodash/get';
 import _isEqual from 'lodash/isEqual';
 import _size from 'lodash/size';
+import { Alert, Button, DropdownButton, EmptyState, Form, Grid, ListView, MenuItem } from 'patternfly-react';
+import { Modal, ModalVariant } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
 import helpers from '../../common/helpers';
 import ViewToolbar from '../viewToolbar/viewToolbar';
@@ -11,6 +12,7 @@ import ViewPaginationRow from '../viewPaginationRow/viewPaginationRow';
 import CredentialsEmptyState from './credentialsEmptyState';
 import CredentialListItem from './credentialListItem';
 import { CredentialFilterFields, CredentialSortFields } from './credentialConstants';
+import { translate } from '../i18n/i18n';
 
 class Credentials extends React.Component {
   credentialsToDelete = [];
@@ -217,15 +219,13 @@ class Credentials extends React.Component {
   }
 
   renderPendingMessage() {
-    const { pending } = this.props;
+    const { pending, t } = this.props;
 
     if (pending) {
       return (
-        <Modal bsSize="lg" backdrop={false} show animation={false}>
-          <Modal.Body>
-            <div className="spinner spinner-xl" />
-            <div className="text-center">Loading credentials...</div>
-          </Modal.Body>
+        <Modal variant={ModalVariant.medium} backdrop={false} isOpen disableFocusTrap>
+          <div className="spinner spinner-xl" />
+          <div className="text-center">{t('view.loading', { context: 'credentials' })}</div>
         </Modal>
       );
     }
@@ -319,6 +319,7 @@ Credentials.propTypes = {
   pending: PropTypes.bool,
   credentials: PropTypes.array,
   viewOptions: PropTypes.object,
+  t: PropTypes.func,
   update: PropTypes.object
 };
 
@@ -331,6 +332,7 @@ Credentials.defaultProps = {
   pending: false,
   credentials: [],
   viewOptions: {},
+  t: translate,
   update: {}
 };
 
diff --git a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap
index 6725253a..3a92195d 100644
--- a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap
+++ b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap
@@ -48,6 +48,75 @@ Array [
       },
     ],
   },
+  Object {
+    "file": "./src/components/confirmationModal/confirmationModal.js",
+    "keys": Array [
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: ['submit', 'confirmation'] })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: 'cancel' })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: ['submit', 'confirmation'] })",
+      },
+    ],
+  },
+  Object {
+    "file": "./src/components/createCredentialDialog/createCredentialDialog.js",
+    "keys": Array [
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: ['submit', 'create-credential'] })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: 'cancel' })",
+      },
+    ],
+  },
+  Object {
+    "file": "./src/components/createScanDialog/createScanDialog.js",
+    "keys": Array [
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: ['submit', 'create-scan'] })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: 'cancel' })",
+      },
+    ],
+  },
+  Object {
+    "file": "./src/components/credentials/credentials.js",
+    "keys": Array [
+      Object {
+        "key": "view.loading",
+        "match": "t('view.loading', { context: 'credentials' })",
+      },
+    ],
+  },
+  Object {
+    "file": "./src/components/mergeReportsDialog/mergeReportsDialog.js",
+    "keys": Array [
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: 'close' })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: ['submit', 'merge-reports'] })",
+      },
+      Object {
+        "key": "form-dialog.label",
+        "match": "t('form-dialog.label', { context: 'cancel' })",
+      },
+    ],
+  },
   Object {
     "file": "./src/components/modal/modal.js",
     "keys": Array [
@@ -57,10 +126,71 @@ Array [
       },
     ],
   },
+  Object {
+    "file": "./src/components/scans/scans.js",
+    "keys": Array [
+      Object {
+        "key": "view.loading",
+        "match": "t('view.loading', { context: 'scans' })",
+      },
+    ],
+  },
+  Object {
+    "file": "./src/components/sources/sources.js",
+    "keys": Array [
+      Object {
+        "key": "view.loading",
+        "match": "t('view.loading', { context: 'sources' })",
+      },
+    ],
+  },
 ]
 `;
 
-exports[`I18n Component should have locale keys that exist in the default language JSON: predictable missing locale keys 1`] = `Array []`;
+exports[`I18n Component should have locale keys that exist in the default language JSON: predictable missing locale keys 1`] = `
+Array [
+  Object {
+    "file": "./src/components/confirmationModal/confirmationModal.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/confirmationModal/confirmationModal.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/confirmationModal/confirmationModal.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/createCredentialDialog/createCredentialDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/createCredentialDialog/createCredentialDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/createScanDialog/createScanDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/createScanDialog/createScanDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/mergeReportsDialog/mergeReportsDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/mergeReportsDialog/mergeReportsDialog.js",
+    "key": "form-dialog.label",
+  },
+  Object {
+    "file": "./src/components/mergeReportsDialog/mergeReportsDialog.js",
+    "key": "form-dialog.label",
+  },
+]
+`;
 
 exports[`I18n Component should pass children: children 1`] = `"lorem ipsum"`;
 
diff --git a/src/components/mergeReportsDialog/__tests__/__snapshots__/mergeReportsDialog.test.js.snap b/src/components/mergeReportsDialog/__tests__/__snapshots__/mergeReportsDialog.test.js.snap
index a3f01921..9bbfe2f2 100644
--- a/src/components/mergeReportsDialog/__tests__/__snapshots__/mergeReportsDialog.test.js.snap
+++ b/src/components/mergeReportsDialog/__tests__/__snapshots__/mergeReportsDialog.test.js.snap
@@ -2,48 +2,42 @@
 
 exports[`MergeReportsDialog Component should render a component, pending: pending 1`] = `
 <div
-  role="dialog"
+  class="pf-c-backdrop"
 >
   <div
-    class="fade modal-backdrop in"
-  />
-  <div
-    class="fade in modal"
-    role="dialog"
-    style="display: block; padding-right: 0px;"
-    tabindex="-1"
+    class="pf-l-bullseye"
   >
     <div
-      class="modal-dialog"
+      aria-describedby="pf-modal-part-3"
+      aria-label="t(modal.aria-label-default)"
+      aria-labelledby="pf-modal-part-1"
+      aria-modal="true"
+      class="pf-c-modal-box pf-m-align-top"
+      data-ouia-component-id="OUIA-Generated-Modal-2"
+      data-ouia-component-type="PF4/ModalContent"
+      data-ouia-safe="true"
+      id="pf-modal-part-1"
+      role="dialog"
+      style="--pf-c-modal-box--m-align-top--spacer: 5%;"
     >
-      <div
-        class="modal-content"
-        role="document"
+      <header
+        class="pf-c-modal-box__header"
       >
-        <div
-          class="modal-header"
-        >
-          <button
-            aria-hidden="true"
-            aria-label="Close"
-            class="close"
-            type="button"
-          >
-            <span
-              aria-hidden="true"
-              class="pficon pficon-close"
-            />
-          </button>
-          <h4
-            class="modal-title"
-          >
-            Merge reports
-          </h4>
-        </div>
-        <div
-          aria-live="polite"
-          class="modal-body"
+        <h4
+          class="pf-c-title pf-m-md"
+          data-ouia-component-id="OUIA-Generated-Title-2"
+          data-ouia-component-type="PF4/Title"
+          data-ouia-safe="true"
         >
+          Merge reports
+        </h4>
+      </header>
+      <div
+        aria-live="polite"
+        class="pf-c-modal-box__body"
+        id="pf-modal-part-3"
+      >
+        <div>
           <div
             class="blank-slate-pf-icon spinner spinner-lg"
           />
@@ -53,24 +47,32 @@ exports[`MergeReportsDialog Component should render a component, pending: pendin
             Merging reports...
           </div>
         </div>
-        <div
-          class="modal-footer"
-        >
-          <button
-            class="btn-cancel btn btn-default"
-            type="button"
-          >
-            Cancel
-          </button>
-          <button
-            class="btn btn-primary"
-            disabled=""
-            type="submit"
-          >
-            Merge
-          </button>
-        </div>
       </div>
+      <footer
+        class="pf-c-modal-box__footer"
+      >
+        <button
+          aria-disabled="true"
+          class="pf-c-button pf-m-primary pf-m-disabled"
+          data-ouia-component-id="OUIA-Generated-Button-primary-2"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          disabled=""
+          type="button"
+        >
+          t(form-dialog.label, {"context":"submit_merge-reports"})
+        </button>
+        <button
+          aria-disabled="false"
+          class="pf-c-button pf-m-secondary"
+          data-ouia-component-id="OUIA-Generated-Button-secondary-2"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
+        >
+          t(form-dialog.label, {"context":"cancel"})
+        </button>
+      </footer>
     </div>
   </div>
 </div>
@@ -80,48 +82,42 @@ exports[`MergeReportsDialog Component should render a connected component: conne
 
 exports[`MergeReportsDialog Component should render a non-connected component, failure and success: non-connected 1`] = `
 <div
-  role="dialog"
+  class="pf-c-backdrop"
 >
   <div
-    class="fade modal-backdrop in"
-  />
-  <div
-    class="fade in modal"
-    role="dialog"
-    style="display: block; padding-right: 0px;"
-    tabindex="-1"
+    class="pf-l-bullseye"
   >
     <div
-      class="modal-dialog"
+      aria-describedby="pf-modal-part-2"
+      aria-label="t(modal.aria-label-default)"
+      aria-labelledby="pf-modal-part-0"
+      aria-modal="true"
+      class="pf-c-modal-box pf-m-align-top"
+      data-ouia-component-id="OUIA-Generated-Modal-1"
+      data-ouia-component-type="PF4/ModalContent"
+      data-ouia-safe="true"
+      id="pf-modal-part-0"
+      role="dialog"
+      style="--pf-c-modal-box--m-align-top--spacer: 5%;"
     >
-      <div
-        class="modal-content"
-        role="document"
+      <header
+        class="pf-c-modal-box__header"
       >
-        <div
-          class="modal-header"
-        >
-          <button
-            aria-hidden="true"
-            aria-label="Close"
-            class="close"
-            type="button"
-          >
-            <span
-              aria-hidden="true"
-              class="pficon pficon-close"
-            />
-          </button>
-          <h4
-            class="modal-title"
-          >
-            Merge reports
-          </h4>
-        </div>
-        <div
-          aria-live="polite"
-          class="modal-body"
+        <h4
+          class="pf-c-title pf-m-md"
+          data-ouia-component-id="OUIA-Generated-Title-1"
+          data-ouia-component-type="PF4/Title"
+          data-ouia-safe="true"
         >
+          Merge reports
+        </h4>
+      </header>
+      <div
+        aria-live="polite"
+        class="pf-c-modal-box__body"
+        id="pf-modal-part-2"
+      >
+        <div>
           <div
             class="merge-reports-body"
           >
@@ -164,24 +160,32 @@ exports[`MergeReportsDialog Component should render a non-connected component, f
             </span>
           </div>
         </div>
-        <div
-          class="modal-footer"
-        >
-          <button
-            class="btn-cancel btn btn-default"
-            type="button"
-          >
-            Cancel
-          </button>
-          <button
-            class="btn btn-primary"
-            disabled=""
-            type="submit"
-          >
-            Merge
-          </button>
-        </div>
       </div>
+      <footer
+        class="pf-c-modal-box__footer"
+      >
+        <button
+          aria-disabled="true"
+          class="pf-c-button pf-m-primary pf-m-disabled"
+          data-ouia-component-id="OUIA-Generated-Button-primary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          disabled=""
+          type="button"
+        >
+          t(form-dialog.label, {"context":"submit_merge-reports"})
+        </button>
+        <button
+          aria-disabled="false"
+          class="pf-c-button pf-m-secondary"
+          data-ouia-component-id="OUIA-Generated-Button-secondary-1"
+          data-ouia-component-type="PF4/Button"
+          data-ouia-safe="true"
+          type="button"
+        >
+          t(form-dialog.label, {"context":"cancel"})
+        </button>
+      </footer>
     </div>
   </div>
 </div>
diff --git a/src/components/mergeReportsDialog/mergeReportsDialog.js b/src/components/mergeReportsDialog/mergeReportsDialog.js
index 4d7a038d..4e1ad8c0 100644
--- a/src/components/mergeReportsDialog/mergeReportsDialog.js
+++ b/src/components/mergeReportsDialog/mergeReportsDialog.js
@@ -1,9 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Modal, Button, Icon, Spinner } from 'patternfly-react';
+import { Button, ButtonVariant, Title } from '@patternfly/react-core';
+import { Icon, Spinner } from 'patternfly-react';
+import { Modal } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
 import { helpers } from '../../common/helpers';
 import { apiTypes } from '../../constants/apiConstants';
+import { translate } from '../i18n/i18n';
 
 class MergeReportsDialog extends React.Component {
   onClose = () => {
@@ -97,26 +100,25 @@ class MergeReportsDialog extends React.Component {
   }
 
   renderButtons() {
+    const { t } = this.props;
     const validCount = this.getValidScans().length;
 
     if (validCount === 0) {
-      return (
-        <Button bsStyle="primary" className="btn-cancel" onClick={this.onClose}>
-          Close
+      return [
+        <Button key="close" onClick={this.onClose}>
+          {t('form-dialog.label', { context: 'close' })}
         </Button>
-      );
+      ];
     }
 
-    return (
-      <React.Fragment>
-        <Button bsStyle="default" className="btn-cancel" onClick={this.onClose}>
-          Cancel
-        </Button>
-        <Button bsStyle="primary" type="submit" disabled={validCount < 2} onClick={this.onMergeScanResults}>
-          Merge
-        </Button>
-      </React.Fragment>
-    );
+    return [
+      <Button key="merge" isDisabled={validCount < 2} onClick={this.onMergeScanResults}>
+        {t('form-dialog.label', { context: ['submit', 'merge-reports'] })}
+      </Button>,
+      <Button key="cancel" variant={ButtonVariant.secondary} onClick={this.onClose}>
+        {t('form-dialog.label', { context: 'cancel' })}
+      </Button>
+    ];
   }
 
   render() {
@@ -154,35 +156,31 @@ class MergeReportsDialog extends React.Component {
     }
 
     return (
-      <Modal show={show} onHide={this.onClose}>
-        <Modal.Header>
-          <button type="button" className="close" onClick={this.onClose} aria-hidden="true" aria-label="Close">
-            <Icon type="pf" name="close" />
-          </button>
-          <Modal.Title>Merge reports</Modal.Title>
-        </Modal.Header>
-        <Modal.Body aria-live="polite">
-          {pending && (
-            <React.Fragment>
-              <Spinner loading size="lg" className="blank-slate-pf-icon" />
-              <div className="text-center">Merging reports...</div>
-            </React.Fragment>
-          )}
-          {!pending && (
-            <div className="merge-reports-body">
-              <span className="merge-reports-icon">{icon}</span>
-              <span>
-                {heading}
-                <div>
-                  {this.renderValidScans()}
-                  {this.renderInvalidScans()}
-                  {footer}
-                </div>
-              </span>
-            </div>
-          )}
-        </Modal.Body>
-        <Modal.Footer>{this.renderButtons()}</Modal.Footer>
+      <Modal
+        isOpen={show}
+        onClose={this.onClose}
+        header={<Title headingLevel="h4">Merge reports</Title>}
+        actions={this.renderButtons()}
+      >
+        {pending && (
+          <React.Fragment>
+            <Spinner loading size="lg" className="blank-slate-pf-icon" />
+            <div className="text-center">Merging reports...</div>
+          </React.Fragment>
+        )}
+        {!pending && (
+          <div className="merge-reports-body">
+            <span className="merge-reports-icon">{icon}</span>
+            <span>
+              {heading}
+              <div>
+                {this.renderValidScans()}
+                {this.renderInvalidScans()}
+                {footer}
+              </div>
+            </span>
+          </div>
+        )}
       </Modal>
     );
   }
@@ -200,14 +198,16 @@ MergeReportsDialog.propTypes = {
       name: PropTypes.string
     })
   ),
-  show: PropTypes.bool.isRequired
+  show: PropTypes.bool.isRequired,
+  t: PropTypes.func
 };
 
 MergeReportsDialog.defaultProps = {
   getReportsDownload: helpers.noop,
   mergeReports: helpers.noop,
   pending: false,
-  scans: []
+  scans: [],
+  t: translate
 };
 
 const mapDispatchToProps = dispatch => ({
diff --git a/src/components/scans/__tests__/__snapshots__/scans.test.js.snap b/src/components/scans/__tests__/__snapshots__/scans.test.js.snap
index 2572f8a3..01f30a39 100644
--- a/src/components/scans/__tests__/__snapshots__/scans.test.js.snap
+++ b/src/components/scans/__tests__/__snapshots__/scans.test.js.snap
@@ -23,48 +23,31 @@ exports[`Scans Component should render a non-connected component pending: pendin
   className="quipucords-view-container"
 >
   <Modal
-    animation={false}
-    autoFocus={true}
+    aria-label={null}
     backdrop={false}
-    bsClass="modal"
-    bsSize="lg"
-    dialogComponentClass={[Function]}
-    enforceFocus={true}
-    keyboard={true}
-    manager={
-      ModalManager {
-        "add": [Function],
-        "containers": Array [],
-        "data": Array [],
-        "handleContainerOverflow": true,
-        "hideSiblingNodes": true,
-        "isTopModal": [Function],
-        "modals": Array [],
-        "remove": [Function],
-      }
-    }
-    onHide={[Function]}
-    renderBackdrop={[Function]}
-    restoreFocus={true}
-    show={true}
+    className={null}
+    disableFocusTrap={true}
+    footer={null}
+    header={null}
+    isOpen={true}
+    position="top"
+    positionOffset="5%"
+    showClose={false}
+    t={[Function]}
+    variant="medium"
   >
-    <ModalBody
-      bsClass="modal-body"
-      componentClass="div"
+    <Spinner
+      className="blank-slate-pf-icon"
+      inline={false}
+      inverse={false}
+      loading={true}
+      size="lg"
+    />
+    <div
+      className="text-center"
     >
-      <Spinner
-        className="blank-slate-pf-icon"
-        inline={false}
-        inverse={false}
-        loading={true}
-        size="lg"
-      />
-      <div
-        className="text-center"
-      >
-        Loading...
-      </div>
-    </ModalBody>
+      t(view.loading, {"context":"scans"})
+    </div>
   </Modal>
 </div>
 `;
diff --git a/src/components/scans/scans.js b/src/components/scans/scans.js
index b7b9007d..d75537a3 100644
--- a/src/components/scans/scans.js
+++ b/src/components/scans/scans.js
@@ -1,8 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Alert, Button, EmptyState, ListView, Modal, Spinner } from 'patternfly-react';
 import _isEqual from 'lodash/isEqual';
 import _size from 'lodash/size';
+import { Alert, Button, EmptyState, ListView, Spinner } from 'patternfly-react';
+import { Modal, ModalVariant } from '../modal/modal';
 import { connect, reduxActions, reduxSelectors, reduxTypes, store } from '../../redux';
 import helpers from '../../common/helpers';
 import ViewToolbar from '../viewToolbar/viewToolbar';
@@ -12,6 +13,7 @@ import ScanListItem from './scanListItem';
 import Tooltip from '../tooltip/tooltip';
 import { ScanFilterFields, ScanSortFields } from './scanConstants';
 import { apiTypes } from '../../constants/apiConstants';
+import { translate } from '../i18n/i18n';
 
 class Scans extends React.Component {
   componentDidMount() {
@@ -71,15 +73,13 @@ class Scans extends React.Component {
   }
 
   renderPendingMessage() {
-    const { pending } = this.props;
+    const { pending, t } = this.props;
 
     if (pending) {
       return (
-        <Modal bsSize="lg" backdrop={false} show animation={false}>
-          <Modal.Body>
-            <Spinner loading size="lg" className="blank-slate-pf-icon" />
-            <div className="text-center">Loading...</div>
-          </Modal.Body>
+        <Modal variant={ModalVariant.medium} backdrop={false} isOpen disableFocusTrap>
+          <Spinner loading size="lg" className="blank-slate-pf-icon" />
+          <div className="text-center">{t('view.loading', { context: 'scans' })}</div>
         </Modal>
       );
     }
@@ -164,6 +164,7 @@ Scans.propTypes = {
   lastRefresh: PropTypes.number,
   pending: PropTypes.bool,
   scans: PropTypes.array,
+  t: PropTypes.func,
   update: PropTypes.bool,
   viewOptions: PropTypes.object
 };
@@ -175,6 +176,7 @@ Scans.defaultProps = {
   lastRefresh: 0,
   pending: false,
   scans: [],
+  t: translate,
   update: false,
   viewOptions: {}
 };
diff --git a/src/components/sources/sources.js b/src/components/sources/sources.js
index 83190629..e4aa5d26 100644
--- a/src/components/sources/sources.js
+++ b/src/components/sources/sources.js
@@ -1,8 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Alert, Button, EmptyState, ListView, Modal, Spinner } from 'patternfly-react';
 import _isEqual from 'lodash/isEqual';
 import _size from 'lodash/size';
+import { Alert, Button, EmptyState, ListView, Spinner } from 'patternfly-react';
+import { Modal, ModalVariant } from '../modal/modal';
 import { connect, reduxActions, reduxTypes, store } from '../../redux';
 import helpers from '../../common/helpers';
 import ViewToolbar from '../viewToolbar/viewToolbar';
@@ -11,6 +12,7 @@ import SourcesEmptyState from './sourcesEmptyState';
 import SourceListItem from './sourceListItem';
 import { SourceFilterFields, SourceSortFields } from './sourceConstants';
 import { apiTypes } from '../../constants/apiConstants';
+import { translate } from '../i18n/i18n';
 
 class Sources extends React.Component {
   componentDidMount() {
@@ -77,15 +79,13 @@ class Sources extends React.Component {
   }
 
   renderPendingMessage() {
-    const { pending } = this.props;
+    const { pending, t } = this.props;
 
     if (pending) {
       return (
-        <Modal bsSize="lg" backdrop={false} show animation={false}>
-          <Modal.Body>
-            <Spinner loading size="lg" className="blank-slate-pf-icon" />
-            <div className="text-center">Loading...</div>
-          </Modal.Body>
+        <Modal variant={ModalVariant.medium} backdrop={false} isOpen disableFocusTrap>
+          <Spinner loading size="lg" className="blank-slate-pf-icon" />
+          <div className="text-center">{t('view.loading', { context: 'sources' })}</div>
         </Modal>
       );
     }
@@ -170,6 +170,7 @@ Sources.propTypes = {
   lastRefresh: PropTypes.number,
   pending: PropTypes.bool,
   sources: PropTypes.array,
+  t: PropTypes.func,
   updateSources: PropTypes.bool,
   viewOptions: PropTypes.object
 };
@@ -181,6 +182,7 @@ Sources.defaultProps = {
   lastRefresh: 0,
   pending: false,
   sources: [],
+  t: translate,
   updateSources: false,
   viewOptions: {}
 };
diff --git a/tests/__snapshots__/dist.test.js.snap b/tests/__snapshots__/dist.test.js.snap
index 247ce3e3..e2c3f1be 100644
--- a/tests/__snapshots__/dist.test.js.snap
+++ b/tests/__snapshots__/dist.test.js.snap
@@ -569,6 +569,14 @@ Array [
   "./dist/client/locales/en.json",
   "./dist/client/locales/locales.json",
   "./dist/client/manifest.json",
+  "./dist/client/static/css/10*chunk*map",
+  "./dist/client/static/css/10*chunk.css",
+  "./dist/client/static/css/11*chunk*map",
+  "./dist/client/static/css/11*chunk.css",
+  "./dist/client/static/css/12*chunk*map",
+  "./dist/client/static/css/12*chunk.css",
+  "./dist/client/static/css/13*chunk*map",
+  "./dist/client/static/css/13*chunk.css",
   "./dist/client/static/css/2*chunk*map",
   "./dist/client/static/css/2*chunk.css",
   "./dist/client/static/css/3*chunk*map",
@@ -587,6 +595,14 @@ Array [
   "./dist/client/static/css/9*chunk.css",
   "./dist/client/static/css/main*chunk*map",
   "./dist/client/static/css/main*chunk.css",
+  "./dist/client/static/js/10*chunk*map",
+  "./dist/client/static/js/10*chunk.js",
+  "./dist/client/static/js/11*chunk*map",
+  "./dist/client/static/js/11*chunk.js",
+  "./dist/client/static/js/12*chunk*map",
+  "./dist/client/static/js/12*chunk.js",
+  "./dist/client/static/js/13*chunk*map",
+  "./dist/client/static/js/13*chunk.js",
   "./dist/client/static/js/2*chunk*LICENSE.txt",
   "./dist/client/static/js/2*chunk*map",
   "./dist/client/static/js/2*chunk.js",