diff --git a/src/components/SuccessNotificationModal.tsx b/src/components/SuccessNotificationModal.tsx index 8bd9ced..8249139 100644 --- a/src/components/SuccessNotificationModal.tsx +++ b/src/components/SuccessNotificationModal.tsx @@ -48,6 +48,16 @@ const RocketIcon = () => ( ); +const DevicesIcon = () => ( + + + +); + const CloseIcon = () => ( @@ -114,6 +124,7 @@ export default function SuccessNotificationModal() { data.type === 'subscription_activated' || data.type === 'subscription_renewed' || data.type === 'subscription_purchased'; + const isDevicesPurchased = data.type === 'devices_purchased'; // Format amount const formattedAmount = data.amountKopeks @@ -158,6 +169,10 @@ export default function SuccessNotificationModal() { title = t('successNotification.subscriptionPurchased.title', 'Subscription purchased!'); icon = ; gradientClass = 'from-accent-500 to-purple-600'; + } else if (data.type === 'devices_purchased') { + title = t('successNotification.devicesPurchased.title', 'Devices added!'); + icon = ; + gradientClass = 'from-blue-500 to-cyan-600'; } } @@ -211,7 +226,31 @@ export default function SuccessNotificationModal() { ? t('successNotification.amount', 'Amount') : t('successNotification.price', 'Price')} - +{formattedAmount} + + {isDevicesPurchased ? '' : '+'} + {formattedAmount} + + + )} + + {/* Devices info (for devices purchase) */} + {isDevicesPurchased && data.devicesAdded && ( +
+ + {t('successNotification.devicesAdded', 'Devices added')} + + +{data.devicesAdded} +
+ )} + + {isDevicesPurchased && data.newDeviceLimit && ( +
+ + {t('successNotification.totalDevices', 'Total devices')} + + {data.newDeviceLimit}
)} @@ -265,6 +304,16 @@ export default function SuccessNotificationModal() { )} + {isDevicesPurchased && ( + + )} +