Merge branch 'VACMS-19548-orientation-of-map-controls-fl' into VACMS-…

…19549-conditional-render-services-select-fl

src/applications/combined-debt-portal/combined/components/BalanceCard.jsx

@@ -46,7 +46,7 @@ const BalanceCard = ({ amount, count, date, appType }) => {
         data-testid="card-link"
       >
         {linkText}
-        <va-icon icon="navigate_next" size={3} />
+        <va-icon icon="navigate_next" size={2} class="cdp-link-icon--active" />
       </Link>
     </va-card>
   );

src/applications/combined-debt-portal/combined/sass/combined-debt-portal.scss

@@ -16,30 +16,6 @@ h1:focus {
   list-style: none;
 }
 
-.on-this-page-links {
-  display: block;
-  border: 1px solid var(--vads-color-base-light);
-  border-radius: 4px;
-  padding: 1em;
-  dl {
-    margin: 0;
-  }
-}
-
-@media (min-width: $medium-screen) {
-  .on-this-page-links {
-    border: none;
-    padding: 1em 1em 1em 0;
-  }
-}
-
-.on-this-page-links dd a {
-  max-width: 285px;
-  i {
-    font-size: 0.75em;
-  }
-}
-
 .vads-u-width--fit {
   width: fit-content;
   white-space: nowrap;
@@ -65,4 +41,10 @@ h1:focus {
   @media (min-width: $medium-screen) {
     margin-left: 40px;
   }
-}
+}
+
+.cdp-link-icon--active {
+  vertical-align: baseline;
+  position: relative;
+  top: 3px;
+}

src/applications/combined-debt-portal/medical-copays/components/BalanceCard.jsx

@@ -12,12 +12,9 @@ import {
 
 const CurrentContent = ({ id, date }) => (
   <p className="vads-u-margin--0">
-    Your balance was updated on {formatDate(date)}. Pay your full balance or
-    request financial help before
-    <strong className="vads-u-margin-left--0p5" data-testid={`due-date-${id}`}>
-      {calcDueDate(date, 30)}
-    </strong>
-    , to avoid late charges, interest, or collection actions.
+    Your balance was updated on {formatDate(date)}. Pay your balance now or
+    request help by{' '}
+    <strong data-testid={`due-date-${id}`}>{calcDueDate(date, 30)}</strong>.
   </p>
 );
 
@@ -28,15 +25,13 @@ CurrentContent.propTypes = {
 
 const PastDueContent = ({ id, date, amount }) => (
   <p className="vads-u-margin--0">
-    Your balance on
-    <strong data-testid={`due-date-${id}`} className="vads-u-margin-x--0p5">
-      {formatDate(date)}
-    </strong>
-    was {currency(amount)}. If you haven’t either paid your full balance or
-    requested financial help, contact the VA Health Resource Center at{' '}
+    Your balance on{' '}
+    <strong data-testid={`due-date-${id}`}>{formatDate(date)}</strong> was{' '}
+    {currency(amount)}. If you haven’t paid your balance in full or requested
+    financial help, contact the VA Health Resource Center at{' '}
     <va-telephone contact="8664001238" /> (
     <va-telephone tty contact={CONTACTS[711]} />
-    ). We’re here Monday through Friday, 8:00 a.m. to 8:00 p.m. ET.
+    ).
   </p>
 );
 
@@ -59,22 +54,23 @@ const BalanceCard = ({ id, amount, facility, city, date }) => {
       data-testid={`balance-card-${id}`}
     >
       <h3
+        data-testid={`facility-city-${id}`}
         className="vads-u-margin-top--0 vads-u-margin-bottom--1p5"
-        data-testid={`amount-${id}`}
       >
-        {currency(amount)}
-        <span
-          data-testid={`facility-city-${id}`}
-          className="vads-u-margin-top--1 vads-u-margin-bottom--1p5 vads-u-display--block vads-u-font-size--h4 vads-u-font-weight--normal"
-        >
-          Copay balance for {facility} - {city}
-        </span>
+        {facility} - {city}
       </h3>
+      <p
+        className="vads-u-margin-top--0 vads-u-margin-bottom--1p5 vads-u-font-size--h4 vads-u-font-family--serif"
+        data-testid={`amount-${id}`}
+      >
+        <span className="vads-u-font-weight--normal">Current balance: </span>
+        <strong>{currency(amount)}</strong>
+      </p>
       <div className="vads-u-display--flex vads-u-margin-top--0  vads-u-margin-bottom--1p5">
         <va-icon
           icon="warning"
           size={3}
-          srtext="Alert"
+          srtext="Important"
           class="icon-color--warning vads-u-padding-right--1"
         />
 
@@ -94,7 +90,7 @@ const BalanceCard = ({ id, amount, facility, city, date }) => {
         }}
       >
         {linkText}
-        <va-icon icon="navigate_next" size={3} />
+        <va-icon icon="navigate_next" size={2} class="cdp-link-icon--active" />
       </Link>
     </va-card>
   );

src/applications/discover-your-benefits/constants/benefits.js

