9600 Petitioner: Add Consolidated Card to Case Information Screen

shared/src/authorization/authorizationClientService.js

@@ -63,6 +63,7 @@ const ROLE_PERMISSIONS = {
   UPDATE_CASE_CONTEXT: 'UPDATE_CASE_CONTEXT',
   UPDATE_CONTACT_INFO: 'UPDATE_CONTACT_INFO',
   UPLOAD_DOCUMENT: 'UPLOAD_DOCUMENT',
+  VIEW_CONSOLIDATED_CASES_CARD: 'VIEW_CONSOLIDATED_CASES_CARD',
   VIEW_DOCUMENTS: 'VIEW_DOCUMENTS',
   VIEW_MESSAGES: 'VIEW_MESSAGES',
   VIEW_PRACTITIONER_CASE_LIST: 'VIEW_PRACTITIONER_CASE_LIST',
@@ -190,6 +191,7 @@ const AUTHORIZATION_MAP = {
     ROLE_PERMISSIONS.GET_USER_PENDING_EMAIL_STATUS,
     ROLE_PERMISSIONS.UPDATE_CONTACT_INFO,
     ROLE_PERMISSIONS.UPLOAD_DOCUMENT,
+    ROLE_PERMISSIONS.VIEW_CONSOLIDATED_CASES_CARD,
     ROLE_PERMISSIONS.VIEW_DOCUMENTS,
   ],
   irsSuperuser: [
@@ -217,6 +219,7 @@ const AUTHORIZATION_MAP = {
     ROLE_PERMISSIONS.UPDATE_CONTACT_INFO,
     ROLE_PERMISSIONS.UPLOAD_DOCUMENT,
     ROLE_PERMISSIONS.VIEW_DOCUMENTS,
+    ROLE_PERMISSIONS.VIEW_CONSOLIDATED_CASES_CARD,
   ],
   petitionsclerk: petitionsClerkPermissions,
   privatePractitioner: [
@@ -230,6 +233,7 @@ const AUTHORIZATION_MAP = {
     ROLE_PERMISSIONS.PETITION,
     ROLE_PERMISSIONS.UPDATE_CONTACT_INFO,
     ROLE_PERMISSIONS.UPLOAD_DOCUMENT,
+    ROLE_PERMISSIONS.VIEW_CONSOLIDATED_CASES_CARD,
     ROLE_PERMISSIONS.VIEW_DOCUMENTS,
   ],
   reportersOffice: allInternalUserPermissions,

web-api/storage/fixtures/seed/efcms-local.json

@@ -71,7 +71,7 @@
         "entityName": "Petitioner",
         "name": "Astra Santiago",
         "state": "NY",
-        "email": "petitioner@example.com"
+        "email": "petitioner2@example.com"
       }
     ],
     "initialDocketNumberSuffix": "L",

web-client/src/presenter/computeds/caseDetailHelper.js

@@ -1,3 +1,4 @@
+/* eslint-disable complexity */
 import { isEmpty } from 'lodash';
 import { state } from 'cerebral';
 
@@ -67,8 +68,15 @@ export const caseDetailHelper = (get, applicationContext) => {
     user.role === USER_ROLES.irsPractitioner ||
     user.role === USER_ROLES.privatePractitioner;
 
+  const isPetitioner = user.role === USER_ROLES.petitioner;
+
   const showSealedCaseView =
-    isPractitioner && !!caseDetail.isSealed && !userAssociatedWithCase;
+    (isPractitioner || isPetitioner) &&
+    !!caseDetail.isSealed &&
+    !userAssociatedWithCase;
+
+  const showConsolidatedCasesCard =
+    permissions.VIEW_CONSOLIDATED_CASES_CARD && !!caseDetail.leadDocketNumber;
 
   return {
     caseDeadlines,
@@ -83,6 +91,7 @@ export const caseDetailHelper = (get, applicationContext) => {
     showCaseDeadlinesInternal,
     showCaseDeadlinesInternalEmpty,
     showCaseInformationExternal: isExternalUser,
+    showConsolidatedCasesCard,
     showDocketRecordInProgressState: !isExternalUser,
     showEditCaseDetailsButton: permissions.EDIT_CASE_DETAILS,
     showFileDocumentButton,

web-client/src/presenter/computeds/caseDetailHelper.showConsolidatedCasesCard.test.js

@@ -0,0 +1,106 @@
+import {
+  adcUser,
+  irsPractitionerUser,
+  petitionerUser,
+  privatePractitionerUser,
+} from '../../../../shared/src/test/mockUsers';
+import { applicationContextForClient as applicationContext } from '../../../../shared/src/business/test/createTestApplicationContext';
+import { caseDetailHelper as caseDetailHelperComputed } from './caseDetailHelper';
+import { getUserPermissions } from '../../../../shared/src/authorization/getUserPermissions';
+import { runCompute } from 'cerebral/test';
+import { withAppContextDecorator } from '../../withAppContext';
+
+const caseDetailHelper = withAppContextDecorator(caseDetailHelperComputed, {
+  ...applicationContext,
+  getCurrentUser: () => {
+    return globalUser;
+  },
+});
+
+let globalUser;
+
+const getBaseState = user => {
+  globalUser = user;
+  return {
+    permissions: getUserPermissions(user),
+  };
+};
+
+describe('showConsolidatedCasesCard', () => {
+  it('should be true when the user is a petitioner and the case is in a consolidated group', () => {
+    const user = petitionerUser;
+
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(user),
+        caseDetail: {
+          docketEntries: [],
+          leadDocketNumber: '101-22F',
+        },
+      },
+    });
+    expect(result.showConsolidatedCasesCard).toEqual(true);
+  });
+
+  it('should be true when the user is a private practitioner and the case is in a consolidated group', () => {
+    const user = privatePractitionerUser;
+
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(user),
+        caseDetail: {
+          docketEntries: [],
+          leadDocketNumber: '101-22F',
+        },
+      },
+    });
+    expect(result.showConsolidatedCasesCard).toEqual(true);
+  });
+
+  it('should be true when the user is an IRS practitioner and the case is in a consolidated group', () => {
+    const user = irsPractitionerUser;
+
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(user),
+        caseDetail: {
+          docketEntries: [],
+          leadDocketNumber: '101-22F',
+        },
+      },
+    });
+    expect(result.showConsolidatedCasesCard).toEqual(true);
+  });
+
+  it('should be false when the user is a non practitioner/petitioner user and the case is in a consolidated group', () => {
+    const user = adcUser;
+
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(user),
+        caseDetail: {
+          docketEntries: [],
+          leadDocketNumber: '101-22F',
+        },
+      },
+    });
+
+    expect(result.showConsolidatedCasesCard).toEqual(false);
+  });
+
+  it('should be false when the case is not in a consolidated group and the user has VIEW_CONSOLIDATED_CASES_CARD permission', () => {
+    const user = petitionerUser;
+
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(user),
+        caseDetail: {
+          docketEntries: [],
+          leadDocketNumber: undefined,
+        },
+      },
+    });
+
+    expect(result.showConsolidatedCasesCard).toEqual(false);
+  });
+});

