feat/MSSDK-2097: add missing update subscription API call; add custom…

… survey-hidden cancellation reason
Cleeng · Feb 18, 2025 · 7584281 · 7584281
1 parent 368176c
commit 7584281
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 43 deletions.
diff --git a/src/components/UpdateSubscription/Unsubscribe.tsx b/src/components/UpdateSubscription/Unsubscribe.tsx
@@ -23,31 +23,29 @@ import {
 } from 'components/UpdateSubscription/components';
 import { Props } from './Unsubscribe.types';
 import STEPS from './Unsubscribe.enum';
+import { EXIT_SURVEY_HIDDEN_CANCELLATION_REASON } from './utils';
+
+const INITIAL_STEPS_ARRAY = [STEPS.SURVEY, STEPS.CONFIRMATION];
 
 const Unsubscribe = ({
   customCancellationReasons,
   skipAvailableDowngradesStep,
   skipCancellationSurveyStep,
   skipAvailableFreeExtensionStep
 }: Props) => {
-  const INITIAL_STEPS_ARRAY = [STEPS.SURVEY, STEPS.CONFIRMATION];
-
   const [downgradesList, setDowngradesList] = useState<Array<SwitchSetting>>(
     []
   );
   const [checkedReason, setCheckedReason] = useState('');
   const [isFreeExtensionSecondStep, setIsFreeExtensionSecondStep] =
     useState(false);
-
   const [steps, setSteps] = useState<STEPS[]>([]);
   const { pauseOffersIDs } = useAppSelector(selectOffers);
   const { data: switchSettings } = useAppSelector(selectSwitchSettings);
   const { data: switchDetails } = useAppSelector(selectSwitchDetails);
   const offerDetails = useAppSelector(selectOfferData);
   const { error: isError } = useAppSelector(selectUnsubscribe);
-
   const { retentionActions } = useAppSelector(selectRetentionActions);
-
   const { t } = useTranslation();
   const dispatch = useAppDispatch();
 
@@ -121,28 +119,62 @@ const Unsubscribe = ({
     pauseOffersIDs.includes(toOfferId)
   );
 
+  const handleUnsubscribe = async () => {
+    const cancellationReason = skipCancellationSurveyStep
+      ? t(
+          EXIT_SURVEY_HIDDEN_CANCELLATION_REASON.key,
+          EXIT_SURVEY_HIDDEN_CANCELLATION_REASON.value
+        )
+      : checkedReason;
+
+    eventDispatcher(UNSUBSCRIBE_ACTION_CONFIRMED, {
+      detail: {
+        offerId: offerDetails?.offerId,
+        cancellationReason
+      }
+    });
+
+    await dispatch(
+      fetchUnsubscribe({
+        offerId: offerDetails?.offerId,
+        checkedReason: cancellationReason,
+        isPauseActive
+      })
+    );
+
+    setCurrentStep(STEPS.CONFIRMATION);
+  };
+
   useEffect(() => {
-    const tempArray = INITIAL_STEPS_ARRAY.slice();
+    const initializeSteps = async () => {
+      const tempArray = INITIAL_STEPS_ARRAY.slice();
 
-    if (skipCancellationSurveyStep) {
-      tempArray.shift();
-    }
+      if (skipCancellationSurveyStep) {
+        tempArray.shift();
+        await handleUnsubscribe();
+      }
 
-    if (shouldShowDowngrades && !tempArray.includes(STEPS.DOWNGRADES)) {
-      tempArray.unshift(STEPS.DOWNGRADES);
-    }
-    if (shouldShowPause && !tempArray.includes(STEPS.PAUSE)) {
-      tempArray.unshift(STEPS.PAUSE);
-    }
+      if (shouldShowDowngrades && !tempArray.includes(STEPS.DOWNGRADES)) {
+        tempArray.unshift(STEPS.DOWNGRADES);
+      }
+      if (shouldShowPause && !tempArray.includes(STEPS.PAUSE)) {
+        tempArray.unshift(STEPS.PAUSE);
+      }
 
-    if (shouldShowFreeExtension && !tempArray.includes(STEPS.FREE_EXTENSION)) {
-      tempArray.unshift(STEPS.FREE_EXTENSION);
-    }
+      if (
+        shouldShowFreeExtension &&
+        !tempArray.includes(STEPS.FREE_EXTENSION)
+      ) {
+        tempArray.unshift(STEPS.FREE_EXTENSION);
+      }
 
-    if (tempArray.length !== steps.length) {
-      setSteps(tempArray);
-    }
-    if (!downgradesList.length) setDowngradesList(() => getDowngrades());
+      if (tempArray.length !== steps.length) {
+        setSteps(tempArray);
+      }
+      if (!downgradesList.length) setDowngradesList(() => getDowngrades());
+    };
+
+    initializeSteps();
   }, []);
 
   useEffect(() => {
@@ -163,24 +195,6 @@ const Unsubscribe = ({
   const goToNextStep = () =>
     setCurrentStep(steps[steps.indexOf(currentStep) + 1]);
 
-  const handleUnsubscribe = async () => {
-    eventDispatcher(UNSUBSCRIBE_ACTION_CONFIRMED, {
-      detail: {
-        offerId: offerDetails?.offerId,
-        cancellationReason: checkedReason
-      }
-    });
-    await dispatch(
-      fetchUnsubscribe({
-        offerId: offerDetails?.offerId,
-        checkedReason,
-        isPauseActive
-      })
-    );
-
-    setCurrentStep(STEPS.CONFIRMATION);
-  };
-
   return (
     <InnerPopupWrapper
       steps={isFreeExtensionSecondStep ? 2 : steps.length}

diff --git a/src/components/UpdateSubscription/utils/defaultCancellationReasons.ts b/src/components/UpdateSubscription/utils/defaultCancellationReasons.ts
@@ -1,4 +1,4 @@
-const defaultCancellationReasons = [
+export const defaultCancellationReasons = [
   {
     value: 'Poor customer support',
     key: 'unsubscribe-popup.cancellation.poor-customer-support'
@@ -29,5 +29,7 @@ const defaultCancellationReasons = [
   }
 ];
 
-// eslint-disable-next-line import/prefer-default-export
-export { defaultCancellationReasons };
+export const EXIT_SURVEY_HIDDEN_CANCELLATION_REASON = {
+  key: 'unsubscribe-popup.cancellation.exit-survey-hidden',
+  value: 'Exit survey hidden cancellation reason'
+};
diff --git a/src/translations/en/translations.json b/src/translations/en/translations.json
@@ -606,6 +606,7 @@
   "unsubscribe-popup.cancellation.service-switch": "Switch to a different service",
   "unsubscribe-popup.cancellation.streaming-issues": "Video streaming issues",
   "unsubscribe-popup.cancellation.too-expensive": "Subscription is too expensive",
+  "unsubscribe-popup.cancellation.exit-survey-hidden": "Exit survey hidden cancellation reason",
   "unsubscribe-popup.downgrade-instead": "How about a plan downgrade instead of cancellation?",
   "unsubscribe-popup.next-season-start": "the next season start",
   "unsubscribe-popup.pause-button-text": "Pause my subscription",