From 73f8fa1bead5f4d1d11a72d04e50ce6cc0175075 Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 10:03:07 -0600
Subject: [PATCH 1/6] placeholder

---
 .../components/document-capture.jsx           | 13 ++++----
 .../components/documents-step.jsx             | 30 ++++++++++++++++++-
 .../idv/shared/_document_capture.html.erb     | 17 +++++++++++
 .../components/document-capture-spec.jsx      |  4 +--
 4 files changed, 53 insertions(+), 11 deletions(-)

diff --git a/app/javascript/packages/document-capture/components/document-capture.jsx b/app/javascript/packages/document-capture/components/document-capture.jsx
index 7a20bf0c916..fd0c0166903 100644
--- a/app/javascript/packages/document-capture/components/document-capture.jsx
+++ b/app/javascript/packages/document-capture/components/document-capture.jsx
@@ -5,8 +5,6 @@ import { UploadFormEntriesError } from '../services/upload';
 import DocumentsStep, { documentsStepValidator } from './documents-step';
 import SelfieStep, { selfieStepValidator } from './selfie-step';
 import ReviewIssuesStep from './review-issues-step';
-import MobileIntroStep from './mobile-intro-step';
-import DeviceContext from '../context/device';
 import ServiceProviderContext from '../context/service-provider';
 import Submission from './submission';
 import SubmissionStatus from './submission-status';