web-client/src/presenter/computeds/caseDetailHelper.showSealedCaseView.test.js

@@ -1,13 +1,11 @@
 import { applicationContextForClient as applicationContext } from '../../../../shared/src/business/test/createTestApplicationContext';
 import { caseDetailHelper as caseDetailHelperComputed } from './caseDetailHelper';
+import { getUserPermissions } from '../../../../shared/src/authorization/getUserPermissions';
 import {
-  docketClerkUser,
   irsPractitionerUser,
   petitionerUser,
-  petitionsClerkUser,
   privatePractitionerUser,
 } from '../../../../shared/src/test/mockUsers';
-import { getUserPermissions } from '../../../../shared/src/authorization/getUserPermissions';
 import { runCompute } from 'cerebral/test';
 import { withAppContextDecorator } from '../../withAppContext';
 
@@ -62,29 +60,59 @@ describe('showSealedCaseView', () => {
     expect(result.showSealedCaseView).toEqual(false);
   });
 
-  const nonPractitionerUsers = [
-    docketClerkUser,
-    petitionerUser,
-    petitionsClerkUser,
-  ];
+  it('should be true for a unassociated private practitioner user with a sealed case', () => {
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(privatePractitionerUser),
+        caseDetail: {
+          docketEntries: [],
+          isSealed: true,
+          privatePractitioners: [],
+        },
+        screenMetadata: {
+          isAssociated: false,
+        },
+      },
+    });
+
+    expect(result.showSealedCaseView).toEqual(true);
+  });
 
