Skip to content

Commit

Permalink
#VYE-360 #comment new format for enrollment logic (#29459)
Browse files Browse the repository at this point in the history 
* #VYE-360 #comment new format for enrollment logic

* #VYE-360 #comment updated unit tests

* #VYE-360 #comment updated e2e test

* #VYE-360 #comment update mock data

* #VYE-360 #comment update enrollment-verification cypress test

* #VYE-360 #comment removed old code not in use
  • Loading branch information
@jsimonVA
jsimonVA committed Apr 29, 2024
1 parent cc5c6a3 commit bfd5397
Show file tree
Hide file tree
Showing 12 changed files with 696 additions and 873 deletions.
4 changes: 2 additions & 2 deletions src/applications/verify-your-enrollment/actions/index.js
View file
@@ -1,6 +1,6 @@
import { apiRequest } from '@department-of-veterans-affairs/platform-utilities/api';
import environment from '@department-of-veterans-affairs/platform-utilities/environment';
import { USER_MOCK_DATA } from '../constants/mockData';
import { UPDATED_USER_MOCK_DATA } from '../constants/mockData';
// Action Types
export const UPDATE_PENDING_VERIFICATIONS = 'UPDATE_PENDING_VERIFICATIONS';
export const UPDATE_VERIFICATIONS = 'UPDATE_VERIFICATIONS';
Expand Down Expand Up @@ -67,7 +67,7 @@ export const getData = () => {
setTimeout(() => {
disptach({
type: GET_DATA_SUCCESS,
response: USER_MOCK_DATA,
response: UPDATED_USER_MOCK_DATA,
});
}, 1000);
};
Expand Down
34 changes: 4 additions & 30 deletions src/applications/verify-your-enrollment/components/Enrollmentcard.jsx
View file
Expand Up @@ -7,11 +7,7 @@ import {
getPeriodsToVerify,
} from '../helpers';

