MNTOR-3887- Add EnableRemovalUnderMaintenanceStep flag to manual remo…

…val feature (#5427) * add enabledfeatureflags prop to components * add more unit tests * ignore tests * ignore tests * ignore test * remove ignore comments * iteration to prevent c8 ignore for useglean and usetelemetry
mozilla · Dec 20, 2024 · 833a9be · 833a9be
1 parent 2bd45be
commit 833a9be
Show file tree

Hide file tree

Showing 38 changed files with 730 additions and 222 deletions.
diff --git a/...react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/DashboardTopBanner/index.tsx b/...react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/DashboardTopBanner/index.tsx
@@ -9,6 +9,7 @@ import { DoughnutChart as Chart } from "../../../../../../../components/client/C
 import { DashboardSummary } from "../../../../../../../functions/server/dashboard";
 import { StepDeterminationData } from "../../../../../../../functions/server/getRelevantGuidedSteps";
 import { DashboardTopBannerContent } from "./DashboardTopBannerContent";
+import { FeatureFlagName } from "../../../../../../../../db/tables/featureFlags";
 
 export type DashboardTopBannerProps = {
   bannerData: DashboardSummary;
@@ -29,6 +30,7 @@ export type DashboardTopBannerProps = {
     monthly: number;
   };
   totalNumberOfPerformedScans?: number;
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 export const DashboardTopBanner = (props: DashboardTopBannerProps) => {

diff --git a/src/app/(proper_react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/View.tsx b/src/app/(proper_react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/View.tsx
@@ -178,9 +178,8 @@ export const View = (props: Props) => {
     arraySortedByDate.filter((exposure: Exposure) => {
       const exposureStatus = getExposureStatus(
         exposure,
-        props.enabledFeatureFlags.includes("AdditionalRemovalStatuses"),
-        // TODO: Waiting for criteria for data brokers under maintenance to be determined
-        // isDataBrokerUnderMaintenance(exposure),
+        isDataBrokerUnderMaintenance(exposure),
+        props.enabledFeatureFlags,
       );
 
       return (
@@ -232,12 +231,15 @@ export const View = (props: Props) => {
               variant="primary"
               wide
               href={
-                getNextGuidedStep({
-                  user: props.user,
-                  countryCode,
-                  latestScanData: adjustedScanData,
-                  subscriberBreaches: props.userBreaches,
-                }).href
+                getNextGuidedStep(
+                  {
+                    user: props.user,
+                    countryCode,
+                    latestScanData: adjustedScanData,
+                    subscriberBreaches: props.userBreaches,
+                  },
+                  props.enabledFeatureFlags,
+                ).href
               }
             >
               {l10n.getString("exposure-card-resolve-exposures-cta")}
@@ -531,6 +533,7 @@ export const View = (props: Props) => {
           yearlySubscriptionUrl={props.yearlySubscriptionUrl}
           subscriptionBillingAmount={props.subscriptionBillingAmount}
           totalNumberOfPerformedScans={props.totalNumberOfPerformedScans}
+          enabledFeatureFlags={props.enabledFeatureFlags}
         />
         <section className={styles.exposuresArea}>
           {activeTab === "action-needed" ? (
@@ -562,12 +565,12 @@ export const View = (props: Props) => {
   );
 };
 
-// TODO: Waiting for criteria for data brokers under maintenace to be determined
-// export function isDataBrokerUnderMaintenance(
-//   exposure: Exposure | OnerepScanResultDataBrokerRow,
-// ): boolean {
-//   return (
-//     isScanResult(exposure) &&
-//     exposure.broker_status === "removal_under_maintenance"
-//   );
-// }
+export function isDataBrokerUnderMaintenance(
+  exposure: Exposure | OnerepScanResultDataBrokerRow,
+): boolean {
+  return (
+    isScanResult(exposure) &&
+    exposure.broker_status === "removal_under_maintenance" &&
+    exposure.status !== "removed"
+  );
+}
diff --git a/src/app/(proper_react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/fix/FixView.tsx b/src/app/(proper_react)/(redesign)/(authenticated)/user/(dashboard)/dashboard/fix/FixView.tsx
@@ -19,6 +19,7 @@ import {
 } from "../../../../../../../functions/server/getRelevantGuidedSteps";
 import { useTelemetry } from "../../../../../../../hooks/useTelemetry";
 import { TelemetryButton } from "../../../../../../../components/client/TelemetryButton";
+import { FeatureFlagName } from "../../../../../../../../db/tables/featureFlags";
 
 export type FixViewProps = {
   children: ReactNode;
@@ -34,6 +35,7 @@ export type FixViewProps = {
   hideNavClose?: boolean;
   hideNextNavigationRightArrow?: boolean;
   showConfetti?: boolean;
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 export const FixView = (props: FixViewProps) => {
@@ -91,6 +93,7 @@ export const FixView = (props: FixViewProps) => {
             label={l10n.getString(
               "guided-resolution-flow-step-navigation-label",
             )}
+            enabledFeatureFlags={props.enabledFeatureFlags}
           />
         )}
         {!props.hideNavClose && navigationClose()}

diff --git a/...ashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemove.stories.tsx b/...ashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemove.stories.tsx
@@ -76,6 +76,7 @@ export const AutomaticRemoveViewStory: Story = {
             yearly: 13.37,
             monthly: 42.42,
           }}
+          enabledFeatureFlags={[]}
         />
       </Shell>
     );

diff --git a/...r/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemoveView.tsx b/...r/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemoveView.tsx
@@ -32,6 +32,7 @@ import {
   useRadioGroup,
 } from "react-aria";
 import { VisuallyHidden } from "../../../../../../../../../components/server/VisuallyHidden";
+import { FeatureFlagName } from "../../../../../../../../../../db/tables/featureFlags";
 
 export type Props = Omit<ComponentProps<typeof FixView>, "children"> & {
   monthlySubscriptionUrl: string;
@@ -40,6 +41,7 @@ export type Props = Omit<ComponentProps<typeof FixView>, "children"> & {
     yearly: number;
     monthly: number;
   };
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 const RadioContext = createContext<RadioGroupState | null>(null);

diff --git a/...henticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/page.tsx b/...henticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/page.tsx
@@ -22,6 +22,7 @@ import {
 } from "../../../../../../../../../functions/server/getPremiumSubscriptionInfo";
 import { getAttributionsFromCookiesOrDb } from "../../../../../../../../../functions/server/attributions";
 import { hasPremium } from "../../../../../../../../../functions/universal/user";
+import { getEnabledFeatureFlags } from "../../../../../../../../../../db/tables/featureFlags";
 
 const monthlySubscriptionUrl = getPremiumSubscriptionUrl({ type: "monthly" });
 const yearlySubscriptionUrl = getPremiumSubscriptionUrl({ type: "yearly" });
@@ -37,6 +38,10 @@ export default async function AutomaticRemovePage() {
     session.user.subscriber.id,
   );
 
+  const enabledFeatureFlags = await getEnabledFeatureFlags({
+    email: session.user.email,
+  });
+
   const countryCode = getCountryCode(headers());
   const profileId = await getOnerepProfileId(session.user.subscriber.id);
   const scanData = await getScanResultsWithBroker(
@@ -60,11 +65,12 @@ export default async function AutomaticRemovePage() {
     <AutomaticRemoveView
       data={data}
       subscriberEmails={subscriberEmails}
-      nextStep={getNextGuidedStep(data, "Scan")}
+      nextStep={getNextGuidedStep(data, enabledFeatureFlags, "Scan")}
       currentSection="data-broker-profiles"
       monthlySubscriptionUrl={`${monthlySubscriptionUrl}&${additionalSubplatParams.toString()}`}
       yearlySubscriptionUrl={`${yearlySubscriptionUrl}&${additionalSubplatParams.toString()}`}
       subscriptionBillingAmount={getSubscriptionBillingAmount()}
+      enabledFeatureFlags={enabledFeatureFlags}
     />
   );
 }
diff --git a/...ser/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/ManualRemove.stories.tsx b/...ser/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/ManualRemove.stories.tsx
@@ -66,6 +66,7 @@ export const ManualRemoveViewStory: Story = {
           subscriberEmails={[]}
           isPremiumUser={hasPremium(user)}
           isEligibleForPremium={true}
+          enabledFeatureFlags={[]}
         />
       </Shell>
     );

diff --git a/...d)/user/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/ManualRemoveView.tsx b/...d)/user/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/ManualRemoveView.tsx
@@ -26,6 +26,7 @@ import {
 import { FixView } from "../../FixView";
 import { TelemetryLink } from "../../../../../../../../../components/client/TelemetryLink";
 import { TelemetryButton } from "../../../../../../../../../components/client/TelemetryButton";
+import { FeatureFlagName } from "../../../../../../../../../../db/tables/featureFlags";
 
 export type Props = {
   scanData: LatestOnerepScanData;
@@ -35,6 +36,7 @@ export type Props = {
   user: Session["user"];
   countryCode: string;
   subscriberEmails: string[];
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 export function ManualRemoveView(props: Props) {
@@ -54,14 +56,19 @@ export function ManualRemoveView(props: Props) {
     user: props.user,
   };
 
-  const stepAfterSkip = getNextGuidedStep(data, "Scan");
+  const stepAfterSkip = getNextGuidedStep(
+    data,
+    props.enabledFeatureFlags,
+    "Scan",
+  );
 
   return (
     <FixView
       data={data}
       subscriberEmails={props.subscriberEmails}
       nextStep={stepAfterSkip}
       currentSection="data-broker-profiles"
+      enabledFeatureFlags={props.enabledFeatureFlags}
     >
       <div className={styles.main}>
         <div className={styles.content}>

diff --git a/...authenticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/page.tsx b/...authenticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/manual-remove/page.tsx
@@ -13,6 +13,7 @@ import { hasPremium } from "../../../../../../../../../functions/universal/user"
 import { getCountryCode } from "../../../../../../../../../functions/server/getCountryCode";
 import { getSubscriberEmails } from "../../../../../../../../../functions/server/getSubscriberEmails";
 import { isEligibleForPremium } from "../../../../../../../../../functions/universal/premium";
+import { getEnabledFeatureFlags } from "../../../../../../../../../../db/tables/featureFlags";
 
 export default async function ManualRemovePage() {
   const session = await getServerSession();
@@ -21,6 +22,10 @@ export default async function ManualRemovePage() {
     redirect("/user/dashboard");
   }
 
+  const enabledFeatureFlags = await getEnabledFeatureFlags({
+    email: session.user.email,
+  });
+
   const countryCode = getCountryCode(headers());
   const profileId = await getOnerepProfileId(session.user.subscriber.id);
   const scanData = await getScanResultsWithBroker(
@@ -42,6 +47,7 @@ export default async function ManualRemovePage() {
       user={session.user}
       countryCode={countryCode}
       subscriberEmails={subscriberEmails}
+      enabledFeatureFlags={enabledFeatureFlags}
     />
   );
 }
diff --git a/...ix/data-broker-profiles/removal-under-maintenance/RemovalUnderMaintenanceView.stories.tsx b/...ix/data-broker-profiles/removal-under-maintenance/RemovalUnderMaintenanceView.stories.tsx
@@ -64,6 +64,7 @@ export const RemovalUnderMaintenanceViewStory: Story = {
             user: mockedSession.user,
           }}
           subscriberEmails={[]}
+          enabledFeatureFlags={[]}
         />
       </Shell>
     );

diff --git a/...hboard/fix/data-broker-profiles/removal-under-maintenance/RemovalUnderMaintenanceView.tsx b/...hboard/fix/data-broker-profiles/removal-under-maintenance/RemovalUnderMaintenanceView.tsx
@@ -25,11 +25,13 @@ import confetti from "canvas-confetti";
 import { toast } from "react-toastify";
 import fetchWithDelay from "../../../../../../../../../../utils/fetchWithDelay";
 import { useRouter } from "next/navigation";
+import { FeatureFlagName } from "../../../../../../../../../../db/tables/featureFlags";
 
 export type Props = {
   data: LatestOnerepScanData;
   stepDeterminationData: StepDeterminationData;
   subscriberEmails: string[];
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 export const RemovalUnderMaintenanceView = (props: Props) => {
@@ -43,6 +45,7 @@ export const RemovalUnderMaintenanceView = (props: Props) => {
 
   const nextGuidedStep = getNextGuidedStep(
     props.stepDeterminationData,
+    props.enabledFeatureFlags,
     "DataBrokerManualRemoval",
   );
 
@@ -411,6 +414,7 @@ export const RemovalUnderMaintenanceView = (props: Props) => {
       hideProgressIndicator={detailedRemovalGuide}
       hideNavClose={detailedRemovalGuide}
       hideNextNavigationRightArrow={detailedRemovalGuide}
+      enabledFeatureFlags={props.enabledFeatureFlags}
     >
       {!detailedRemovalGuide ? dataBrokerInformation : removalGuideInstructions}
     </FixView>

diff --git a/...d)/user/(dashboard)/dashboard/fix/data-broker-profiles/removal-under-maintenance/page.tsx b/...d)/user/(dashboard)/dashboard/fix/data-broker-profiles/removal-under-maintenance/page.tsx
@@ -20,22 +20,20 @@ import { getSubscriberEmails } from "../../../../../../../../../functions/server
 import { RemovalUnderMaintenanceView } from "./RemovalUnderMaintenanceView";
 import { hasPremium } from "../../../../../../../../../functions/universal/user";
 import { getEnabledFeatureFlags } from "../../../../../../../../../../db/tables/featureFlags";
-import { AutoSignIn } from "../../../../../../../../../components/client/AutoSignIn";
 
 export default async function RemovalUnderMaintenance() {
   const session = await getServerSession();
   const countryCode = getCountryCode(headers());
 
-  if (!session) {
-    return <AutoSignIn />;
+  if (!session?.user?.subscriber?.id) {
+    return redirect("/");
   }
 
   const enabledFeatureFlags = await getEnabledFeatureFlags({
     email: session.user.email,
   });
 
   if (
-    !session?.user?.subscriber?.id ||
     !hasPremium(session.user) ||
     !enabledFeatureFlags.includes("EnableRemovalUnderMaintenanceStep")
   ) {
@@ -60,7 +58,11 @@ export default async function RemovalUnderMaintenance() {
     }),
   };
 
-  const getNextStep = getNextGuidedStep(data, "DataBrokerManualRemoval");
+  const getNextStep = getNextGuidedStep(
+    data,
+    enabledFeatureFlags,
+    "DataBrokerManualRemoval",
+  );
 
   if (
     scansWithRemovalUnderMaintenance?.results.length === 0 ||
@@ -76,6 +78,7 @@ export default async function RemovalUnderMaintenance() {
       stepDeterminationData={data}
       data={scansWithRemovalUnderMaintenance}
       subscriberEmails={subscriberEmails}
+      enabledFeatureFlags={enabledFeatureFlags}
     />
   );
 }
diff --git a/.../(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/StartFreeScan.stories.tsx b/.../(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/StartFreeScan.stories.tsx
@@ -65,6 +65,7 @@ export const StartFreeScanViewStory: Story = {
             user: mockedSession.user,
           }}
           subscriberEmails={[]}
+          enabledFeatureFlags={[]}
         />
       </Shell>
     );

diff --git a/...user/(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/StartFreeScanView.tsx b/...user/(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/StartFreeScanView.tsx
@@ -19,10 +19,12 @@ import {
 } from "../../../../../../../../../../constants";
 import { TelemetryButton } from "../../../../../../../../../components/client/TelemetryButton";
 import { TelemetryLink } from "../../../../../../../../../components/client/TelemetryLink";
+import { FeatureFlagName } from "../../../../../../../../../../db/tables/featureFlags";
 
 export type Props = {
   data: StepDeterminationData;
   subscriberEmails: string[];
+  enabledFeatureFlags: FeatureFlagName[];
 };
 
 export function StartFreeScanView(props: Props) {
@@ -32,8 +34,13 @@ export function StartFreeScanView(props: Props) {
     <FixView
       data={props.data}
       subscriberEmails={props.subscriberEmails}
-      nextStep={getNextGuidedStep(props.data, "Scan")}
+      nextStep={getNextGuidedStep(
+        props.data,
+        props.enabledFeatureFlags,
+        "Scan",
+      )}
       currentSection="data-broker-profiles"
+      enabledFeatureFlags={props.enabledFeatureFlags}
     >
       <div className={styles.contentWrapper}>
         <Image className={styles.cityScape} src={ImageCityScape} alt="" />
@@ -86,7 +93,10 @@ export function StartFreeScanView(props: Props) {
           </TelemetryButton>
           <TelemetryButton
             variant="secondary"
-            href={getNextGuidedStep(props.data, "Scan").href}
+            href={
+              getNextGuidedStep(props.data, props.enabledFeatureFlags, "Scan")
+                .href
+            }
             event={{
               module: "button",
               name: "click",

diff --git a/...thenticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/page.tsx b/...thenticated)/user/(dashboard)/dashboard/fix/data-broker-profiles/start-free-scan/page.tsx
@@ -13,6 +13,7 @@ import { getSubscriberBreaches } from "../../../../../../../../../functions/serv
 import { getSubscriberEmails } from "../../../../../../../../../functions/server/getSubscriberEmails";
 import { StartFreeScanView } from "./StartFreeScanView";
 import { hasPremium } from "../../../../../../../../../functions/universal/user";
+import { getEnabledFeatureFlags } from "../../../../../../../../../../db/tables/featureFlags";
 
 export default async function StartFreeScanPage() {
   const countryCode = getCountryCode(headers());
@@ -25,6 +26,10 @@ export default async function StartFreeScanPage() {
     return redirect("/");
   }
 
+  const enabledFeatureFlags = await getEnabledFeatureFlags({
+    email: session.user.email,
+  });
+
   const onerepProfileId = await getOnerepProfileId(session.user.subscriber.id);
 
   const latestScanData =
@@ -52,5 +57,11 @@ export default async function StartFreeScanPage() {
   };
   const subscriberEmails = await getSubscriberEmails(session.user);
 
-  return <StartFreeScanView data={data} subscriberEmails={subscriberEmails} />;
+  return (
+    <StartFreeScanView
+      data={data}
+      subscriberEmails={subscriberEmails}
+      enabledFeatureFlags={enabledFeatureFlags}
+    />
+  );
 }