-  nonPractitionerUsers.forEach(user => {
-    it(`should be false for a non practitioner ${user} user`, () => {
-      const result = runCompute(caseDetailHelper, {
-        state: {
-          ...getBaseState(user),
-          caseDetail: {
-            docketEntries: [],
-            isSealed: true,
-            privatePractitioners: [],
-          },
-          screenMetadata: {
-            isAssociated: false,
-          },
+  it('should be true for a unassociated IRS practitioner user with a sealed case', () => {
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(irsPractitionerUser),
+        caseDetail: {
+          docketEntries: [],
+          isSealed: true,
+          privatePractitioners: [],
+        },
+        screenMetadata: {
+          isAssociated: false,
         },
-      });
+      },
+    });
+
+    expect(result.showSealedCaseView).toEqual(true);
+  });
 
-      expect(result.showSealedCaseView).toEqual(false);
+  it('should be true for an unassociated petitioner associated with a different case in the consolidated group', () => {
+    const result = runCompute(caseDetailHelper, {
+      state: {
+        ...getBaseState(petitionerUser),
+        caseDetail: {
+          docketEntries: [],
+          docketNumber: '198-23',
+          isSealed: true,
+          leadDocketNumber: '199-23',
+          privatePractitioners: [],
+        },
+        screenMetadata: {
+          isAssociated: false,
+        },
+      },
     });
+
+    expect(result.showSealedCaseView).toEqual(true);
   });
 });

web-client/src/styles/custom.scss

@@ -2023,3 +2023,7 @@ button.change-scanner-button {
 .width-180 {
   width: 180px;
 }
+
+.align-items-baseline {
+  align-items: baseline;
+}

web-client/src/views/CaseDetail/CaseInformation/ConsolidatedCases.jsx

@@ -1,4 +1,5 @@
 import { CaseLink } from '../../../ustc-ui/CaseLink/CaseLink';
+import { Mobile, NonMobile } from '../../../ustc-ui/Responsive/Responsive';
 import { connect } from '@cerebral/react';
 import { props } from 'cerebral';
 import React from 'react';
@@ -12,16 +13,28 @@ export const ConsolidatedCases = connect(
     return (
       <>
         {!caseDetailHelper.hasConsolidatedCases && <p>Not consolidated</p>}
-        <div className="grid-container padding-left-0">
+        <div className="grid-container padding-left-0 margin-bottom-2">
           {caseDetail.consolidatedCases.map(consolidatedCase => (
             <div
-              className="grid-row margin-top-3"
+              className="grid-row margin-top-3 align-items-baseline"
               key={consolidatedCase.docketNumber}
             >
-              <div className="grid-col-2">
-                <CaseLink formattedCase={consolidatedCase} />
-              </div>
-              <div className="grid-col-10">{consolidatedCase.caseTitle}</div>
+              <NonMobile>
+                <div className="tablet:grid-col-3 desktop:grid-col-2">
+                  <CaseLink formattedCase={consolidatedCase} />
+                </div>
+                <div className="tablet:grid-col-9 desktop:grid-col-10">
+                  {consolidatedCase.caseTitle}
+                </div>
+              </NonMobile>
+              <Mobile>
+                <div className="grid-col-4">
+                  <CaseLink formattedCase={consolidatedCase} />
+                </div>
+                <div className="grid-col-8 margin-left-neg-2">
+                  {consolidatedCase.caseTitle}
+                </div>
+              </Mobile>
             </div>
           ))}
         </div>

web-client/src/views/CaseDetail/CaseInformationExternal.jsx

@@ -1,4 +1,5 @@
 import { Button } from '../../ustc-ui/Button/Button';
+import { ConsolidatedCases } from './CaseInformation/ConsolidatedCases';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { If } from '../../ustc-ui/If/If';
 import { Mobile, NonMobile } from '../../ustc-ui/Responsive/Responsive';
@@ -124,6 +125,21 @@ export const CaseInformationExternal = connect(
                 </div>
               </div>
             </div>
+            <div className="grid-row grid-gap margin-top-4">
+              <div className="tablet:grid-col-6">
+                {caseDetailHelper.showConsolidatedCasesCard && (
+                  <div className="card height-full">
+                    <div className="content-wrapper">
+                      <h3 className="underlined">Consolidated Cases</h3>
+                      <ConsolidatedCases
+                        caseDetail={formattedCaseDetail}
+                        caseDetailHelper={caseDetailHelper}
+                      />
+                    </div>
+                  </div>
+                )}
+              </div>
+            </div>
           </div>
         </NonMobile>
         <Mobile>
@@ -160,6 +176,17 @@ export const CaseInformationExternal = connect(
                 <TrialInformation caseDetail={formattedCaseDetail} />
               </div>
             </div>
+            {caseDetailHelper.showConsolidatedCasesCard && (
+              <div className="margin-top-2">
+                <div className="case-info-card">
+                  <h3>Consolidated Cases</h3>
+                  <ConsolidatedCases
+                    caseDetail={formattedCaseDetail}
+                    caseDetailHelper={caseDetailHelper}
+                  />
+                </div>
+              </div>
+            )}
           </div>
         </Mobile>
       </div>