1255 - use different data and pdf templates based on feature flag value

src/applications/personalization/profile/components/proof-of-veteran-status/ProofOfVeteranStatus.jsx

@@ -6,6 +6,7 @@ import { generatePdf } from '~/platform/pdf';
 import { focusElement } from '~/platform/utilities/ui';
 import { captureError } from '~/platform/user/profile/vap-svc/util/analytics';
 import { CONTACTS } from '@department-of-veterans-affairs/component-library/contacts';
+import { useFeatureToggle } from '~/platform/utilities/feature-toggles';
 import { formatFullName } from '../../../common/helpers';
 import { getServiceBranchDisplayName } from '../../helpers';
 
@@ -32,7 +33,7 @@ const ProofOfVeteranStatus = ({
     (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) ||
     /android/i.test(userAgent);
 
-  const pdfData = {
+  const pdfDataOld = {
     title: `Veteran status card for ${formatFullName({
       first,
       middle,
@@ -60,6 +61,53 @@ const ProofOfVeteranStatus = ({
       },
     },
   };
+  const pdfDataNew = {
+    title: `Veteran status card for ${formatFullName({
+      first,
+      middle,
+      last,
+      suffix,
+    })}`,
+    details: {
+      fullName: formatFullName({
+        first,
+        middle,
+        last,
+        suffix,
+      }),
+      serviceHistory: serviceHistory.map(item => {
+        return {
+          ...item,
+          branchOfService: getServiceBranchDisplayName(item.branchOfService),
+        };
+      }),
+      totalDisabilityRating,
+      edipi,
+      image: {
+        title: 'V-A logo',
+        url: '/img/design/logo/logo-black-and-white.png',
+      },
+      seal: {
+        title: 'V-A Seal',
+        url: '/img/design/logo/seal-black-and-white.png',
+      },
+      scissors: {
+        title: 'Scissors icon',
+        url: '/img/scissors-black.png',
+      },
+    },
+  };
+
+  const {
+    TOGGLE_NAMES,
+    useToggleValue,
+    useToggleLoadingValue,
+  } = useFeatureToggle();
+
+  const isLoadingFeatureFlags = useToggleLoadingValue();
+  const showNewPdf = useToggleValue(
+    TOGGLE_NAMES.veteranStatusCardUseLighthouse,
+  );
 
   useEffect(
     () => {
@@ -75,9 +123,11 @@ const ProofOfVeteranStatus = ({
 
     try {
       await generatePdf(
-        'veteranStatus',
+        isLoadingFeatureFlags || !showNewPdf
+          ? 'veteranStatus'
+          : 'veteranStatusNew',
         'Veteran status card',
-        pdfData,
+        isLoadingFeatureFlags || !showNewPdf ? pdfDataOld : pdfDataNew,
         !isMobile,
       );
     } catch (error) {
@@ -115,6 +165,10 @@ const ProofOfVeteranStatus = ({
     );
   });
 
+  if (isLoadingFeatureFlags) {
+    return null;
+  }
+
   return (
     <>
       <div id="proof-of-veteran-status">

src/applications/personalization/profile/mocks/server.js

@@ -106,6 +106,7 @@ const responses = {
             profileUseExperimental: false,
             profileShowPrivacyPolicy: true,
             veteranOnboardingContactInfoFlow: true,
+            veteranStatusCardUseLighthouse: true,
           }),
         ),
       secondsOfDelay,
@@ -236,7 +237,8 @@ const responses = {
     //   .json(serviceHistory.generateServiceHistoryError('403'));
   },
   'GET /v0/disability_compensation_form/rating_info': (_req, res) => {
-    return res.status(200).json(ratingInfo.success);
+    // return res.status(200).json(ratingInfo.success.serviceConnected0);
+    return res.status(200).json(ratingInfo.success.serviceConnected40);
     // return res.status(500).json(genericErrors.error500);
   },
 

src/platform/pdf/templates/index.js

@@ -16,4 +16,8 @@ templates.veteranStatus = () => {
   return require('./veteran_status');
 };
 
+templates.veteranStatusNew = () => {
+  return require('./veteran_status_new');
+};
+
 export { templates };