From 622025082e93a5a6fb64ace6143be49a34117cb8 Mon Sep 17 00:00:00 2001
From: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:54:12 +0100
Subject: [PATCH] feat: update demo plans modal

---
 .../DemoDialogPlans/DemoDialogPlans.tsx       | 100 ++++++++++++------
 frontend/src/interfaces/uiConfig.ts           |   1 +
 2 files changed, 70 insertions(+), 31 deletions(-)

diff --git a/frontend/src/component/demo/DemoDialog/DemoDialogPlans/DemoDialogPlans.tsx b/frontend/src/component/demo/DemoDialog/DemoDialogPlans/DemoDialogPlans.tsx
index 4fdc63e61f..fe041ae16a 100644
--- a/frontend/src/component/demo/DemoDialog/DemoDialogPlans/DemoDialogPlans.tsx
+++ b/frontend/src/component/demo/DemoDialog/DemoDialogPlans/DemoDialogPlans.tsx
@@ -3,6 +3,7 @@ import { DemoDialog } from '../DemoDialog';
 import GitHub from '@mui/icons-material/GitHub';
 import Launch from '@mui/icons-material/Launch';
 import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
+import { useUiFlag } from 'hooks/useUiFlag';
 
 const StyledDemoDialog = styled(DemoDialog)(({ theme }) => ({
     '& .MuiDialog-paper': {
@@ -82,6 +83,7 @@ interface IDemoDialogPlansProps {
 
 export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
     const { trackEvent } = usePlausibleTracker();
+    const isEnterprisePaygEnabled = useUiFlag('enterprise-payg');
 
     return (
         <StyledDemoDialog open={open} onClose={onClose}>
@@ -117,39 +119,75 @@ export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
                         View project on GitHub
                     </Button>
                 </StyledPlan>
-                <StyledPlan>
-                    <Typography variant='h5' fontWeight='bold'>
-                        Pro
-                    </Typography>
-                    <Typography variant='body2' color='textSecondary'>
-                        Free your team to collaborate. We'll do the heavy
-                        lifting.
-                    </Typography>
-                    <div>
-                        <Typography variant='h6' fontWeight='normal'>
-                            $80/month
+                {isEnterprisePaygEnabled ? (
+                    <StyledPlan>
+                        <Typography variant='h5' fontWeight='bold'>
+                            Enterprise Starter
                         </Typography>
-                        <Typography variant='body2'>
-                            includes 5 seats
+                        <Typography variant='body2' color='textSecondary'>
+                            Free your team to collaborate. We'll do the heavy
+                            lifting.
                         </Typography>
-                    </div>
-                    <Button
-                        variant='contained'
-                        color='primary'
-                        href='https://www.getunleash.io/plans/pro'
-                        target='_blank'
-                        rel='noreferrer'
-                        onClick={() => {
-                            trackEvent('demo-see-plan', {
-                                props: {
-                                    plan: 'pro',
-                                },
-                            });
-                        }}
-                    >
-                        Start 14-day free trial
-                    </Button>
-                </StyledPlan>
+                        <div>
+                            <Typography variant='h6' fontWeight='normal'>
+                                $375/month
+                            </Typography>
+                            <Typography variant='body2'>
+                                includes 5 seats
+                            </Typography>
+                        </div>
+                        <Button
+                            variant='contained'
+                            color='primary'
+                            href='https://www.getunleash.io/plans/enterprise-payg'
+                            target='_blank'
+                            rel='noreferrer'
+                            onClick={() => {
+                                trackEvent('demo-see-plan', {
+                                    props: {
+                                        plan: 'enterprise-starter',
+                                    },
+                                });
+                            }}
+                        >
+                            Start 14-day free trial
+                        </Button>
+                    </StyledPlan>
+                ) : (
+                    <StyledPlan>
+                        <Typography variant='h5' fontWeight='bold'>
+                            Pro
+                        </Typography>
+                        <Typography variant='body2' color='textSecondary'>
+                            Free your team to collaborate. We'll do the heavy
+                            lifting.
+                        </Typography>
+                        <div>
+                            <Typography variant='h6' fontWeight='normal'>
+                                $80/month
+                            </Typography>
+                            <Typography variant='body2'>
+                                includes 5 seats
+                            </Typography>
+                        </div>
+                        <Button
+                            variant='contained'
+                            color='primary'
+                            href='https://www.getunleash.io/plans/pro'
+                            target='_blank'
+                            rel='noreferrer'
+                            onClick={() => {
+                                trackEvent('demo-see-plan', {
+                                    props: {
+                                        plan: 'pro',
+                                    },
+                                });
+                            }}
+                        >
+                            Start 14-day free trial
+                        </Button>
+                    </StyledPlan>
+                )}
                 <StyledPlan>
                     <Typography variant='h5' fontWeight='bold'>
                         Enterprise
diff --git a/frontend/src/interfaces/uiConfig.ts b/frontend/src/interfaces/uiConfig.ts
index 71479206df..ddb96aca17 100644
--- a/frontend/src/interfaces/uiConfig.ts
+++ b/frontend/src/interfaces/uiConfig.ts
@@ -91,6 +91,7 @@ export type UiFlags = {
     purchaseAdditionalEnvironments?: boolean;
     unleashAI?: boolean;
     releasePlans?: boolean;
+    'enterprise-payg'?: boolean;
 };
 
 export interface IVersionInfo {