const EnrollmentCard = ({
enrollmentPeriods,
confirmationPage = false,
confirmedEnrollment = false,
}) => {
const EnrollmentCard = ({ enrollmentPeriods, confirmationPage = false }) => {
const getCards = () => {
const combinedEnrollmentsObj = combineEnrollmentsWithStartMonth(
enrollmentPeriods,
Expand All @@ -23,10 +19,10 @@ const EnrollmentCard = ({
// if there are more than one enrollment periods that startd in the same month
// then the records are combined into the same array
// if else is in place to take account for arrays that have multiple objects
return combinedEnrollmentsValues.map(enrollment => {
return combinedEnrollmentsValues.map((enrollment, index) => {
if (enrollment.length > 1) {
return (
<div key={enrollment[0].id}>
<div key={index}>
<div className="vads-u-margin-top--3">
<h2 className="vye-highlighted-title-container">
{translateDateIntoMonthYearFormat(enrollment[0].awardBeginDate)}
Expand All @@ -37,17 +33,6 @@ const EnrollmentCard = ({
`This is the enrollment information we have on file for you for ${translateDateIntoMonthYearFormat(
enrollment[0].awardBeginDate,
)}.`}
{confirmationPage &&
confirmedEnrollment && (
<>
<i
className="fas fa-check-circle vads-u-color--green "
aria-hidden="true"
/>{' '}
You are verifying that this month’s enrollment information
is correct
</>
)}
{enrollment.map(nestedEnrollment => {
{
/* sending true as second argument turns on left border */
Expand All @@ -59,7 +44,7 @@ const EnrollmentCard = ({
);
}
return (
<div key={enrollment[0].id}>
<div key={index}>
<div className="vads-u-margin-top--3">
<h2 className="vye-highlighted-title-container">
{translateDateIntoMonthYearFormat(enrollment[0].awardBeginDate)}
Expand All @@ -70,17 +55,6 @@ const EnrollmentCard = ({
`This is the enrollment information we have on file for you for ${translateDateIntoMonthYearFormat(
enrollment[0].awardBeginDate,
)}.`}
{confirmationPage &&
confirmedEnrollment && (
<>
<i
className="fas fa-check-circle vads-u-color--green "
aria-hidden="true"
/>{' '}
You are verifying that this month’s enrollment information is
correct
</>
)}
{/* sending true as second argument turns on left border */}
{getPeriodsToVerify(enrollment, true)}
</div>
Expand Down
32 changes: 10 additions & 22 deletions src/applications/verify-your-enrollment/components/PeriodsToVerify.jsx
View file
Expand Up @@ -27,34 +27,22 @@ const PeriodsToVerify = ({
useEffect(
() => {
if (
userEnrollmentData?.['vye::UserInfo']?.awards &&
userEnrollmentData?.['vye::UserInfo']?.verifications &&
userEnrollmentData?.['vye::UserInfo']?.pendingVerifications
) {
const { awards, pendingVerifications } = userEnrollmentData?.[
'vye::UserInfo'
];
// add all previouslyVerified data into single array
const { awardIds } = pendingVerifications;
const toBeVerifiedEnrollmentsArray = [];
awardIds.forEach(id => {
// check for each id inside award_ids array
if (awards.some(award => award.id === id)) {
toBeVerifiedEnrollmentsArray.push(
awards.find(award => award.id === id),
);
}
});
const { pendingVerifications } = userEnrollmentData?.['vye::UserInfo'];

setPendingEnrollments(toBeVerifiedEnrollmentsArray);
// add all data to be verified into single array
setPendingEnrollments(pendingVerifications);
}
},
[userEnrollmentData],
);

return (
<div id="verifications-pending-alert">
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.awardIds
.length > 0 && (
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.length >
0 && (
<va-alert
close-btn-aria-label="Close notification"
status="info"
Expand All @@ -79,15 +67,15 @@ const PeriodsToVerify = ({
as it would always show the verified success statement if there are no pending
enrollments even if the user didn't just verify
*/}
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.awardIds
.length === 0 &&
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.length ===
0 &&
justVerified && (
<div>
<VerifiedSuccessStatement />
</div>
)}
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.awardIds
.length === 0 &&
{userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.length ===
0 &&
!justVerified && (
<div className="vads-u-margin-top--2">
<UpToDateVerificationStatement />
Expand Down
163 changes: 118 additions & 45 deletions src/applications/verify-your-enrollment/components/PreviousEnrollmentVerifications.jsx
View file
Expand Up @@ -16,12 +16,51 @@ const PreviousEnrollmentVerifications = ({ enrollmentData }) => {
const [pageCount, setPageCount] = useState(0);
const [subsetStart, setSubsetStart] = useState(0);
const [subsetEnd, setSubsetEnd] = useState(0);
const totalEnrollmentCount = Object.keys(
combineEnrollmentsWithStartMonth(enrollmentData?.['vye::UserInfo']?.awards),

const totalEnrollmentVerificationsCount = Object.keys(
combineEnrollmentsWithStartMonth(
enrollmentData?.['vye::UserInfo']?.verifications,
),
).length;

const totalEnrollmentPendingVerificationsCount = Object.keys(
combineEnrollmentsWithStartMonth(
enrollmentData?.['vye::UserInfo']?.pendingVerifications,
),
).length;

// get count of verified and unverified enrollments (Grouped by start month)
const totalEnrollmentCount =
totalEnrollmentPendingVerificationsCount +
totalEnrollmentVerificationsCount;

const sortDatesByMonthYear = array => {
// Helper function to convert "Month YYYY" or "Date unavailable" to a Date object
function parseDate(dateStr) {
if (dateStr === 'Date unavailable') {
// Return a date far in the past to ensure it sorts last
return new Date(0); // January 1, 1970, or can use a specific older date to be explicit
}
const [month, year] = dateStr.split(' ');
return new Date(`${month} 1, ${year}`);
}

// Sorting the array of objects in descending order based on date keys
array.sort((a, b) => {
const keyA = Object.keys(a)[0];
const keyB = Object.keys(b)[0];
const dateA = parseDate(keyA);
const dateB = parseDate(keyB);
return dateB - dateA; // descending sorting | ascending would be dateA - dateB
});

// Extracting and returning the React components from the sorted array of objects
return array.map(obj => Object.values(obj)[0]);
};

const getPreviouslyVerified = () => {
let enrollments = [];

Object.values(pastAndCurrentAwards).forEach(month => {
if (month.length > 1) {
const tempGroupEnrollment = getGroupedPreviousEnrollments(month);
Expand All @@ -32,11 +71,74 @@ const PreviousEnrollmentVerifications = ({ enrollmentData }) => {
enrollments.push(tempSingleEnrollment);
}
});
const tempEnrollmentArray = [];
/*
enrollments is an array of react components.
we want to go through each element in the enrollments array
and find the month/year each element is associated with.
once we have this, we can sort the array based on month year with
the latest date on top.
*/
enrollments.forEach(enrollment => {
const topLevelEnrollment = enrollment?.props?.children;
const isAnArray = Array.isArray(topLevelEnrollment);

if (!isAnArray) {
const objectChildProps =
topLevelEnrollment.props?.children[0]?.props?.children;
const objectChildPropsIsArray = Array.isArray(objectChildProps);
if (!objectChildPropsIsArray) {
tempEnrollmentArray.push({
[objectChildProps]: enrollment,
});
}
if (objectChildPropsIsArray) {
tempEnrollmentArray.push({
[objectChildProps[0].props.children]: enrollment,
});
}
}

if (isAnArray) {
// find the first object within the array that is not undefined and is not null
const firstNotUndefined = topLevelEnrollment.find(
el => el !== undefined && el !== null && el !== false,
);
const firstChildProps =
firstNotUndefined.props?.children[0]?.props?.children;
const firstChildIsArray = Array.isArray(firstChildProps);

if (firstChildIsArray) {
tempEnrollmentArray.push({
[firstChildProps[0].props?.children]: enrollment,
});
}

if (!firstChildIsArray) {
const secondChildProps =
firstNotUndefined.props?.children[0]?.props?.children;
const secondChildPropsIsArray = Array.isArray(secondChildProps);
if (!secondChildPropsIsArray) {
tempEnrollmentArray.push({
[firstNotUndefined.props?.children[0]?.props
?.children]: enrollment,
});
}
}
}
});

if (tempEnrollmentArray.length > 0) {
const sortedEnrollments = sortDatesByMonthYear(tempEnrollmentArray);
enrollments = sortedEnrollments;
}

// Adjust based on subsetStart and subsetEnd to control the number of elements returned
enrollments = enrollments.reverse().slice(subsetStart, subsetEnd);

enrollments = enrollments.slice(subsetStart, subsetEnd);
return enrollments;
};

const handlePageChange = useCallback(
pageNumber => {
setSubsetStart(pageNumber * ENROLLMETS_PER_PAGE - ENROLLMETS_PER_PAGE);
Expand Down Expand Up @@ -67,50 +169,23 @@ const PreviousEnrollmentVerifications = ({ enrollmentData }) => {

useEffect(
() => {
const allEnrollments = [];
if (
userEnrollmentData?.['vye::UserInfo']?.awards &&
userEnrollmentData?.['vye::UserInfo']?.verifications
userEnrollmentData?.['vye::UserInfo']?.pendingVerifications?.length > 0
) {
const { awards, verifications } = userEnrollmentData?.['vye::UserInfo'];
// add all awards data into single array, verified and non-verified
const allEnrollments = awards.flatMap((award, index) => {
// check each award that has been verified and add the
// verified date to the enrollment period being returned
if (index < verifications.length) {
const {
awardIds,
createdOn,
PendingVerificationSubmitted,
} = verifications[index];
// check if record has been verified
if (awardIds?.some(id => id === award.id)) {
const tempData = award;
let updatedTempData = {};
if (createdOn) {
// add key/value when enrollment was verified
updatedTempData = { ...tempData, verifiedDate: createdOn };
}
if (PendingVerificationSubmitted) {
// add key/value when enrollment was verified
updatedTempData = {
...tempData,
PendingVerificationSubmitted,
};
}
return updatedTempData;
}
}
// add enrollment that has not been verified
return award;
const { pendingVerifications } = userEnrollmentData?.['vye::UserInfo'];
pendingVerifications.forEach(pendingAward => {
allEnrollments.push(pendingAward);
});

// array of all enrollment periods with verifiedDate
// add to enrollments that have been verified
// setPastAndCurrentAwards(allEnrollments);
setPastAndCurrentAwards(
combineEnrollmentsWithStartMonth(allEnrollments),
);
}
if (userEnrollmentData?.['vye::UserInfo']?.verifications?.length > 0) {
const { verifications } = userEnrollmentData?.['vye::UserInfo'];
verifications.forEach(award => {
allEnrollments.push(award);
});
}

setPastAndCurrentAwards(combineEnrollmentsWithStartMonth(allEnrollments));
},
[userEnrollmentData],
);
Expand Down Expand Up @@ -175,8 +250,6 @@ const PreviousEnrollmentVerifications = ({ enrollmentData }) => {
</p>
)}
{totalEnrollmentCount > 0 && getPreviouslyVerified()}
{/* {totalEnrollmentCount > 0 && pastAndCurrentAwards.length > 0 &&
<EnrollmentCard enrollmentPeriods={pastAndCurrentAwards}/>} */}
{totalEnrollmentCount === undefined && (
<p className="vads-u-margin-bottom--6">
<strong>You currently have no enrollments.</strong>
Expand Down

0 comments on commit bfd5397

Please sign in to comment.