@@ -54,7 +52,6 @@ function DocumentCapture({ isAsyncForm = false, onStepChange }) {
   const [formValues, setFormValues] = useState(/** @type {Record<string,any>?} */ (null));
   const [submissionError, setSubmissionError] = useState(/** @type {Error=} */ (undefined));
   const { t } = useI18n();
-  const { isMobile } = useContext(DeviceContext);
   const serviceProvider = useContext(ServiceProviderContext);
 
   /**
@@ -91,11 +88,11 @@ function DocumentCapture({ isAsyncForm = false, onStepChange }) {
         },
       ]
     : /** @type {FormStep[]} */ ([
-        isMobile && {
-          name: 'intro',
-          title: t('doc_auth.headings.document_capture'),
-          form: MobileIntroStep,
-        },
+        // isMobile && {
+        //   name: 'intro',
+        //   title: t('doc_auth.headings.document_capture'),
+        //   form: MobileIntroStep,
+        // },
         {
           name: 'documents',
           title: t('doc_auth.headings.document_capture'),
diff --git a/app/javascript/packages/document-capture/components/documents-step.jsx b/app/javascript/packages/document-capture/components/documents-step.jsx
index 14c73d7b8ac..b322d8554bb 100644
--- a/app/javascript/packages/document-capture/components/documents-step.jsx
+++ b/app/javascript/packages/document-capture/components/documents-step.jsx
@@ -3,6 +3,7 @@ import AcuantCapture from './acuant-capture';
 import FormErrorMessage from './form-error-message';
 import useI18n from '../hooks/use-i18n';
 import DeviceContext from '../context/device';
+import ServiceProviderContext from '../context/service-provider';
 import withBackgroundEncryptedUpload from '../higher-order/with-background-encrypted-upload';
 
 /**
@@ -35,11 +36,38 @@ function DocumentsStep({
   errors = [],
   registerField = () => undefined,
 }) {
-  const { t } = useI18n();
+  const { t, formatHTML } = useI18n();
   const { isMobile } = useContext(DeviceContext);
+  const serviceProvider = useContext(ServiceProviderContext);
 
   return (
     <>
+      {isMobile && (
+        <>
+          <p>{t('doc_auth.info.document_capture_intro_acknowledgment')}</p>
+          <p>
+            {formatHTML(t('doc_auth.info.id_worn_html'), {
+              strong: 'strong',
+            })}
+          </p>
+        </>
+      )}
+      {serviceProvider.name && isMobile && (
+        <p>
+          {formatHTML(
+            t('doc_auth.info.no_other_id_help_bold_html', { sp_name: serviceProvider.name }),
+            {
+              strong: 'strong',
+              a: ({ children }) =>
+                serviceProvider.failureToProofURL ? (
+                  <a href={serviceProvider.failureToProofURL}>{children}</a>
+                ) : (
+                  <>{children}</>
+                ),
+            },
+          )}
+        </p>
+      )}
       <p className="margin-bottom-0">{t('doc_auth.tips.document_capture_header_text')}</p>
       <ul>
         <li>{t('doc_auth.tips.document_capture_id_text1')}</li>
diff --git a/app/views/idv/shared/_document_capture.html.erb b/app/views/idv/shared/_document_capture.html.erb
index 4627b3207a0..95ad3f11be3 100644
--- a/app/views/idv/shared/_document_capture.html.erb
+++ b/app/views/idv/shared/_document_capture.html.erb
@@ -51,7 +51,24 @@
   ) do |f| %>
     <%# ---- Front Image ----- %>
 
+    <p><%= t('doc_auth.info.document_capture_intro_acknowledgment') %></p>
+
+    <p>
+      <%= t('doc_auth.info.id_worn_html') %>
+    </p>
+
+    <% if sp_name %>
+      <p>
+        <%= t(
+                'doc_auth.info.no_other_id_help_bold_html',
+                failure_to_proof_url: decorated_session.failure_to_proof_url,
+                sp_name: sp_name,
+            ) %>
+      </p>
+    <% end %>
+
     <p class="mt2 mb0"><%= t('doc_auth.tips.document_capture_header_text') %></p>
+
     <ul>
       <li><%= t('doc_auth.tips.document_capture_id_text1') %></li>
       <li><%= t('doc_auth.tips.document_capture_id_text2') %></li>
diff --git a/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx b/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
index 108f7af576e..96d8e874995 100644
--- a/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
+++ b/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
@@ -57,14 +57,14 @@ describe('document-capture/components/document-capture', () => {
   });
 
   context('mobile', () => {
-    it('starts with introductory step', () => {
+    it('starts with documents step', () => {
       const { getByText } = render(
         <DeviceContext.Provider value={{ isMobile: true }}>
           <DocumentCapture />
         </DeviceContext.Provider>,
       );
 
-      expect(getByText('doc_auth.info.document_capture_intro_acknowledgment')).to.be.ok();
+      expect(getByText('doc_auth.tips.document_capture_header_text')).to.be.ok();
     });
 
     it('does not show document step footer', () => {

From 4bfbaf63beae5b0d227aaab4c867aba060f1d26c Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 11:03:22 -0600
Subject: [PATCH 2/6] remove mobile intro step

---
 .../components/mobile-intro-step.jsx          | 45 -------------
 .../components/mobile-intro-step-spec.jsx     | 66 -------------------
 2 files changed, 111 deletions(-)
 delete mode 100644 app/javascript/packages/document-capture/components/mobile-intro-step.jsx
 delete mode 100644 spec/javascripts/packages/document-capture/components/mobile-intro-step-spec.jsx

diff --git a/app/javascript/packages/document-capture/components/mobile-intro-step.jsx b/app/javascript/packages/document-capture/components/mobile-intro-step.jsx
deleted file mode 100644
index ba89952f9cf..00000000000
--- a/app/javascript/packages/document-capture/components/mobile-intro-step.jsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { useContext } from 'react';
-import ServiceProviderContext from '../context/service-provider';
-import useI18n from '../hooks/use-i18n';
-
-function MobileIntroStep() {
-  const { t, formatHTML } = useI18n();
-  const serviceProvider = useContext(ServiceProviderContext);
-
-  return (
-    <>
-      <p>{t('doc_auth.info.document_capture_intro_acknowledgment')}</p>
-      <p>
-        {formatHTML(t('doc_auth.info.id_worn_html'), {
-          strong: 'strong',
-        })}
-      </p>
-      {serviceProvider.name && (
-        <p>
-          {formatHTML(
-            t('doc_auth.info.no_other_id_help_bold_html', { sp_name: serviceProvider.name }),
-            {
-              strong: 'strong',
-              a: ({ children }) =>
-                serviceProvider.failureToProofURL ? (
-                  <a href={serviceProvider.failureToProofURL}>{children}</a>
-                ) : (
-                  <>{children}</>
-                ),
-            },
-          )}
-        </p>
-      )}
-      <p className="margin-top-4 margin-bottom-0">
-        {t('doc_auth.tips.document_capture_header_text')}
-      </p>
-      <ul>
-        <li>{t('doc_auth.tips.document_capture_id_text1')}</li>
-        <li>{t('doc_auth.tips.document_capture_id_text2')}</li>
-        <li>{t('doc_auth.tips.document_capture_id_text3')}</li>
-      </ul>
-    </>
-  );
-}
-
-export default MobileIntroStep;
diff --git a/spec/javascripts/packages/document-capture/components/mobile-intro-step-spec.jsx b/spec/javascripts/packages/document-capture/components/mobile-intro-step-spec.jsx
deleted file mode 100644
index b7d793559a1..00000000000
--- a/spec/javascripts/packages/document-capture/components/mobile-intro-step-spec.jsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import { I18nContext, ServiceProviderContext } from '@18f/identity-document-capture';
-import MobileIntroStep from '@18f/identity-document-capture/components/mobile-intro-step';
-import { render } from '../../../support/document-capture';
-
-describe('document-capture/components/mobile-intro-step', () => {
-  context('service provider context', () => {
-    it('renders with name and help link', () => {
-      const { getByText } = render(
-        <I18nContext.Provider
-          value={{
-            'doc_auth.info.no_other_id_help_bold_html':
-              '<strong>If you do not have another state-issued ID</strong>, ' +
-              '<a href=%{failure_to_proof_url}>get help at %{sp_name}.</a>',
-          }}
-        >
-          <ServiceProviderContext.Provider
-            value={{
-              name: 'Example App',
-              failureToProofURL: 'https://example.com',
-            }}
-          >
-            <MobileIntroStep />
-          </ServiceProviderContext.Provider>
-        </I18nContext.Provider>,
-      );
-
-      const help = getByText(
-        (_content, element) =>
-          element.innerHTML ===
-          '<strong>If you do not have another state-issued ID</strong>, ' +
-            '<a href="https://example.com">get help at Example App.</a>',
-      );
-
-      expect(help).to.be.ok();
-    });
-
-    it('renders with name', () => {
-      const { getByText } = render(
-        <I18nContext.Provider
-          value={{
-            'doc_auth.info.no_other_id_help_bold_html':
-              '<strong>If you do not have another state-issued ID</strong>, ' +
-              '<a href=%{failure_to_proof_url}>get help at %{sp_name}.</a>',
-          }}
-        >
-          <ServiceProviderContext.Provider
-            value={{
-              name: 'Example App',
-              failureToProofURL: null,
-            }}
-          >
-            <MobileIntroStep />
-          </ServiceProviderContext.Provider>
-        </I18nContext.Provider>,
-      );
-
-      const help = getByText(
-        (_content, element) =>
-          element.innerHTML ===
-          '<strong>If you do not have another state-issued ID</strong>, get help at Example App.',
-      );
-
-      expect(help).to.be.ok();
-    });
-  });
-});

From 8f04cbaf58a2f50c5411c91257622811d89a2bbc Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 13:09:56 -0600
Subject: [PATCH 3/6] Update
 app/javascript/packages/document-capture/components/document-capture.jsx

Co-authored-by: Andrew Duthie <andrew.duthie@gsa.gov>
---
 .../document-capture/components/document-capture.jsx         | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/app/javascript/packages/document-capture/components/document-capture.jsx b/app/javascript/packages/document-capture/components/document-capture.jsx
index fd0c0166903..9fbf4e0ef09 100644
--- a/app/javascript/packages/document-capture/components/document-capture.jsx
+++ b/app/javascript/packages/document-capture/components/document-capture.jsx
@@ -88,11 +88,6 @@ function DocumentCapture({ isAsyncForm = false, onStepChange }) {
         },
       ]
     : /** @type {FormStep[]} */ ([
-        // isMobile && {
-        //   name: 'intro',
-        //   title: t('doc_auth.headings.document_capture'),
-        //   form: MobileIntroStep,
-        // },
         {
           name: 'documents',
           title: t('doc_auth.headings.document_capture'),

From 9f3f0757018bde307eeeb7b7e29fca7828f369aa Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 13:20:35 -0600
Subject: [PATCH 4/6] update comment and remove unnecessary text

---
 .../components/desktop-document-disclosure.jsx         |  2 +-
 .../components/document-capture-spec.jsx               | 10 ----------
 2 files changed, 1 insertion(+), 11 deletions(-)

diff --git a/app/javascript/packages/document-capture/components/desktop-document-disclosure.jsx b/app/javascript/packages/document-capture/components/desktop-document-disclosure.jsx
index d03c40b3a2e..b902cca10b7 100644
--- a/app/javascript/packages/document-capture/components/desktop-document-disclosure.jsx
+++ b/app/javascript/packages/document-capture/components/desktop-document-disclosure.jsx
@@ -4,7 +4,7 @@ import useI18n from '../hooks/use-i18n';
 
 /**
  * Renders a document usage disclosure for desktop devices only. On mobile devices, an equivalent
- * message is displayed on the introductory step.
+ * message in the introduction.
  *
  * @type {import('react').FC}
  */
diff --git a/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx b/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
index 96d8e874995..f5892fcc5eb 100644
--- a/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
+++ b/spec/javascripts/packages/document-capture/components/document-capture-spec.jsx
@@ -57,16 +57,6 @@ describe('document-capture/components/document-capture', () => {
   });
 
   context('mobile', () => {
-    it('starts with documents step', () => {
-      const { getByText } = render(
-        <DeviceContext.Provider value={{ isMobile: true }}>
-          <DocumentCapture />
-        </DeviceContext.Provider>,
-      );
-
-      expect(getByText('doc_auth.tips.document_capture_header_text')).to.be.ok();
-    });
-
     it('does not show document step footer', () => {
       const { getByText } = render(
         <DeviceContext.Provider value={{ isMobile: true }}>

From 30642548f80cb76aa097f26172a2e18849daba73 Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 14:14:37 -0600
Subject: [PATCH 5/6] remove new line

---
 .../packages/document-capture/components/document-capture.jsx    | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/javascript/packages/document-capture/components/document-capture.jsx b/app/javascript/packages/document-capture/components/document-capture.jsx
index eab31d8a4f8..ad8786307d5 100644
--- a/app/javascript/packages/document-capture/components/document-capture.jsx
+++ b/app/javascript/packages/document-capture/components/document-capture.jsx
@@ -49,7 +49,6 @@ export const except = (object, ...keys) =>
  * @param {DocumentCaptureProps} props
  */
 function DocumentCapture({ isAsyncForm = false, onStepChange }) {
-  
   const [formValues, setFormValues] = useState(/** @type {Record<string,any>?} */ (null));
   const [submissionError, setSubmissionError] = useState(/** @type {Error=} */ (undefined));
   const { t } = useI18n();

From 3faa49279703cd7a45bf58147db2afd17bd58991 Mon Sep 17 00:00:00 2001
From: Mitchell Henke <mitchell.henke@gsa.gov>
Date: Thu, 28 Jan 2021 14:17:36 -0600
Subject: [PATCH 6/6] fix merge

---
 .../packages/document-capture/components/document-capture.jsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/packages/document-capture/components/document-capture.jsx b/app/javascript/packages/document-capture/components/document-capture.jsx
index ad8786307d5..21216cc2663 100644
--- a/app/javascript/packages/document-capture/components/document-capture.jsx
+++ b/app/javascript/packages/document-capture/components/document-capture.jsx
@@ -4,7 +4,7 @@ import FormSteps from './form-steps';
 import { UploadFormEntriesError } from '../services/upload';
 import DocumentsStep, { documentsStepValidator } from './documents-step';
 import SelfieStep, { selfieStepValidator } from './selfie-step';
-import ReviewIssuesStep from './review-issues-step';
+import ReviewIssuesStep, { reviewIssuesStepValidator } from './review-issues-step';
 import ServiceProviderContext from '../context/service-provider';
 import Submission from './submission';
 import SubmissionStatus from './submission-status';