10074 bug: Auto Scroll Issues on Petitions Clerk Create Case Form (and more)

cypress/local-only/tests/integration/myAccount/respondent-modifies-contact-info.cy.ts

@@ -7,7 +7,7 @@ import { respondentModifiesContactInfo } from '../../../../helpers/myAccount/res
 const BAR_NUMBER = 'WN7777';
 const USER = 'irspractitioner2';
 
-describe('a repondent modifies their address', () => {
+describe('a respondent modifies their address', () => {
   it('should generate a notice of change address for all cases associated with the respondent', function () {
     loginAsPetitioner();
     petitionerCreatesElectronicCase().then(docketNumber => {

shared/src/business/entities/cases/Case.ts

@@ -534,7 +534,7 @@ export class Case extends JoiValidationEntity {
     mailingDate: JoiValidationConstants.STRING.max(25)
       .when('isPaper', {
         is: true,
-        otherwise: joi.allow(null).optional(),
+        otherwise: joi.optional().allow(null),
         then: joi.required(),
       })
       .description('Date that petition was mailed to the court.')
@@ -617,7 +617,7 @@ export class Case extends JoiValidationEntity {
       'petitionPaymentStatus',
       {
         is: PAYMENT_STATUS.WAIVED,
-        otherwise: joi.allow(null).optional(),
+        otherwise: joi.optional().allow(null),
         then: JoiValidationConstants.ISO_DATE.max('now').required(),
       },
     )

web-client/integration-tests/docketClerkOpinionAdvancedSearch.test.ts

@@ -78,7 +78,8 @@ describe('Docket clerk opinion advanced search', () => {
 
     expect(cerebralTest.getState('alertError')).toEqual({
       messages: ['Start date cannot be in the future. Enter valid start date.'],
-      title: 'Please correct the following errors:',
+      scrollToErrorNotification: true,
+      title: 'Please correct the following errors on the page:',
     });
 
     await cerebralTest.runSequence('advancedSearchTabChangeSequence');

web-client/integration-tests/docketClerkOrderAdvancedSearch.test.ts

@@ -147,6 +147,7 @@ describe('Docket clerk advanced order search', () => {
     cerebralTest.setState('advancedSearchForm', {
       orderSearch: {
         dateRange: DATE_RANGE_SEARCH_OPTIONS.CUSTOM_DATES,
+        scrollToErrorNotification: true,
         startDate: '01/01/3001',
       },
     });
@@ -155,7 +156,8 @@ describe('Docket clerk advanced order search', () => {
 
     expect(cerebralTest.getState('alertError')).toEqual({
       messages: ['Start date cannot be in the future. Enter valid start date.'],
-      title: 'Please correct the following errors:',
+      scrollToErrorNotification: true,
+      title: 'Please correct the following errors on the page:',
     });
 
     await cerebralTest.runSequence('advancedSearchTabChangeSequence');

web-client/integration-tests/journey/petitionsClerkUpdatesCaseDetail.ts

@@ -143,6 +143,7 @@ export const petitionsClerkUpdatesCaseDetail = cerebralTest => {
     });
     expect(cerebralTest.getState('alertError')).toEqual({
       messages: ['Select a case type', 'Select a case procedure'],
+      scrollToErrorNotification: true,
       title: 'Please correct the following errors on the page:',
     });
 

web-client/src/presenter/actions/setScrollToErrorNotificationAction.ts

@@ -0,0 +1,6 @@
+export const setScrollToErrorNotificationAction = ({ props }) => {
+  return {
+    ...props,
+    scrollToErrorNotification: true,
+  };
+};

web-client/src/presenter/actions/setValidationAlertErrorsAction.test.ts

@@ -17,6 +17,7 @@ describe('setValidationAlertErrors', () => {
     });
     expect(state.alertError).toMatchObject({
       messages: ['Some issue occurred'],
+      scrollToErrorNotification: false,
     });
   });
 
@@ -140,4 +141,23 @@ describe('setValidationAlertErrors', () => {
       messages: ['second nested', 'first nested'],
     });
   });
+
+  it('should set state.alertError to true when scrollToErrorNotification is true', async () => {
+    const { state } = await runAction(setValidationAlertErrorsAction, {
+      modules: {
+        presenter,
+      },
+      props: {
+        errors: {
+          irsNoticeDate: 'Some issue occurred',
+        },
+        scrollToErrorNotification: true,
+      },
+      state: {},
+    });
+    expect(state.alertError).toMatchObject({
+      messages: ['Some issue occurred'],
+      scrollToErrorNotification: true,
+    });
+  });
 });

web-client/src/presenter/actions/setValidationAlertErrorsAction.ts

@@ -86,6 +86,7 @@ export const setValidationAlertErrorsAction = ({
           }
         }),
     ),
+    scrollToErrorNotification: props.scrollToErrorNotification || false,
     title: 'Please correct the following errors on the page:',
   };
   store.set(state.alertError, alertError);

web-client/src/presenter/actions/validateCaseDetailsAction.ts

@@ -18,6 +18,9 @@ export const validateCaseDetailsAction = async ({
         caseDetail: {
           ...caseDetail,
           ...form,
+          caseType: form.caseType || null,
+          petitionPaymentDate: form.petitionPaymentDate || null,
+          petitionPaymentMethod: form.petitionPaymentMethod || null,
           preferredTrialCity: form.preferredTrialCity
             ? form.preferredTrialCity
             : null,

web-client/src/presenter/actions/validatePetitionerAction.test.ts

@@ -40,7 +40,7 @@ describe('validatePetitionerAction', () => {
       },
     });
 
-    expect(result.state.validationErrors.contact).toEqual(null);
+    expect(result.state.validationErrors).toBeUndefined();
     expect(successStub.mock.calls.length).toEqual(1);
   });
 

web-client/src/presenter/actions/validatePetitionerAction.ts

@@ -14,7 +14,6 @@ export const validatePetitionerAction = ({
   applicationContext,
   get,
   path,
-  store,
 }: ActionProps) => {
   const { contact } = get(state.form);
   const caseDetail = get(state.caseDetail);
@@ -26,11 +25,9 @@ export const validatePetitionerAction = ({
       existingPetitioners: caseDetail.petitioners,
     });
 
-  store.set(state.validationErrors.contact, errors);
-
   if (isEmpty(errors)) {
     return path.success();
   } else {
-    return path.error({ errors });
+    return path.error({ errors: { contact: errors } });
   }
 };

web-client/src/presenter/computeds/alertHelper.ts

@@ -15,7 +15,6 @@ export const alertHelper = (get: Get): any => {
 
   return {
     messagesDeduped: uniq(alertError.messages).filter(Boolean),
-    preventAutoScroll: false,
     responseCode: alertError.responseCode,
     showErrorAlert:
       !!alertError.title || !!alertError.message || !!alertError.messages,

web-client/src/presenter/presenter.ts

@@ -604,6 +604,7 @@ import { validateRemoveFromTrialSessionSequence } from './sequences/validateRemo
 import { validateSelectDocumentTypeSequence } from './sequences/validateSelectDocumentTypeSequence';
 import { validateSetForHearingSequence } from './sequences/validateSetForHearingSequence';
 import { validateStampSequence } from './sequences/validateStampSequence';
+import { validateStatusReportOrderSequence } from '@web-client/presenter/sequences/StatusReportOrder/validateStatusReportOrderSequence';
 import { validateTrialSessionHearingNoteSequence } from './sequences/validateTrialSessionHearingNoteSequence';
 import { validateTrialSessionNoteSequence } from './sequences/validateTrialSessionNoteSequence';
 import { validateTrialSessionPlanningSequence } from './sequences/validateTrialSessionPlanningSequence';
@@ -1594,6 +1595,7 @@ export const presenterSequences = {
   validateSetForHearingSequence:
     validateSetForHearingSequence as unknown as Function,
   validateStampSequence: validateStampSequence as unknown as Function,
+  validateStatusReportOrderSequence,
   validateTrialSessionHearingNoteSequence:
     validateTrialSessionHearingNoteSequence as unknown as Function,
   validateTrialSessionNoteSequence:

web-client/src/presenter/sequences/JudgeActivityReport/submitJudgeActivityReportSequence.ts

@@ -6,11 +6,11 @@ import { getPendingMotionDocketEntriesAction } from '@web-client/presenter/actio
 import { getSubmittedAndCavCasesByJudgeAction } from '@web-client/presenter/actions/JudgeActivityReport/getSubmittedAndCavCasesByJudgeAction';
 import { parallel } from 'cerebral';
 import { resetHasUserSubmittedFormAction } from '@web-client/presenter/actions/JudgeActivityReport/resetHasUserSubmittedFormAction';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
 import { setCavAndSubmittedCasesAction } from '@web-client/presenter/actions/JudgeActivityReport/setCavAndSubmittedCasesAction';
 import { setDefaultSubmittedAndCavSortOrderAction } from '@web-client/presenter/actions/JudgeActivityReport/setDefaultSubmittedAndCavSortOrderAction';
 import { setJudgeActivityReportFiltersAction } from '@web-client/presenter/actions/JudgeActivityReport/setJudgeActivityReportFiltersAction';
 import { setPendingMotionDocketEntriesForCurrentJudgeAction } from '@web-client/presenter/actions/PendingMotion/setPendingMotionDocketEntriesForCurrentJudgeAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
 import { setValidationAlertErrorsAction } from '../../actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '@web-client/presenter/utilities/showProgressSequenceDecorator';
@@ -27,8 +27,8 @@ export const submitJudgeActivityReportSequence = showProgressSequenceDecorator([
   validateJudgeActivityReportSearchAction,
   {
     error: [
-      setAlertErrorAction,
       setValidationErrorsAction,
+      setScrollToErrorNotificationAction,
       setValidationAlertErrorsAction,
     ],
     success: [

web-client/src/presenter/sequences/JudgeActivityReport/submitJudgeActivityStatisticsReportSequence.ts

@@ -4,9 +4,9 @@ import { getCasesClosedByJudgeAction } from '../../actions/JudgeActivityReport/g
 import { getJudgeActivityReportCountsAction } from '../../actions/JudgeActivityReport/getJudgeActivityReportCountsAction';
 import { getTrialSessionsForJudgeActivityReportAction } from '../../actions/JudgeActivityReport/getTrialSessionsForJudgeActivityReportAction';
 import { parallel } from 'cerebral';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
 import { setHasUserSubmittedFormAction } from '@web-client/presenter/actions/JudgeActivityReport/setHasUserSubmittedFormAction';
 import { setJudgeActivityReportDataAction } from '@web-client/presenter/actions/JudgeActivityReport/setJudgeActivityReportDataAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
 import { setValidationAlertErrorsAction } from '../../actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '@web-client/presenter/utilities/showProgressSequenceDecorator';
@@ -21,8 +21,8 @@ export const submitJudgeActivityStatisticsReportSequence =
     validateJudgeActivityStatisticsReportSearchAction,
     {
       error: [
-        setAlertErrorAction,
         setValidationErrorsAction,
+        setScrollToErrorNotificationAction,
         setValidationAlertErrorsAction,
       ],
       success: [

web-client/src/presenter/sequences/Login/submitChangePasswordSequence.ts

@@ -8,7 +8,7 @@ import { setSaveAlertsForNavigationAction } from '@web-client/presenter/actions/
 import { setTokenAction } from '@web-client/presenter/actions/Login/setTokenAction';
 import { setUserAction } from '@web-client/presenter/actions/setUserAction';
 import { setUserPermissionsAction } from '@web-client/presenter/actions/setUserPermissionsAction';
-import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
+import { setValidationErrorsAction } from '@web-client/presenter/actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
 import { submitChangePasswordAction } from '@web-client/presenter/actions/Login/submitChangePasswordAction';
 import { validateChangePasswordFormAction } from '@web-client/presenter/actions/Login/validateChangePasswordFormAction';
@@ -18,7 +18,7 @@ export const submitChangePasswordSequence = [
     clearAlertsAction,
     validateChangePasswordFormAction,
     {
-      error: [setValidationAlertErrorsAction],
+      error: [setValidationErrorsAction],
       success: [
         submitChangePasswordAction,
         {

web-client/src/presenter/sequences/Public/submitPublicCaseAdvancedSearchSequence.ts

@@ -3,7 +3,8 @@ import { clearSearchResultsAction } from '../../actions/AdvancedSearch/clearSear
 import { clearSearchTermAction } from '../../actions/clearSearchTermAction';
 import { defaultCaseSearchDatesAction } from '@web-client/presenter/actions/AdvancedSearch/defaultCaseSearchDatesAction';
 import { setAdvancedSearchResultsAction } from '../../actions/AdvancedSearch/setAdvancedSearchResultsAction';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
+import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
 import { startShowValidationAction } from '@web-client/presenter/actions/startShowValidationAction';
@@ -16,10 +17,11 @@ export const submitPublicCaseAdvancedSearchSequence = [
   validateCaseAdvancedSearchAction,
   {
     error: [
-      setAlertErrorAction,
+      startShowValidationAction,
       setValidationErrorsAction,
+      setScrollToErrorNotificationAction,
+      setValidationAlertErrorsAction,
       clearSearchResultsAction,
-      startShowValidationAction,
     ],
     success: showProgressSequenceDecorator([
       clearAlertsAction,

web-client/src/presenter/sequences/Public/submitPublicCaseDocketNumberSearchSequence.ts

@@ -2,9 +2,10 @@ import { caseExistsAction } from '../../actions/caseExistsAction';
 import { clearSearchResultsAction } from '../../actions/AdvancedSearch/clearSearchResultsAction';
 import { clearSearchTermAction } from '../../actions/clearSearchTermAction';
 import { navigateToCaseDetailAction } from '../../actions/navigateToCaseDetailAction';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
 import { setDocketNumberFromAdvancedSearchAction } from '../../actions/AdvancedSearch/setDocketNumberFromAdvancedSearchAction';
 import { setNoMatchesCaseSearchAction } from '../../actions/AdvancedSearch/setNoMatchesCaseSearchAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
+import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
 import { startShowValidationAction } from '../../actions/startShowValidationAction';
@@ -17,8 +18,9 @@ export const submitPublicCaseDocketNumberSearchSequence = [
   validateCaseDocketNumberSearchAction,
   {
     error: [
-      setAlertErrorAction,
       setValidationErrorsAction,
+      setScrollToErrorNotificationAction,
+      setValidationAlertErrorsAction,
       clearSearchResultsAction,
     ],
     success: showProgressSequenceDecorator([

web-client/src/presenter/sequences/Public/submitPublicOpinionAdvancedSearchSequence.ts

@@ -2,7 +2,8 @@ import { clearAlertsAction } from '../../actions/clearAlertsAction';
 import { clearSearchResultsAction } from '../../actions/AdvancedSearch/clearSearchResultsAction';
 import { clearSearchTermAction } from '../../actions/clearSearchTermAction';
 import { setAdvancedSearchResultsAction } from '../../actions/AdvancedSearch/setAdvancedSearchResultsAction';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
+import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
 import { startShowValidationAction } from '../../actions/startShowValidationAction';
@@ -14,10 +15,11 @@ export const submitPublicOpinionAdvancedSearchSequence = [
   validateOpinionAdvancedSearchAction,
   {
     error: [
-      setAlertErrorAction,
+      startShowValidationAction,
       setValidationErrorsAction,
+      setScrollToErrorNotificationAction,
+      setValidationAlertErrorsAction,
       clearSearchResultsAction,
-      startShowValidationAction,
     ],
     success: showProgressSequenceDecorator([
       clearAlertsAction,

web-client/src/presenter/sequences/Public/submitPublicOrderAdvancedSearchSequence.ts

@@ -2,7 +2,8 @@ import { clearAlertsAction } from '../../actions/clearAlertsAction';
 import { clearSearchResultsAction } from '../../actions/AdvancedSearch/clearSearchResultsAction';
 import { clearSearchTermAction } from '../../actions/clearSearchTermAction';
 import { setAdvancedSearchResultsAction } from '../../actions/AdvancedSearch/setAdvancedSearchResultsAction';
-import { setAlertErrorAction } from '../../actions/setAlertErrorAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
+import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
 import { startShowValidationAction } from '../../actions/startShowValidationAction';
@@ -14,10 +15,11 @@ export const submitPublicOrderAdvancedSearchSequence = [
   validateOrderAdvancedSearchAction,
   {
     error: [
-      setAlertErrorAction,
+      startShowValidationAction,
       setValidationErrorsAction,
+      setScrollToErrorNotificationAction,
+      setValidationAlertErrorsAction,
       clearSearchResultsAction,
-      startShowValidationAction,
     ],
     success: showProgressSequenceDecorator([
       clearAlertsAction,

web-client/src/presenter/sequences/StatusReportOrder/submitStatusReportOrderSequence.ts

@@ -2,6 +2,7 @@ import { clearAlertsAction } from '@web-client/presenter/actions/clearAlertsActi
 import { navigateToPathAction } from '@web-client/presenter/actions/navigateToPathAction';
 import { prepareStatusReportOrderAction } from '../../actions/StatusReportOrder/prepareStatusReportOrderAction';
 import { setAlertErrorAction } from '@web-client/presenter/actions/setAlertErrorAction';
+import { setScrollToErrorNotificationAction } from '@web-client/presenter/actions/setScrollToErrorNotificationAction';
 import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
 import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
 import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
@@ -13,7 +14,11 @@ export const submitStatusReportOrderSequence = [
     clearAlertsAction,
     validateStatusReportOrderFormAction,
     {
-      error: [setValidationErrorsAction, setValidationAlertErrorsAction],
+      error: [
+        setValidationErrorsAction,
+        setScrollToErrorNotificationAction,
+        setValidationAlertErrorsAction,
+      ],
       success: [
         prepareStatusReportOrderAction,
         submitCourtIssuedOrderSequence,

web-client/src/presenter/sequences/StatusReportOrder/validateStatusReportOrderSequence.ts

@@ -0,0 +1,16 @@
+import { clearAlertsAction } from '@web-client/presenter/actions/clearAlertsAction';
+import { setValidationAlertErrorsAction } from '@web-client/presenter/actions/setValidationAlertErrorsAction';
+import { setValidationErrorsAction } from '../../actions/setValidationErrorsAction';
+import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
+import { validateStatusReportOrderFormAction } from '../../actions/StatusReportOrder/validateStatusReportOrderFormAction';
+
+export const validateStatusReportOrderSequence = [
+  showProgressSequenceDecorator([
+    clearAlertsAction,
+    validateStatusReportOrderFormAction,
+    {
+      error: [setValidationErrorsAction, setValidationAlertErrorsAction],
+      success: [clearAlertsAction],
+    },
+  ]),
+] as unknown as () => void;