Merge pull request #287 from cfpb/meissadia/institution-not-found-war…

…ning

[Filing] Institution Not Found Warning

src/filing/actions/fetchInstitution.js

@@ -4,6 +4,7 @@ import receiveError from './receiveError.js'
 import hasHttpError from './hasHttpError.js'
 import { getInstitution } from '../api/api.js'
 import requestInstitution from './requestInstitution.js'
+import receiveInstitutionNotFound from './receiveInstitutionNotFound'
 import { error } from '../utils/log.js'
 
 export default function fetchInstitution(institution, filingPeriod, fetchFilings = true) {
@@ -14,9 +15,12 @@ export default function fetchInstitution(institution, filingPeriod, fetchFilings
         return hasHttpError(json).then(hasError => {
           if (hasError) {
             if(json.status === 404) {
-              const message = `${institution.lei} does not exist in ${filingPeriod.split('-')[0]}.`
-              dispatch(receiveError({ status: json.status, message, heading: 'Institution not found.' }))
-              throw new Error(message)
+              dispatch(receiveInstitutionNotFound({ lei: institution.lei }))
+              throw new Error(
+                `${institution.lei} does not exist in ${
+                  filingPeriod.split("-")[0]
+                }.`
+              )
             }
 
             dispatch(receiveError(json))

src/filing/actions/receiveInstitutionNotFound.js

@@ -0,0 +1,6 @@
+export default function receiveInstitutionNotFound({ lei }) {
+  return {
+    type: "RECEIVE_INSTITUTION_NOT_FOUND",
+    lei
+  }
+}

src/filing/constants/index.js

@@ -79,3 +79,5 @@ export const UPDATE_STATUS = 'UPDATE_STATUS'
 
 export const REQUEST_LATEST_SUBMISSION = 'REQUEST_LATEST_SUBMISSION'
 export const RECEIVE_LATEST_SUBMISSION = 'RECEIVE_LATEST_SUBMISSION'
+
+export const RECEIVE_INSTITUTION_NOT_FOUND = 'RECEIVE_INSTITUTION_NOT_FOUND'

src/filing/institutions/Institutions.css

@@ -62,3 +62,8 @@
 .floatingIcon + p.multi-message {
   margin-top: 7em;
 }
+
+.Institutions .missing-leis ul {
+  list-style-type: disc;
+  margin-left: 2rem;
+}

src/filing/institutions/MissingInstitutionsBanner.jsx

@@ -0,0 +1,59 @@
+import React from "react"
+import Alert from "../../common/Alert.jsx"
+
+export const MissingInstitutionsBanner = ({ leis = [] }) => {
+  const hasMissingLeis = leis.length > 0
+  const bannerType = hasMissingLeis ? "warning" : "info"
+
+  return (
+    <Alert
+      heading="Missing an institution?"
+      type={bannerType}
+      headingType="small"
+    >
+      <div>
+        <MissingLeiList leis={leis} />
+        <p>
+          If any {hasMissingLeis ? "other" : ""} institutions are missing,
+          please access{" "}
+          <a href="https://hmdahelp.consumerfinance.gov/accounthelp/">
+            this form
+          </a>{" "}
+          and enter the necessary information, including your institution's LEI,
+          which is required in order to access the HMDA Platform. We will apply
+          the update to your account. Please check back one day after submitting
+          your information.
+        </p>
+      </div>
+    </Alert>
+  )
+}
+
+export const MissingLeiList = ({ leis = [] }) => {
+  if(leis.length < 1) return null
+
+  return (
+    <div className="missing-leis">
+      <p>
+        The following institutions are associated with your profile, but not for
+        the currently selected year:
+      </p>
+      <ul>
+        {leis.map((lei, key) => (
+          <li key={key}>{lei}</li>
+        ))}
+      </ul>
+      <p>
+        To associate one or more of these institutions, please contact{" "}
+        <a
+          target="_blank"
+          rel="noopener noreferrer"
+          href="mailto:[email protected]"
+        >
+          HMDA Help
+        </a>
+        .
+      </p>
+    </div>
+  )
+}

src/filing/institutions/index.jsx

@@ -7,6 +7,7 @@ import InstitutionsHeader from './Header.jsx'
 import sortInstitutions from '../utils/sortInstitutions.js'
 import YearSelector from '../../common/YearSelector.jsx'
 import Alert from '../../common/Alert.jsx'
+import { MissingInstitutionsBanner } from './MissingInstitutionsBanner'
 
 import './Institutions.css'
 
@@ -64,6 +65,8 @@ const _whatToRender = ({ filings, institutions, submission, latestSubmissions })
     const institutionFilings = filings[institution.lei]
     const institutionSubmission = latestSubmissions[institution.lei]
 
+    if (institution.notFound) return null
+
     if (
       !institutionFilings || !institutionFilings.fetched ||
       !institutionSubmission || institutionSubmission.isFetching
@@ -89,6 +92,14 @@ const _whatToRender = ({ filings, institutions, submission, latestSubmissions })
 export default class Institutions extends Component {
   render() {
     const { error, filingPeriod, filingYears, location } = this.props
+    const institutions = this.props.institutions.institutions
+    let unregisteredInstitutions = []
+    let leis = []
+
+    if (this.props.institutions.fetched) {
+      leis = Object.keys(institutions)
+      unregisteredInstitutions = leis.filter(i => institutions[i].notFound)
+    }
 
     return (
       <main id="main-content" className="Institutions full-width">
@@ -102,28 +113,10 @@ export default class Institutions extends Component {
 
           {_whatToRender(this.props)}
 
-          {this.props.institutions.fetched &&
-          Object.keys(this.props.institutions.institutions).length !== 0 ? (
-            <Alert
-              heading="Missing an institution?"
-              type="info"
-              headingType="small"
-            >
-              <p className="text-small">
-                In order to access the HMDA Platform, each of your institutions
-                must have a Legal Entity Identifier (LEI). In order to provide
-                your institution&#39;s LEI, please access{' '}
-                <a href="https://hmdahelp.consumerfinance.gov/accounthelp/">
-                  this form
-                </a>{' '}
-                and enter the necessary information, including your HMDA
-                Platform account email address in the &#34;Additional
-                comments&#34; text box. We will apply the update to your
-                account, please check back 2 business days after submitting your
-                information.
-              </p>
-            </Alert>
-          ) : null}
+          {this.props.institutions.fetched && leis.length !== 0 
+            ? ( <MissingInstitutionsBanner leis={unregisteredInstitutions} /> ) 
+            : null
+          }
         </div>
       </main>
     )

src/filing/reducers/institutions.js

@@ -3,7 +3,8 @@ import {
   RECEIVE_INSTITUTIONS,
   REQUEST_INSTITUTION,
   RECEIVE_INSTITUTION,
-  UPDATE_FILING_PERIOD
+  UPDATE_FILING_PERIOD,
+  RECEIVE_INSTITUTION_NOT_FOUND
 } from '../constants'
 
 const defaultInstitutions = {
@@ -53,6 +54,18 @@ export default (state = defaultInstitutions, action) => {
         isFetching: false,
         fetched: true
       }
+    case RECEIVE_INSTITUTION_NOT_FOUND:
+      return {
+        ...state,
+        institutions: {
+          ...state.institutions,
+          [action.lei]: {
+            isFetching: false,
+            notFound: true,
+            lei: action.lei
+          }
+        }
+      }
     case UPDATE_FILING_PERIOD:
       return defaultInstitutions
     default: