From 8124627cc513a3acea0b7745e2824582dc531716 Mon Sep 17 00:00:00 2001
From: S K B <47430686+shravan20@users.noreply.github.com>
Date: Fri, 19 Jan 2024 09:26:56 +0530
Subject: [PATCH] feat: preview of installed app name on the schedule screen
 (#13221)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
Co-authored-by: Udit Takkar <udit222001@gmail.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Omar López <zomars@me.com>
---
 .../components/BookEventForm/BookingFields.tsx  |  1 -
 packages/features/form-builder/Components.tsx   | 17 ++++++++++++++++-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/packages/features/bookings/Booker/components/BookEventForm/BookingFields.tsx b/packages/features/bookings/Booker/components/BookEventForm/BookingFields.tsx
index 1a754d3e6f..8be7c1bf18 100644
--- a/packages/features/bookings/Booker/components/BookEventForm/BookingFields.tsx
+++ b/packages/features/bookings/Booker/components/BookEventForm/BookingFields.tsx
@@ -105,7 +105,6 @@ export const BookingFields = ({
               optionInput.placeholder = option.inputPlaceholder;
             }
           });
-
           field.options = options.filter(
             (location): location is NonNullable<(typeof options)[number]> => !!location
           );
diff --git a/packages/features/form-builder/Components.tsx b/packages/features/form-builder/Components.tsx
index b16723d0e9..51b06b62bb 100644
--- a/packages/features/form-builder/Components.tsx
+++ b/packages/features/form-builder/Components.tsx
@@ -397,6 +397,21 @@ export const Components: Record<FieldType, Component> = {
       }, [options, setValue, value]);
 
       const { t } = useLocale();
+
+      const getCleanLabel = (option: { label: string; value: string }): string | JSX.Element => {
+        if (!option.label) {
+          return "";
+        }
+
+        return option.label.search(/^https?:\/\//) !== -1 ? (
+          <a href={option.label} target="_blank">
+            <span className="underline">{option.label}</span>
+          </a>
+        ) : (
+          option.label
+        );
+      };
+
       return (
         <div>
           <div>
@@ -419,7 +434,7 @@ export const Components: Record<FieldType, Component> = {
                         }}
                         checked={value?.value === option.value}
                       />
-                      <span className="text-emphasis me-2 ms-2 text-sm">{option.label ?? ""}</span>
+                      <span className="text-emphasis me-2 ms-2 text-sm">{getCleanLabel(option) ?? ""}</span>
                       <span>
                         {option.value === "phone" && (
                           <InfoBadge content={t("number_in_international_format")} />