From c932173430a007aac1151690218b20a87584e1e1 Mon Sep 17 00:00:00 2001
From: chavda-bhavik <bhavikvchavda@gmail.com>
Date: Tue, 25 Jun 2024 14:45:07 +0530
Subject: [PATCH] feat: Improved bubble.io destination providing

---
 .../imports/destination/Destination.tsx       | 28 +++++++++++--------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/apps/web/components/imports/destination/Destination.tsx b/apps/web/components/imports/destination/Destination.tsx
index d52e55bbe..b9b70456c 100644
--- a/apps/web/components/imports/destination/Destination.tsx
+++ b/apps/web/components/imports/destination/Destination.tsx
@@ -16,12 +16,13 @@ interface DestinationProps {
 
 export function Destination({ template }: DestinationProps) {
   const {
-    destination,
-    register,
-    control,
+    watch,
     errors,
+    control,
     onSubmit,
     setValue,
+    register,
+    destination,
     setDestination,
     resetDestination,
     mapBubbleIoColumnsClick,
@@ -39,6 +40,7 @@ export function Destination({ template }: DestinationProps) {
       setValue('destination', newDestination);
     }
   };
+  const bubbleDestinationEnvironment = watch('bubbleIo.environment');
 
   return (
     <Stack>
@@ -107,15 +109,6 @@ export function Destination({ template }: DestinationProps) {
               )}
             />
 
-            <Input
-              label="Custom Domain Name"
-              placeholder="Custom Domain Name"
-              {...register('bubbleIo.customDomainName', {
-                pattern: /^((?!-)[a-zA-Z0-9-]{1,63}(?<!-)\.)+[a-zA-Z]{2,63}$/,
-              })}
-              description="Required, if application is hosted on custom domain. Ex. myapp.io"
-              error={errors?.bubbleIo?.customDomainName ? 'Please enter valid domain name' : undefined}
-            />
             <Controller
               control={control}
               name="bubbleIo.environment"
@@ -132,6 +125,17 @@ export function Destination({ template }: DestinationProps) {
                 />
               )}
             />
+            {bubbleDestinationEnvironment === 'production' && (
+              <Input
+                label="Custom Domain Name"
+                placeholder="Custom Domain Name"
+                {...register('bubbleIo.customDomainName', {
+                  pattern: /^((?!-)[a-zA-Z0-9-]{1,63}(?<!-)\.)+[a-zA-Z]{2,63}$/,
+                })}
+                description="Required, if application is hosted on custom domain. Ex. myapp.io"
+                error={errors?.bubbleIo?.customDomainName ? 'Please enter valid domain name' : undefined}
+              />
+            )}
             <Input
               required
               label="API Private Key"