From f57827c5303287fefa46a313cd7617c27b37b79b Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <contact@baptiste-arnaud.fr>
Date: Sun, 13 Feb 2022 07:09:22 +0100
Subject: [PATCH] =?UTF-8?q?feat(results):=20=F0=9F=9B=82=20Limit=20typebot?=
 =?UTF-8?q?=20branding?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/account/SubscriptionTag.tsx    |  2 +-
 .../settings/GeneralSettingsForm.tsx          | 29 ++++++++++++++++---
 .../builder/playwright/tests/settings.spec.ts | 20 +++++++++++++
 3 files changed, 46 insertions(+), 5 deletions(-)

diff --git a/apps/builder/components/account/SubscriptionTag.tsx b/apps/builder/components/account/SubscriptionTag.tsx
index fcd72a1ec..012dc6289 100644
--- a/apps/builder/components/account/SubscriptionTag.tsx
+++ b/apps/builder/components/account/SubscriptionTag.tsx
@@ -13,7 +13,7 @@ export const SubscriptionTag = ({ plan }: { plan?: Plan }) => {
       return <Tag>Offered</Tag>
     }
     case Plan.PRO: {
-      return <Tag colorScheme="blue">Pro plan</Tag>
+      return <Tag colorScheme="orange">Pro plan</Tag>
     }
     default: {
       return <Tag>Free plan</Tag>
diff --git a/apps/builder/components/settings/GeneralSettingsForm.tsx b/apps/builder/components/settings/GeneralSettingsForm.tsx
index 2bea5cc4c..8e2587ddb 100644
--- a/apps/builder/components/settings/GeneralSettingsForm.tsx
+++ b/apps/builder/components/settings/GeneralSettingsForm.tsx
@@ -1,6 +1,16 @@
-import { Flex, FormLabel, Stack, Switch } from '@chakra-ui/react'
+import {
+  Flex,
+  FormLabel,
+  Stack,
+  Switch,
+  Tag,
+  useDisclosure,
+} from '@chakra-ui/react'
+import { UpgradeModal } from 'components/shared/modals/UpgradeModal.'
+import { useUser } from 'contexts/UserContext'
 import { GeneralSettings } from 'models'
 import React from 'react'
+import { isFreePlan } from 'services/user'
 
 type Props = {
   generalSettings: GeneralSettings
@@ -11,16 +21,27 @@ export const GeneralSettingsForm = ({
   generalSettings,
   onGeneralSettingsChange,
 }: Props) => {
-  const handleSwitchChange = () =>
+  const { isOpen, onOpen, onClose } = useDisclosure()
+  const { user } = useUser()
+  const isUserFreePlan = isFreePlan(user)
+  const handleSwitchChange = () => {
+    if (generalSettings?.isBrandingEnabled && isUserFreePlan) return
     onGeneralSettingsChange({
       isBrandingEnabled: !generalSettings?.isBrandingEnabled,
     })
+  }
 
   return (
     <Stack spacing={6}>
-      <Flex justifyContent="space-between" align="center">
+      <UpgradeModal isOpen={isOpen} onClose={onClose} />
+      <Flex
+        justifyContent="space-between"
+        align="center"
+        onClick={isUserFreePlan ? onOpen : undefined}
+      >
         <FormLabel htmlFor="branding" mb="0">
-          Typebot.io branding
+          Typebot.io branding{' '}
+          {isUserFreePlan && <Tag colorScheme="orange">Pro</Tag>}
         </FormLabel>
         <Switch
           id="branding"
diff --git a/apps/builder/playwright/tests/settings.spec.ts b/apps/builder/playwright/tests/settings.spec.ts
index 24066841d..f4d9d22bd 100644
--- a/apps/builder/playwright/tests/settings.spec.ts
+++ b/apps/builder/playwright/tests/settings.spec.ts
@@ -89,4 +89,24 @@ test.describe.parallel('Settings page', () => {
       await page.fill('textarea#description', 'Lorem ipsum')
     })
   })
+
+  test.describe('Free user', () => {
+    test.use({
+      storageState: path.join(__dirname, '../freeUser.json'),
+    })
+    test("can't remove branding", async ({ page }) => {
+      const typebotId = 'free-branding-typebot'
+      await importTypebotInDatabase(
+        path.join(__dirname, '../fixtures/typebots/theme.json'),
+        {
+          id: typebotId,
+        }
+      )
+      await page.goto(`/typebots/${typebotId}/settings`)
+      await page.click('button:has-text("General")')
+      await expect(page.locator('text=Pro')).toBeVisible()
+      await page.click('text=Typebot.io branding')
+      await expect(page.locator('text=Upgrade now')).toBeVisible()
+    })
+  })
 })