From 30c31d358580ea6a01abbfaad0a5150b77d0d412 Mon Sep 17 00:00:00 2001
From: Akash Rajpurohit <akashrajpurohit.009@gmail.com>
Date: Thu, 22 Aug 2024 13:09:03 +0530
Subject: [PATCH] feat: :sparkles: support for adding script url added for
 umami (#16300)

* feat: :sparkles: support for adding script url added for umami

This will help self hosters in setting up umami.

* feat: :sparkles: set default value for script URL in the form field

---------

Co-authored-by: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com>
---
 .../components/EventTypeAppCardInterface.tsx  | 31 +++++++++++++------
 packages/app-store/umami/config.json          |  2 +-
 packages/app-store/umami/zod.ts               |  1 +
 3 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/packages/app-store/umami/components/EventTypeAppCardInterface.tsx b/packages/app-store/umami/components/EventTypeAppCardInterface.tsx
index 286cf1e2f2..da5c2506eb 100644
--- a/packages/app-store/umami/components/EventTypeAppCardInterface.tsx
+++ b/packages/app-store/umami/components/EventTypeAppCardInterface.tsx
@@ -9,6 +9,7 @@ import type { appDataSchema } from "../zod";
 const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({ app, eventType }) {
   const { getAppData, setAppData, disabled } = useAppContextWithSchema<typeof appDataSchema>();
   const siteId = getAppData("SITE_ID");
+  const scriptURL = getAppData("SCRIPT_URL");
   const { enabled, updateEnabled } = useIsAppEnabled(app);
 
   return (
@@ -19,15 +20,27 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
       }}
       switchChecked={enabled}
       teamId={eventType.team?.id || undefined}>
-      <TextField
-        disabled={disabled}
-        name="Site ID"
-        value={siteId}
-        placeholder="Enter your Site ID"
-        onChange={(e) => {
-          setAppData("SITE_ID", e.target.value);
-        }}
-      />
+      <fieldset className="space-y-2" disabled={disabled}>
+        <TextField
+          disabled={disabled}
+          name="Script URL"
+          value={scriptURL}
+          defaultValue="https://us.umami.is/script.js"
+          placeholder="Enter the script source URL"
+          onChange={(e) => {
+            setAppData("SCRIPT_URL", e.target.value);
+          }}
+        />
+        <TextField
+          disabled={disabled}
+          name="Site ID"
+          value={siteId}
+          placeholder="Enter your Site ID"
+          onChange={(e) => {
+            setAppData("SITE_ID", e.target.value);
+          }}
+        />
+      </fieldset>
     </AppCard>
   );
 };
diff --git a/packages/app-store/umami/config.json b/packages/app-store/umami/config.json
index 878cde0f57..8bc3a7aa87 100644
--- a/packages/app-store/umami/config.json
+++ b/packages/app-store/umami/config.json
@@ -14,7 +14,7 @@
     "tag": {
       "scripts": [
         {
-          "src": "https://us.umami.is/script.js",
+          "src": "{SCRIPT_URL}",
           "attrs": {
             "data-website-id": "{SITE_ID}"
           }
diff --git a/packages/app-store/umami/zod.ts b/packages/app-store/umami/zod.ts
index 3339ccae14..83716cb0a5 100644
--- a/packages/app-store/umami/zod.ts
+++ b/packages/app-store/umami/zod.ts
@@ -5,6 +5,7 @@ import { eventTypeAppCardZod } from "@calcom/app-store/eventTypeAppCardZod";
 export const appDataSchema = eventTypeAppCardZod.merge(
   z.object({
     SITE_ID: z.string().optional(),
+    SCRIPT_URL: z.string().optional(),
   })
 );