[Issue 2552] opportunity detail heading updates (#2577)

* minor updates to heading text and page structure for opportunity detail * adds opportunity number to awards section
HHS · Oct 25, 2024 · be2f800 · be2f800
1 parent 6ebb7e3
commit be2f800
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 9 deletions.
diff --git a/frontend/src/components/opportunity/OpportunityAwardInfo.tsx b/frontend/src/components/opportunity/OpportunityAwardInfo.tsx
@@ -73,6 +73,7 @@ const OpportunityAwardInfo = ({ opportunityData }: Props) => {
   };
 
   const awardSubInfo = {
+    opportunity_number: opportunityData.opportunity_number,
     cost_sharing: opportunityData.summary.is_cost_sharing,
     funding_instrument: opportunityData.summary.funding_instruments,
     opportunity_category: opportunityData.category,

diff --git a/frontend/src/components/opportunity/OpportunityDescription.tsx b/frontend/src/components/opportunity/OpportunityDescription.tsx
@@ -71,13 +71,15 @@ const OpportunityDescription = ({ summary }: Props) => {
   return (
     <>
       <div className="usa-prose">
-        <h2>{t("description")}</h2>
+        <h2>{t("title")}</h2>
+        <h3>{t("summary")}</h3>
         <div
           dangerouslySetInnerHTML={{
             __html: DOMPurify.sanitize(summary.summary_description ?? "--"),
           }}
         />
-        <h2>{t("eligible_applicants")}</h2>
+        <h2>{t("eligibility")}</h2>
+        <h3>{t("eligible_applicants")}</h3>
         {eligibleApplicantsFormatter(summary.applicant_types)}
         <h3>{t("additional_info")}</h3>
         <div
@@ -86,19 +88,20 @@ const OpportunityDescription = ({ summary }: Props) => {
           }}
         />
         <h2>{t("contact_info")}</h2>
+        <h3>{t("description")}</h3>
         <div
           dangerouslySetInnerHTML={{
             __html: DOMPurify.sanitize(
               summary?.agency_contact_description || "--",
             ),
           }}
         />
-        <h3>{t("email")}</h3>
+        <h4>{t("email")}</h4>
         {summary?.agency_email_address_description && (
           <p>{summary.agency_email_address_description}</p>
         )}
         <p>{agencyEmailLink}</p>
-        <h3>{t("telephone")}</h3>
+        <h4>{t("telephone")}</h4>
         <p>{telephoneLink}</p>
       </div>
     </>

diff --git a/frontend/src/i18n/messages/en/index.ts b/frontend/src/i18n/messages/en/index.ts
@@ -14,12 +14,15 @@ export const messages = {
       last_updated: "Last Updated: ",
     },
     description: {
-      description: "Description",
-      eligible_applicants: "Eligible Applicants",
-      additional_info: "Additional Information on eligibility",
+      title: "Funding opportunity",
+      summary: "Summary",
+      eligibility: "Eligibility",
+      eligible_applicants: "Eligible applicants",
+      additional_info: "Additional information",
       contact_info: "Grantor contact information",
+      description: "Description",
       email: "Email",
-      telephone: "Telephone",
+      telephone: "Phone",
     },
     award_info: {
       yes: "Yes",
@@ -28,6 +31,7 @@ export const messages = {
       expected_awards: "Expected awards",
       award_ceiling: "Award Ceiling",
       award_floor: "Award Floor",
+      opportunity_number: "Funding opportunity number",
       cost_sharing: "Cost sharing or matching requirement",
       funding_instrument: "Funding instrument type",
       opportunity_category: "Opportunity Category",

diff --git a/frontend/tests/components/opportunity/OpportunityDescription.test.tsx b/frontend/tests/components/opportunity/OpportunityDescription.test.tsx
@@ -115,7 +115,7 @@ describe("OpportunityDescription", () => {
       />,
     );
 
-    const contactInfoHeading = screen.getByText("contact_info");
+    const contactInfoHeading = screen.getByText("summary");
     expect(contactInfoHeading).toBeInTheDocument();
     expect(contactInfoHeading.nextElementSibling).toHaveTextContent("--");