From a804e5e143255aa64dd3661476b5c46446d90a12 Mon Sep 17 00:00:00 2001
From: Maks <41080668+Maks19@users.noreply.github.com>
Date: Mon, 30 Sep 2024 22:58:15 +0300
Subject: [PATCH] [SALAD-21966] WebApp - Add paypal notification (#1208)

---
 .../models/NotificationMessage.tsx            |  4 ++
 .../src/modules/profile/ProfileStore.tsx      | 31 ++++++++++++
 .../web-app/src/modules/profile/constants.tsx | 49 +++++++++++++++++++
 3 files changed, 84 insertions(+)

diff --git a/packages/web-app/src/modules/notifications/models/NotificationMessage.tsx b/packages/web-app/src/modules/notifications/models/NotificationMessage.tsx
index ee25c5847..1bcd9fb18 100644
--- a/packages/web-app/src/modules/notifications/models/NotificationMessage.tsx
+++ b/packages/web-app/src/modules/notifications/models/NotificationMessage.tsx
@@ -14,6 +14,10 @@ export enum NotificationMessageCategory {
   ReferralCodeInvalid = 'Referral Code Invalid',
   ReferralCodeDoesNotExist = 'Referral Code Does Not Exist',
   ReferralCodeError = 'Referral Code Error',
+  PayPalSuccess = 'PayPalSuccess',
+  PayPalRetry = 'PayPalRetry',
+  PayPalFailure = 'PayPalFailure',
+  PayPalAccountInUse = 'PayPalAccountInUse',
 }
 
 export interface NotificationMessage {
diff --git a/packages/web-app/src/modules/profile/ProfileStore.tsx b/packages/web-app/src/modules/profile/ProfileStore.tsx
index 8f3d3577e..499de4c1f 100644
--- a/packages/web-app/src/modules/profile/ProfileStore.tsx
+++ b/packages/web-app/src/modules/profile/ProfileStore.tsx
@@ -10,6 +10,10 @@ import {
   avatarsEndpointPath,
   avatarsSelectedEndpointPath,
   novuSignaturesEndpointPath,
+  paypalAccountInUseNotification,
+  paypalFailureNotification,
+  paypalRetryNotification,
+  paypalSuccessNotification,
   paypalUsersEndpointPath,
   profileEndpointPath,
   protectRewardsRedemptionEndpointPath,
@@ -287,11 +291,37 @@ export class ProfileStore {
     this.isMinecraftUserNameSubmitSuccess = false
   }
 
+  @action
+  private showPaypalNotification = () => {
+    const urlSearchParams = new URLSearchParams(window.location.search)
+    const paypalActionStatus = urlSearchParams.get('paypalAction')
+
+    if (paypalActionStatus) {
+      this.store.routing.replace('/account/summary')
+
+      switch (paypalActionStatus) {
+        case 'success':
+          this.store.notifications.sendNotification(paypalSuccessNotification)
+          break
+        case 'retry':
+          this.store.notifications.sendNotification(paypalRetryNotification)
+          break
+        case 'failure':
+          this.store.notifications.sendNotification(paypalFailureNotification)
+          break
+        case 'account_in_use':
+          this.store.notifications.sendNotification(paypalAccountInUseNotification)
+          break
+      }
+    }
+  }
+
   @action.bound
   loadPayPalId = flow(function* (this: ProfileStore) {
     try {
       const res: AxiosResponse<payPalResponse> = yield this.axios.get(paypalUsersEndpointPath) as payPalResponse
       this.payPalId = res?.data?.email
+      this.showPaypalNotification()
     } catch (err) {
       console.log(err)
     }
@@ -314,6 +344,7 @@ export class ProfileStore {
           payPalLoadRetries++
           this.timeoutId = setTimeout(loadPayPalIdWithRetry, 5000)
         } else {
+          this.store.notifications.sendNotification(paypalSuccessNotification)
           clearTimeout(this.timeoutId)
           return
         }
diff --git a/packages/web-app/src/modules/profile/constants.tsx b/packages/web-app/src/modules/profile/constants.tsx
index d155a795a..0fe3425e5 100644
--- a/packages/web-app/src/modules/profile/constants.tsx
+++ b/packages/web-app/src/modules/profile/constants.tsx
@@ -1,3 +1,6 @@
+import type { NotificationMessage } from '../notifications/models'
+import { NotificationMessageCategory } from '../notifications/models'
+
 export const novuSignaturesEndpointPath = '/api/v2/novu-signatures'
 export const avatarsEndpointPath = '/api/v2/avatars'
 export const avatarsSelectedEndpointPath = '/api/v2/avatars/selected'
@@ -5,3 +8,49 @@ export const profileEndpointPath = '/api/v1/profile'
 export const paypalUsersEndpointPath = '/api/v2/paypal/users'
 export const authenticationExternalEndpointPath = '/api/v2/authentication/external'
 export const protectRewardsRedemptionEndpointPath = '/api/v1/profile/redemptions/tfa'
+
+export const paypalSuccessNotification: NotificationMessage = {
+  category: NotificationMessageCategory.PayPalSuccess,
+  title: 'Congratulations!',
+  message: 'You have successfully linked your PayPal account to Salad.',
+}
+
+export const paypalRetryNotification: NotificationMessage = {
+  category: NotificationMessageCategory.PayPalRetry,
+  title: `Oops! Let's fix that`,
+  message:
+    'You managed to log in to PayPal, but your browser appears to have prevented us from linking your account to Salad. Check out our support guide for help with this issue.',
+  type: 'error',
+  onClick: () =>
+    window.open(
+      'https://support.salad.com/article/226-i-cant-connect-my-paypal-account?_gl=1*30ymmm*_gcl_au*MjAzODc4MDA4MS4xNzI1NTUwOTE2',
+      '_blank',
+      'noopener, noreferrer',
+    ),
+}
+
+export const paypalFailureNotification: NotificationMessage = {
+  category: NotificationMessageCategory.PayPalFailure,
+  title: `Let's try that again`,
+  message: `We weren't able to connect your PayPal account to Salad. Feel free to try again whenever you like. If the problem persists, please contact Salad Support.`,
+  type: 'error',
+  onClick: () =>
+    window.open(
+      'https://support.salad.com/?_gl=1*mtbbt7*_gcl_au*MjAzODc4MDA4MS4xNzI1NTUwOTE2',
+      '_blank',
+      'noopener, noreferrer',
+    ),
+}
+
+export const paypalAccountInUseNotification: NotificationMessage = {
+  category: NotificationMessageCategory.PayPalAccountInUse,
+  title: `Let's try that again`,
+  message: 'This PayPal account cannot be linked to this Salad account. Learn More.',
+  type: 'error',
+  onClick: () =>
+    window.open(
+      'https://support.salad.com/article/228-faq-on-paypal-rewards?_gl=1*8ttjos*_gcl_au*MjAzODc4MDA4MS4xNzI1NTUwOTE2',
+      '_blank',
+      'noopener, noreferrer',
+    ),
+}