@@ -747,7 +747,7 @@ export const BENEFITS_LIST = [
     category: categories.MORE_SUPPORT,
     id: 'DCU',
     description:
-      'Select the learn more link and answer a series of questions to get customized step-by-step instructions on how to apply for a discharge upgrade or correction. If your application goes through and your discharge is upgraded, you’ll be eligible for the VA benefits you earned during your period of service.',
+      'Select the learn more link and answer a series of questions to get customized step-by-step instructions on how to apply for a discharge upgrade or correction. If we approve your discharge upgrade, you may be eligible for additional VA benefits.',
     isTimeSensitive: false,
     mappings: {
       [mappingTypes.GOALS]: [anyType.ANY],

src/applications/facility-locator/tests/e2e/mobile.cypress.spec.js

@@ -99,12 +99,12 @@ describe('Mobile', () => {
     cy.checkSearch();
   });
 
-  // [W,H, width of #facility-search]
+  // [W,H, width of #facility-search, +/- range (this matters for CI) where it gets confused how to apply style sheets]
   const sizes = [
-    [1024, 1000, 280],
-    [1007, 1000, 100],
-    [768, 1000, 699],
-    [481, 1000, 436],
+    [1024, 1000, 180.25, 100],
+    [1007, 1000, 100, 20],
+    [768, 1000, 699, 20],
+    [481, 1000, 436, 20],
   ];
   const desktopExistsGreaterThanEq = 768;
   const reactTabsExistsLessThanEq = 481;
@@ -118,7 +118,7 @@ describe('Mobile', () => {
       cy.get('#facility-search').then($element => {
         // increased this range because locally it was 699 and on the CI it was 684 for tablet
         // similarly for 481px it was 436 locally and 421 on CI
-        expect($element.width()).closeTo(size[2], 20);
+        expect($element.width()).closeTo(size[2], size[3]);
       });
 
       if (size[0] >= desktopExistsGreaterThanEq) {

src/applications/income-limits/containers/HomePage.jsx

@@ -52,6 +52,19 @@ const HomePage = ({
         Answer 2 questions to find out how your income may affect your VA health
         care eligibility and costs.
       </p>
+      <va-alert
+        class="vads-u-margin-top--1 vads-u-margin-bottom--3"
+        close-btn-aria-label="Close notification"
+        status="info"
+        visible
+      >
+        <h2 slot="headline">
+          We’ve updated this tool to check 2025 income limits
+        </h2>
+        <p className="vads-u-margin-y--0">
+          You can check your income limits for 2025 now.
+        </p>
+      </va-alert>
       <h2>What to know before you start:</h2>
       <ul className="vads-u-margin-left--1">
         <li>

src/applications/representative-appoint/components/SelectAccreditedRepresentative.jsx

@@ -12,6 +12,7 @@ import SearchResult from './SearchResult';
 import SearchInput from './SearchInput';
 import { useReviewPage } from '../hooks/useReviewPage';
 import { SearchResultsHeader } from './SearchResultsHeader';
+import { isAttorneyOrClaimsAgent } from '../utilities/helpers';
 
 const SelectAccreditedRepresentative = props => {
   const {
@@ -70,7 +71,13 @@ const SelectAccreditedRepresentative = props => {
 
   const handleGoForward = ({ selectionMade = false, newSelection = null }) => {
     const selection = formData['view:selectedRepresentative'];
+
+    const repTypeChanged =
+      isAttorneyOrClaimsAgent(currentSelectedRep) !==
+      isAttorneyOrClaimsAgent(newSelection);
     const noSelectionExists = !selection && !selectionMade;
+    const noNewSelection =
+      !newSelection || newSelection === currentSelectedRep.current;
 
     if (noSelectionExists && !invalidQuery) {
       setError(noSelectionError);
@@ -79,8 +86,10 @@ const SelectAccreditedRepresentative = props => {
       setError(noSearchError);
       scrollToFirstError({ focusOnAlertRole: true });
     } else if (isReviewPage) {
-      if (!newSelection || newSelection === currentSelectedRep.current) {
+      if (noNewSelection) {
         goToPath('/review-and-submit');
+      } else if (repTypeChanged) {
+        goToPath('/representative-contact');
       } else {
         goToPath('/representative-contact?review=true');
       }

src/applications/representative-appoint/config/form.js

@@ -1,6 +1,7 @@
 import commonDefinitions from 'vets-json-schema/dist/definitions.json';
 // import environment from '@department-of-veterans-affairs/platform-utilities/environment';
 // import profileContactInfo from 'platform/forms-system/src/js/definitions/profileContactInfo';
+import FormFooter from 'platform/forms/components/FormFooter';
 import configService from '../utilities/configService';
 import manifest from '../manifest.json';
 import IntroductionPage from '../containers/IntroductionPage';
@@ -66,6 +67,7 @@ const formConfig = {
   trackingPrefix: 'appoint-a-rep-21-22-and-21-22A',
   introduction: IntroductionPage,
   confirmation: ConfirmationPage,
+  footerContent: FormFooter,
   formId: '21-22',
   preSubmitInfo: {
     CustomComponent: PreSubmitInfo,

src/applications/representative-appoint/tests/config/formConfig.unit.spec.jsx

@@ -35,13 +35,14 @@ describe('FormConfig depends function', () => {
 
     it('should hide selectAccreditedOrganization', () => {
       expect(repPages.selectAccreditedOrganization.depends(mockFormData2122a))
-        .to.be.false;
+        .to.not.be.ok;
     });
   });
 
   context('21-22', () => {
     it('should hide authorizeInsideVA', () => {
-      expect(authPages.authorizeInsideVA.depends(mockFormData2122)).to.be.false;
+      expect(authPages.authorizeInsideVA.depends(mockFormData2122)).to.not.be
+        .ok;
     });
 
     it('should show selectAccreditedOrganization', () => {
@@ -50,21 +51,21 @@ describe('FormConfig depends function', () => {
     });
 
     it('should hide authorizeInsideVA', () => {
-      expect(authPages.authorizeInsideVA.depends(mockFormData2122)).to.be.false;
+      expect(authPages.authorizeInsideVA.depends(mockFormData2122)).to.not.be
+        .ok;
     });
 
     it('should hide authorizeOutsideVA', () => {
-      expect(authPages.authorizeOutsideVA.depends(mockFormData2122)).to.be
-        .false;
+      expect(authPages.authorizeOutsideVA.depends(mockFormData2122)).to.not.be
+        .ok;
     });
     it('should hide authorizeOutsideVANames', () => {
-      expect(authPages.authorizeOutsideVANames.depends(mockFormData2122)).to.be
-        .false;
+      expect(authPages.authorizeOutsideVANames.depends(mockFormData2122)).to.be;
     });
 
     it('should hide veteranServiceInformation', () => {
       expect(veteranPages.veteranServiceInformation.depends(mockFormData2122))
-        .to.be.false;
+        .to.not.be.ok;
     });
   });
 

src/applications/representative-appoint/tests/utilities/isAttorneyOrClaimsAgent.unit.spec.jsx

@@ -59,7 +59,7 @@ describe('isAttorneyOrClaimsAgent', () => {
       },
     };
     const result = isAttorneyOrClaimsAgent(mockFormData);
-    expect(result).to.be.false;
+    expect(result).to.not.be.ok;
   });
 
   it('should return false when the selected rep has no individualType', () => {
@@ -69,6 +69,6 @@ describe('isAttorneyOrClaimsAgent', () => {
       },
     };
     const result = isAttorneyOrClaimsAgent(mockFormData);
-    expect(result).to.be.false;
+    expect(result).to.not.be.ok;
   });
 });

src/applications/representative-appoint/utilities/helpers.js

@@ -149,14 +149,10 @@ export const isVSORepresentative = formData => {
   return false;
 };
 
-export const isAttorneyOrClaimsAgent = formData => {
-  const repType =
-    formData['view:selectedRepresentative']?.attributes?.individualType;
-
-  return ['attorney', 'claimsAgent', 'claims_agent', 'claim_agents'].includes(
-    repType,
-  );
-};
+export const isAttorneyOrClaimsAgent = formData =>
+  ['attorney', 'claimsAgent', 'claims_agent', 'claim_agents'].includes(
+    formData?.['view:selectedRepresentative']?.attributes?.individualType,
+  ) || null;
 
 const isOrg = formData =>
   formData['view:selectedRepresentative']?.type === 'organization';

src/applications/simple-forms/form-upload/components/CustomReviewTopContent.jsx

@@ -5,7 +5,12 @@ import {
   VaIcon,
   VaTelephone,
 } from '@department-of-veterans-affairs/component-library/dist/react-bindings';
-import { getFileSize, getFormNumber, mask } from '../helpers';
+import {
+  getFileSize,
+  getFormNumber,
+  mask,
+  formattedPhoneNumber,
+} from '../helpers';
 import EditLink from './EditLink';
 
 const CustomReviewTopContent = () => {
@@ -60,23 +65,12 @@ const CustomReviewTopContent = () => {
     </div>
   );
 
-  const formattedPhoneNumber = () => {
-    const phoneNumberWithoutDashes = phoneNumber.replaceAll('-', '');
-    return `(${phoneNumberWithoutDashes.substr(
-      0,
-      3,
-    )}) ${phoneNumberWithoutDashes.substr(
-      3,
-      3,
-    )}-${phoneNumberWithoutDashes.substr(6, 4)}`;
-  };
-
   const renderContactInfo = () => (
     <div>
       {phoneNumber ? (
         <div>
           <p className="usa-hint">Phone number</p>
-          <p>{formattedPhoneNumber()}</p>
+          <p>{formattedPhoneNumber(phoneNumber)}</p>
         </div>
       ) : null}
       <div>

src/applications/simple-forms/form-upload/config/constants.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { VaAlert } from '@department-of-veterans-affairs/component-library/dist/react-bindings';
 
-export const PrimaryActionLink = ({ href = '/', children, onClick = null }) => (
+export const PrimaryActionLink = ({ href, children, onClick }) => (
   <div className="action-bar-arrow">
     <div className="vads-u-background-color--primary vads-u-padding--1">
       <a className="vads-c-action-link--white" href={href} onClick={onClick}>