From 524e8cdb883a4578dfe7af556c7fc1093fe3ba0b Mon Sep 17 00:00:00 2001
From: Eric Sizer <esizer@users.noreply.github.com>
Date: Fri, 20 Oct 2023 09:02:23 -0400
Subject: [PATCH] [Fix] Remove status text for placed statuses (#8296)

* remove recruitment card status text when placed

* update suspended statuses

* fix tests
---
 .../QualifiedRecruitmentCard.test.tsx         | 44 ++++++++++++++-----
 .../QualifiedRecruitmentCard.tsx              | 36 ++++++++-------
 .../QualifiedRecruitmentCard/utils.ts         |  3 +-
 .../src/utils/poolCandidateCombinedStatus.tsx |  5 +--
 4 files changed, 55 insertions(+), 33 deletions(-)

diff --git a/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.test.tsx b/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.test.tsx
index a1ed727200d..a3970060a84 100644
--- a/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.test.tsx
+++ b/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.test.tsx
@@ -9,7 +9,10 @@ import { pipe, fromValue, delay } from "wonka";
 
 import { axeTest, renderWithProviders } from "@gc-digital-talent/jest-helpers";
 import { fakePoolCandidates } from "@gc-digital-talent/fake-data";
-import { FAR_PAST_DATE } from "@gc-digital-talent/date-helpers";
+import {
+  FAR_FUTURE_DATE,
+  FAR_PAST_DATE,
+} from "@gc-digital-talent/date-helpers";
 import { PoolCandidateStatus } from "@gc-digital-talent/graphql";
 
 import QualifiedRecruitmentCard, {
@@ -18,7 +21,10 @@ import QualifiedRecruitmentCard, {
 
 const mockApplication = fakePoolCandidates()[0];
 const defaultProps = {
-  candidate: mockApplication,
+  candidate: {
+    ...mockApplication,
+    expiryDate: FAR_FUTURE_DATE,
+  },
 };
 
 const mockClient = {
@@ -52,14 +58,23 @@ describe("QualifiedRecruitmentCard", () => {
 
     expect(screen.getByText(/hired \(casual\)/i)).toBeInTheDocument();
     expect(
-      screen.getByText(/you are open to opportunities from this recruitment/i),
-    ).toBeInTheDocument();
-    expect(screen.getByText(/change your availability/i)).toBeInTheDocument();
+      screen.queryByText(
+        /you are open to opportunities from this recruitment/i,
+      ),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(
+        /you are not receiving opportunities from this recruitment/i,
+      ),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/change your availability/i),
+    ).not.toBeInTheDocument();
     expect(
       screen.getByText(/show this recruitment's skill assessments/i),
     ).toBeInTheDocument();
     const buttons = screen.queryAllByRole("button");
-    expect(buttons).toHaveLength(3);
+    expect(buttons).toHaveLength(2);
   });
 
   it("PLACED_CASUAL and SUSPENDED", async () => {
@@ -72,18 +87,25 @@ describe("QualifiedRecruitmentCard", () => {
       },
     });
 
-    expect(screen.getByText(/not interested/i)).toBeInTheDocument();
+    expect(screen.getByText(/hired \(casual\)/i)).toBeInTheDocument();
     expect(
-      screen.getByText(
+      screen.queryByText(
+        /you are open to opportunities from this recruitment/i,
+      ),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(
         /you are not receiving opportunities from this recruitment/i,
       ),
-    ).toBeInTheDocument();
-    expect(screen.getByText(/change your availability/i)).toBeInTheDocument();
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/change your availability/i),
+    ).not.toBeInTheDocument();
     expect(
       screen.getByText(/show this recruitment's skill assessments/i),
     ).toBeInTheDocument();
     const buttons = screen.queryAllByRole("button");
-    expect(buttons).toHaveLength(3);
+    expect(buttons).toHaveLength(2);
   });
 
   it("PLACED_INDETERMINATE and UN-SUSPENDED", async () => {
diff --git a/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.tsx b/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.tsx
index 4d3f74a74e5..2b64265122d 100644
--- a/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.tsx
+++ b/apps/web/src/components/QualifiedRecruitmentCard/QualifiedRecruitmentCard.tsx
@@ -268,23 +268,25 @@ const QualifiedRecruitmentCard = ({
           data-h2-gap="base(x.5 0) p-tablet(0 x.5)"
           data-h2-text-align="base(center) p-tablet(inherit)"
         >
-          <p
-            data-h2-display="base(flex)"
-            data-h2-align-items="base(flex-start) p-tablet(center)"
-            data-h2-gap="base(0 x.25)"
-            data-h2-line-height="base(1)"
-            data-h2-flex-grow="base(0)"
-          >
-            {AvailabilityIcon ? (
-              <AvailabilityIcon
-                data-h2-height="base(auto)"
-                data-h2-width="base(1em)"
-                data-h2-flex-shrink="base(0)"
-                {...availability.color}
-              />
-            ) : null}
-            <span>{availability.text}</span>
-          </p>
+          {availability.text && (
+            <p
+              data-h2-display="base(flex)"
+              data-h2-align-items="base(flex-start) p-tablet(center)"
+              data-h2-gap="base(0 x.25)"
+              data-h2-line-height="base(1)"
+              data-h2-flex-grow="base(0)"
+            >
+              {AvailabilityIcon ? (
+                <AvailabilityIcon
+                  data-h2-height="base(auto)"
+                  data-h2-width="base(1em)"
+                  data-h2-flex-shrink="base(0)"
+                  {...availability.color}
+                />
+              ) : null}
+              <span>{availability.text}</span>
+            </p>
+          )}
           {availability.showDialog && (
             <div data-h2-flex-shrink="base(0)">
               <RecruitmentAvailabilityDialog candidate={candidate} />
diff --git a/apps/web/src/components/QualifiedRecruitmentCard/utils.ts b/apps/web/src/components/QualifiedRecruitmentCard/utils.ts
index 137dc9b6f42..f73aa9bb336 100644
--- a/apps/web/src/components/QualifiedRecruitmentCard/utils.ts
+++ b/apps/web/src/components/QualifiedRecruitmentCard/utils.ts
@@ -20,7 +20,6 @@ import {
   isExpiredCombinedStatus,
   isInactiveCombinedStatus,
   isErrorCombinedStatus,
-  isHiredLongTermCombinedStatus,
   isSuspendedCombinedStatus,
 } from "~/utils/poolCandidateCombinedStatus";
 
@@ -113,7 +112,7 @@ const getAvailabilityInfo = (
     };
   }
 
-  if (isHiredLongTermCombinedStatus(combinedStatus)) {
+  if (isHiredCombinedStatus(combinedStatus)) {
     return {
       icon: null,
       color: {},
diff --git a/apps/web/src/utils/poolCandidateCombinedStatus.tsx b/apps/web/src/utils/poolCandidateCombinedStatus.tsx
index 3b2348bfca9..a0333a20f48 100644
--- a/apps/web/src/utils/poolCandidateCombinedStatus.tsx
+++ b/apps/web/src/utils/poolCandidateCombinedStatus.tsx
@@ -59,13 +59,13 @@ const ERROR_STATUSES: CombinedStatus[] = ["REMOVED"];
 export const isErrorCombinedStatus = (
   status: Maybe<CombinedStatus>,
 ): boolean => (status ? ERROR_STATUSES.includes(status) : false);
-const HIRED_LONGE_TERM_STATUSES: CombinedStatus[] = [
+const HIRED_LONG_TERM_STATUSES: CombinedStatus[] = [
   "HIRED_INDETERMINATE",
   "HIRED_TERM",
 ];
 export const isHiredLongTermCombinedStatus = (
   status: Maybe<CombinedStatus>,
-): boolean => (status ? HIRED_LONGE_TERM_STATUSES.includes(status) : false);
+): boolean => (status ? HIRED_LONG_TERM_STATUSES.includes(status) : false);
 
 // Map combined statuses to their labels
 const combinedStatusLabels = defineMessages<CombinedStatus>({
@@ -184,7 +184,6 @@ const statusMap = new Map<PoolCandidateStatus, CombinedStatus>([
 
 // Map pool candidate statuses to their suspended combined statuses
 const suspendedStatusMap = new Map<PoolCandidateStatus, CombinedStatus>([
-  [PoolCandidateStatus.PlacedCasual, "NOT_INTERESTED"],
   [PoolCandidateStatus.QualifiedAvailable, "NOT_INTERESTED"],
 ]);