fix: migrate to free plan

corlard3y · corlard3y · commit 2f1aec382186 · 2025-02-17T13:18:34.000+01:00
diff --git a/src/components/userPlanAndBillings/UpgradePlanNavigationItem.tsx b/src/components/userPlanAndBillings/UpgradePlanNavigationItem.tsx
@@ -23,11 +23,11 @@ export const UpgradePlanNavigationItem = () => {
     channelId: walletAddress,
   });
 
-  useMigrateToFreePlan({
-    pricingPlanStatus,
-    isLoading: isPricingPlanStatusLoading,
-    refetch: refetchPricingPlanStatus,
-  });
+  // useMigrateToFreePlan({
+  //   pricingPlanStatus,
+  //   isLoading: isPricingPlanStatusLoading,
+  //   refetch: refetchPricingPlanStatus,
+  // });
 
   const selectedPlan = pricingInfoList?.find(
     (planItem: { id: number }) =>
@@ -51,8 +51,6 @@ export const UpgradePlanNavigationItem = () => {
     navigate('/pricing');
   };
 
-  console.log(pricingPlanStatus, 'plan status');
-
   return (
     <Skeleton isLoading={isPricingPlanStatusLoading}>
       <Box
@@ -77,7 +75,7 @@ export const UpgradePlanNavigationItem = () => {
             color="text-primary"
             variant="h6-bold"
           >
-            {(pricingPlanStatus && `Push ${selectedPlan?.name}`) || 'Free Plan'}
+            {(pricingPlanStatus && !isUserOnFreePlan && `Push ${selectedPlan?.name}`) || 'Free Plan'}
           </Text>
           {pricingPlanStatus?.pricing_plan_id !== '3' && (
             <Button
diff --git a/src/components/userPlanAndBillings/UserPlanAndBillings.tsx b/src/components/userPlanAndBillings/UserPlanAndBillings.tsx
@@ -49,6 +49,27 @@ const UserPlanAndBillings = () => {
     navigate('/pricing');
   };
 
+  const pricingListDescriptions = [
+    {
+      id: 1,
+      description: 'For casual degens',
+    },
+    {
+      id: 2,
+      description: 'For individuals',
+    },
+    {
+      id: 3,
+      description: 'For growing apps',
+    },
+    {
+      id: 4,
+      description: 'For advanced solutions',
+    },
+  ];
+
+  // console.log(selectedPlan, 'check check');
+
   return (
     <Box width="100%">
       <Text
@@ -58,123 +79,73 @@ const UserPlanAndBillings = () => {
         Take full control of your Push Notification plan, manage and stay up to date with your plan usage
       </Text>
 
-      {pricingPlanStatus?.pricing_plan_id ? (
+      <Box
+        backgroundColor="surface-secondary"
+        margin="spacing-lg spacing-none spacing-none spacing-none"
+        padding="spacing-md"
+        borderRadius="radius-md"
+      >
         <Box
-          backgroundColor="surface-secondary"
-          margin="spacing-lg spacing-none spacing-none spacing-none"
-          padding="spacing-md"
-          borderRadius="radius-md"
+          display="flex"
+          width="100%"
+          flexDirection="row"
+          justifyContent="space-between"
         >
-          <Box
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
+          <Text
+            variant="h2-semibold"
+            color="text-primary"
           >
-            <Text
-              variant="h2-semibold"
-              color="text-primary"
-            >
-              {selectedPlan?.name} Plan
-            </Text>
+            {(pricingPlanStatus && !isUserOnFreePlan && `Push ${selectedPlan?.name}`) || 'Free Plan'}
+          </Text>
+          {!isUserOnFreePlan && (
             <Text
               variant="h2-semibold"
               color="text-primary"
             >
               ${selectedPlan?.value}/mo
             </Text>
-          </Box>
+          )}
+        </Box>
 
-          <Box
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
+        <Box
+          display="flex"
+          width="100%"
+          flexDirection="row"
+          justifyContent="space-between"
+        >
+          <Text
+            variant="bm-regular"
+            color="text-tertiary"
           >
-            <Text
-              variant="bm-regular"
-              color="text-tertiary"
-            >
-              For individuals
-            </Text>
+            {pricingListDescriptions?.find((desc) => desc.id === selectedPlan?.id)?.description}
+          </Text>
+          {!isUserOnFreePlan && (
             <Text
               variant="bm-regular"
               color="text-tertiary"
             >
               billed yearly
             </Text>
-          </Box>
-
-          <Box
-            margin="spacing-lg spacing-none spacing-none spacing-none"
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
-            alignItems="center"
-          >
-            <Button
-              variant="tertiary"
-              size="small"
-              onClick={navigateToPricing}
-            >
-              Upgrade Plan
-            </Button>
-          </Box>
+          )}
         </Box>
-      ) : (
+
         <Box
-          backgroundColor="surface-secondary"
           margin="spacing-lg spacing-none spacing-none spacing-none"
-          padding="spacing-md"
-          borderRadius="radius-md"
+          display="flex"
+          width="100%"
+          flexDirection="row"
+          justifyContent="space-between"
+          alignItems="center"
         >
-          <Box
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
-          >
-            <Text
-              variant="h2-semibold"
-              color="text-primary"
-            >
-              Free Plan
-            </Text>
-          </Box>
-
-          <Box
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
-          >
-            <Text
-              variant="bm-regular"
-              color="text-tertiary"
-            >
-              For individuals
-            </Text>
-          </Box>
-
-          <Box
-            margin="spacing-lg spacing-none spacing-none spacing-none"
-            display="flex"
-            width="100%"
-            flexDirection="row"
-            justifyContent="space-between"
-            alignItems="center"
+          <Button
+            variant={!isUserOnFreePlan ? 'tertiary' : 'primary'}
+            size="small"
+            onClick={navigateToPricing}
           >
-            <Button
-              variant="primary"
-              size="small"
-              onClick={navigateToPricing}
-            >
-              Upgrade Plan
-            </Button>
-          </Box>
+            Upgrade Plan
+          </Button>
         </Box>
-      )}
+      </Box>
 
       <Box margin="spacing-xl spacing-none spacing-none spacing-none">
         <Text
diff --git a/src/components/userPlanAndBillings/hooks/useMigrateToFreePlan.tsx b/src/components/userPlanAndBillings/hooks/useMigrateToFreePlan.tsx
@@ -16,6 +16,7 @@ export const useMigrateToFreePlan = ({ pricingPlanStatus, isLoading, refetch }:
   const { mutate: handleInitatePayment } = useInitiatePaymentInfo();
 
   const handleMigrateToFreePlan = () => {
+    console.log('handlemigrate');
     handleInitatePayment(
       {
         channel: walletAddress,
diff --git a/src/components/userSettings/UserSettings.tsx b/src/components/userSettings/UserSettings.tsx
@@ -22,9 +22,9 @@ import PushSnapSettings from 'components/PushSnap/PushSnapSettings';
 import UserPlanAndBillings from 'components/userPlanAndBillings/UserPlanAndBillings';
 import UserProfileSocialSettings from 'components/UserProfileSettings/UserProfileSocialSettings';
 import { convertAddressToAddrCaip } from 'helpers/CaipHelper';
-import { useGetPricingPlanStatus } from 'queries';
+import { useGetPricingInfo, useGetPricingPlanStatus } from 'queries';
 import { calculateExpirationDetails } from './utils';
-
+import { toNumber } from 'lodash';
 
 interface ChannelListItem {
   channel: string;
@@ -56,10 +56,18 @@ function UserSettings() {
 
   const dispatch = useDispatch();
 
+  const { data: pricingInfoList } = useGetPricingInfo();
   const { data: pricingPlanStatus } = useGetPricingPlanStatus({
     channelId: walletAddress,
   });
 
+  const selectedPlan = pricingInfoList?.find(
+    (planItem: { id: number }) =>
+      planItem?.id == toNumber(pricingPlanStatus?.pricing_plan_id ? pricingPlanStatus?.pricing_plan_id : '1'),
+  );
+
+  const isUserOnFreePlan = selectedPlan?.id == 1;
+
   const expirationDetails = calculateExpirationDetails(pricingPlanStatus ?? null);
 
   const navigateToPricing = () => {
@@ -123,7 +131,6 @@ function UserSettings() {
       label: 'My Profile',
       title: 'Your Profile',
       section: 'top',
-
     },
     {
       value: 1,
@@ -210,7 +217,7 @@ function UserSettings() {
             </>
           )}
 
-          {selectedOption === 3 && pricingPlanStatus == null && (
+          {selectedOption === 3 && isUserOnFreePlan && (
             <Alert
               showIcon={false}
               heading="Go Pro for $11.99/mo and unlock access to more features"
@@ -220,7 +227,7 @@ function UserSettings() {
             />
           )}
 
-          {selectedOption === 3 && pricingPlanStatus != null && !expirationDetails?.isExpired && (
+          {selectedOption === 3 && !isUserOnFreePlan && !expirationDetails?.isExpired && (
             <Alert
               showIcon={true}
               heading={`Your Pro plan is active until ${expirationDetails?.expirationDate}`}
@@ -234,7 +241,6 @@ function UserSettings() {
                 <SectionTitle bottomSpacing={selectedOption == 2 ? false : true}>
                   {selectOptions[selectedOption]?.title}
                 </SectionTitle>
-
               )}
 
               {selectedOption === 0 && (
@@ -248,7 +254,6 @@ function UserSettings() {
               {selectedOption === 1 && <ChannelListSettings />}
               {selectedOption === 2 && <PushSnapSettings />}
               {selectedOption === 3 && <UserPlanAndBillings />}
-
             </ChannelContainer>
           </ChannelWrapper>
 
diff --git a/src/modules/channelDashboard/ChannelDashboard.tsx b/src/modules/channelDashboard/ChannelDashboard.tsx
@@ -40,37 +40,10 @@ const ChannelDashboard = () => {
     (planItem: { id: number }) =>
       planItem?.id == parseInt(pricingPlanStatus?.pricing_plan_id ? pricingPlanStatus?.pricing_plan_id : '1'),
   );
+
+  const isUserOnFreePlan = selectedPlan?.id == 1;
+
   const { data: paymentDetails } = useGetPaymentDetails({ paymentId: paymentId! });
-  // const pricingPlanStatus = {
-  //   id: 1,
-  //   channel: 'eip155:11155111:0xD8634C39BBFd4033c0d3289C4515275102423681',
-  //   email_quota_used: 0,
-  //   telegram_quota_used: 0,
-  //   discord_quota_used: 0,
-  //   pricing_plan_id: '2',
-  //   email_total_quota: 2000,
-  //   telegram_total_quota: 2000,
-  //   discord_total_quota: 0,
-  //   expirationTimestamp: 1767961517282,
-  // expirationTimestamp: 1715515200000,
-  // expirationTimestamp: 1739152965000,
-  // };
-
-  // const paymentDetails = {
-  //   id: 6,
-  //   channel: 'eip155:11155111:0xd8634c39bbfd4033c0d3289c4515275102423681',
-  //   payment_id: '3idbuzrWTW8w13XwJDQK72',
-  //   pricing_plan_id: '2',
-  //   amount: 1,
-  //   currency: 'USDC',
-  //   created_at: 1736856636,
-  //   payment_network: '11155111',
-  //   payment_status: 'SUCCESS',
-  //   transaction_hash: '0xe1134ad134ccb9247ee9dd4c1b47fad4d9e814bc848fd8a25829d8e17a97a978',
-  //   expires_at: 1736863836,
-  //   message: '',
-  //   durationInMonths: 12,
-  // };
 
   const { channelDetails, loadingChannelDetails, refetchChannelDetails } = useFetchChannelDetails();
   useGetChannelCategories();
@@ -106,7 +79,7 @@ const ChannelDashboard = () => {
         )}
 
         {/* Expiry notice alert after plan has expired */}
-        {pricingPlanStatus && expiryDetails?.isExpired && (
+        {pricingPlanStatus && !isUserOnFreePlan && expiryDetails?.isExpired && (
           <PurchasePlanAlert
             variant="expired"
             purchasedPlan={{ planName: selectedPlan?.name! }}
@@ -117,7 +90,7 @@ const ChannelDashboard = () => {
         )}
 
         {/* Expiry notice alert when expiry is less than 7 days */}
-        {pricingPlanStatus && parseInt(expiryDetails?.timeRemaining!) < 7 && (
+        {pricingPlanStatus && !isUserOnFreePlan && parseInt(expiryDetails?.timeRemaining!) < 7 && (
           <PurchasePlanAlert
             variant="renewalReminder"
             purchasedPlan={{ planName: selectedPlan?.name!, daysRemaining: parseInt(expiryDetails?.timeRemaining!) }}
@@ -128,7 +101,7 @@ const ChannelDashboard = () => {
         )}
 
         {/* Alert when user is on free plan, and notification limit is already reached */}
-        {pricingPlanStatus?.pricing_plan_id == '1' && totalQuota - totalQuotaUsed < 100 && (
+        {isUserOnFreePlan && totalQuota - totalQuotaUsed < 100 && (
           <PurchasePlanAlert
             variant="notificationLimit"
             onAction={() => {
diff --git a/src/modules/createChannel/CreateChannel.tsx b/src/modules/createChannel/CreateChannel.tsx
diff --git a/src/modules/purchasePlan/components/PlanPurchasedModal.tsx b/src/modules/purchasePlan/components/PlanPurchasedModal.tsx

Original file line number	Diff line number	Diff line change
`@@ -16,6 +16,7 @@ export const useMigrateToFreePlan = ({ pricingPlanStatus, isLoading, refetch }:`
`16`	`16`	`const { mutate: handleInitatePayment } = useInitiatePaymentInfo();`
`17`	`17`
`18`	`18`	`const handleMigrateToFreePlan = () => {`
	`19`	`+ console.log('handlemigrate');`
`19`	`20`	`handleInitatePayment(`
`20`	`21`	`{`
`21`	`22`	`channel: walletAddress,`