diff --git a/packages/app-store/apps.browser.generated.tsx b/packages/app-store/apps.browser.generated.tsx index 686a311b5e..04b0adc9df 100644 --- a/packages/app-store/apps.browser.generated.tsx +++ b/packages/app-store/apps.browser.generated.tsx @@ -40,6 +40,7 @@ export const EventTypeAddonMap = { fathom: dynamic(() => import("./fathom/components/EventTypeAppCardInterface")), ga4: dynamic(() => import("./ga4/components/EventTypeAppCardInterface")), giphy: dynamic(() => import("./giphy/components/EventTypeAppCardInterface")), + "google-tag-manager": dynamic(() => import("./google-tag-manager/components/EventTypeAppCardInterface")), plausible: dynamic(() => import("./plausible/components/EventTypeAppCardInterface")), qr_code: dynamic(() => import("./qr_code/components/EventTypeAppCardInterface")), rainbow: dynamic(() => import("./rainbow/components/EventTypeAppCardInterface")), diff --git a/packages/app-store/apps.keys-schemas.generated.ts b/packages/app-store/apps.keys-schemas.generated.ts index 07454fafc8..b2dc90884c 100644 --- a/packages/app-store/apps.keys-schemas.generated.ts +++ b/packages/app-store/apps.keys-schemas.generated.ts @@ -6,6 +6,7 @@ import { appKeysSchema as dailyvideo_zod_ts } from "./dailyvideo/zod"; import { appKeysSchema as fathom_zod_ts } from "./fathom/zod"; import { appKeysSchema as ga4_zod_ts } from "./ga4/zod"; import { appKeysSchema as giphy_zod_ts } from "./giphy/zod"; +import { appKeysSchema as google_tag_manager_zod_ts } from "./google-tag-manager/zod"; import { appKeysSchema as googlecalendar_zod_ts } from "./googlecalendar/zod"; import { appKeysSchema as hubspot_zod_ts } from "./hubspot/zod"; import { appKeysSchema as larkcalendar_zod_ts } from "./larkcalendar/zod"; @@ -30,6 +31,7 @@ export const appKeysSchemas = { fathom: fathom_zod_ts, ga4: ga4_zod_ts, giphy: giphy_zod_ts, + "google-tag-manager": google_tag_manager_zod_ts, googlecalendar: googlecalendar_zod_ts, hubspot: hubspot_zod_ts, larkcalendar: larkcalendar_zod_ts, diff --git a/packages/app-store/apps.metadata.generated.ts b/packages/app-store/apps.metadata.generated.ts index 740eef6bf5..e25c9ef1de 100644 --- a/packages/app-store/apps.metadata.generated.ts +++ b/packages/app-store/apps.metadata.generated.ts @@ -17,6 +17,7 @@ import facetime_config_json from "./facetime/config.json"; import fathom_config_json from "./fathom/config.json"; import ga4_config_json from "./ga4/config.json"; import { metadata as giphy__metadata_ts } from "./giphy/_metadata"; +import google_tag_manager_config_json from "./google-tag-manager/config.json"; import { metadata as googlecalendar__metadata_ts } from "./googlecalendar/_metadata"; import { metadata as googlevideo__metadata_ts } from "./googlevideo/_metadata"; import { metadata as hubspot__metadata_ts } from "./hubspot/_metadata"; @@ -76,6 +77,7 @@ export const appStoreMetadata = { fathom: fathom_config_json, ga4: ga4_config_json, giphy: giphy__metadata_ts, + "google-tag-manager": google_tag_manager_config_json, googlecalendar: googlecalendar__metadata_ts, googlevideo: googlevideo__metadata_ts, hubspot: hubspot__metadata_ts, diff --git a/packages/app-store/apps.schemas.generated.ts b/packages/app-store/apps.schemas.generated.ts index e920cc5c83..e72d373ba1 100644 --- a/packages/app-store/apps.schemas.generated.ts +++ b/packages/app-store/apps.schemas.generated.ts @@ -6,6 +6,7 @@ import { appDataSchema as dailyvideo_zod_ts } from "./dailyvideo/zod"; import { appDataSchema as fathom_zod_ts } from "./fathom/zod"; import { appDataSchema as ga4_zod_ts } from "./ga4/zod"; import { appDataSchema as giphy_zod_ts } from "./giphy/zod"; +import { appDataSchema as google_tag_manager_zod_ts } from "./google-tag-manager/zod"; import { appDataSchema as googlecalendar_zod_ts } from "./googlecalendar/zod"; import { appDataSchema as hubspot_zod_ts } from "./hubspot/zod"; import { appDataSchema as larkcalendar_zod_ts } from "./larkcalendar/zod"; @@ -30,6 +31,7 @@ export const appDataSchemas = { fathom: fathom_zod_ts, ga4: ga4_zod_ts, giphy: giphy_zod_ts, + "google-tag-manager": google_tag_manager_zod_ts, googlecalendar: googlecalendar_zod_ts, hubspot: hubspot_zod_ts, larkcalendar: larkcalendar_zod_ts, diff --git a/packages/app-store/apps.server.generated.ts b/packages/app-store/apps.server.generated.ts index 734c7fae1e..36621e1227 100644 --- a/packages/app-store/apps.server.generated.ts +++ b/packages/app-store/apps.server.generated.ts @@ -17,6 +17,7 @@ export const apiHandlers = { fathom: import("./fathom/api"), ga4: import("./ga4/api"), giphy: import("./giphy/api"), + "google-tag-manager": import("./google-tag-manager/api"), googlecalendar: import("./googlecalendar/api"), googlevideo: import("./googlevideo/api"), hubspot: import("./hubspot/api"), diff --git a/packages/app-store/google-tag-manager/api/add.ts b/packages/app-store/google-tag-manager/api/add.ts new file mode 100644 index 0000000000..9a4afb9b2c --- /dev/null +++ b/packages/app-store/google-tag-manager/api/add.ts @@ -0,0 +1,16 @@ +import { createDefaultInstallation } from "@calcom/app-store/_utils/installation"; +import type { AppDeclarativeHandler } from "@calcom/types/AppHandler"; + +import appConfig from "../config.json"; + +const handler: AppDeclarativeHandler = { + appType: appConfig.type, + variant: appConfig.variant, + slug: appConfig.slug, + supportsMultipleInstalls: false, + handlerType: "add", + createCredential: ({ appType, user, slug }) => + createDefaultInstallation({ appType, userId: user.id, slug, key: {} }), +}; + +export default handler; diff --git a/packages/app-store/google-tag-manager/api/index.ts b/packages/app-store/google-tag-manager/api/index.ts new file mode 100644 index 0000000000..4c0d2ead01 --- /dev/null +++ b/packages/app-store/google-tag-manager/api/index.ts @@ -0,0 +1 @@ +export { default as add } from "./add"; diff --git a/packages/app-store/google-tag-manager/components/EventTypeAppCardInterface.tsx b/packages/app-store/google-tag-manager/components/EventTypeAppCardInterface.tsx new file mode 100644 index 0000000000..d86dc6a17c --- /dev/null +++ b/packages/app-store/google-tag-manager/components/EventTypeAppCardInterface.tsx @@ -0,0 +1,38 @@ +import { useState } from "react"; + +import { useAppContextWithSchema } from "@calcom/app-store/EventTypeAppContext"; +import AppCard from "@calcom/app-store/_components/AppCard"; +import type { EventTypeAppCardComponent } from "@calcom/app-store/types"; +import { TextField } from "@calcom/ui"; + +import type { appDataSchema } from "../zod"; + +const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({ app }) { + const [getAppData, setAppData] = useAppContextWithSchema(); + const trackingId = getAppData("trackingId"); + const [enabled, setEnabled] = useState(getAppData("enabled")); + + return ( + { + if (!e) { + setEnabled(false); + } else { + setEnabled(true); + } + }} + switchChecked={enabled}> + { + setAppData("trackingId", e.target.value); + }} + /> + + ); +}; + +export default EventTypeAppCard; diff --git a/packages/app-store/google-tag-manager/config.json b/packages/app-store/google-tag-manager/config.json new file mode 100644 index 0000000000..98a2c186b4 --- /dev/null +++ b/packages/app-store/google-tag-manager/config.json @@ -0,0 +1,28 @@ +{ + "name": "Google Tag Manager", + "slug": "google-tag-manager", + "type": "google-tag-manager_analytics", + "imageSrc": "icon.svg", + "logo": "icon.svg", + "url": "https://tagmanager.google.com", + "variant": "analytics", + "categories": [ + "analytics" + ], + "publisher": "Black Lemon", + "email": "support@blacklemon.dk", + "description": "App to install Google Tag Manager", + "extendsFeature": "EventType", + "appData": { + "tag": { + "scripts": [ + { + "content":"(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-{TRACKING_ID}');" + } + ] + } + }, + "isTemplate": false, + "__createdUsingCli": true, + "__template": "booking-pages-tag" +} \ No newline at end of file diff --git a/packages/app-store/google-tag-manager/index.ts b/packages/app-store/google-tag-manager/index.ts new file mode 100644 index 0000000000..d7f3602204 --- /dev/null +++ b/packages/app-store/google-tag-manager/index.ts @@ -0,0 +1 @@ +export * as api from "./api"; diff --git a/packages/app-store/google-tag-manager/package.json b/packages/app-store/google-tag-manager/package.json new file mode 100644 index 0000000000..22238d43b7 --- /dev/null +++ b/packages/app-store/google-tag-manager/package.json @@ -0,0 +1,14 @@ +{ + "$schema": "https://json.schemastore.org/package.json", + "private": true, + "name": "@calcom/google-tag-manager", + "version": "0.0.0", + "main": "./index.ts", + "dependencies": { + "@calcom/lib": "*" + }, + "devDependencies": { + "@calcom/types": "*" + }, + "description": "App to install Google Tag Manager" +} diff --git a/packages/app-store/google-tag-manager/static/1.jpeg b/packages/app-store/google-tag-manager/static/1.jpeg new file mode 100644 index 0000000000..d3ba68492d Binary files /dev/null and b/packages/app-store/google-tag-manager/static/1.jpeg differ diff --git a/packages/app-store/google-tag-manager/static/icon.svg b/packages/app-store/google-tag-manager/static/icon.svg new file mode 100644 index 0000000000..262d8167e1 --- /dev/null +++ b/packages/app-store/google-tag-manager/static/icon.svg @@ -0,0 +1 @@ +google-tag-manager \ No newline at end of file diff --git a/packages/app-store/google-tag-manager/zod.ts b/packages/app-store/google-tag-manager/zod.ts new file mode 100644 index 0000000000..6f45d901cc --- /dev/null +++ b/packages/app-store/google-tag-manager/zod.ts @@ -0,0 +1,11 @@ +import { z } from "zod"; + +import { eventTypeAppCardZod } from "@calcom/app-store/eventTypeAppCardZod"; + +export const appDataSchema = eventTypeAppCardZod.merge( + z.object({ + trackingId: z.string(), + }) +); + +export const appKeysSchema = z.object({}); diff --git a/packages/prisma/seed-app-store.config.json b/packages/prisma/seed-app-store.config.json index 47cec99b9c..d3373948ee 100644 --- a/packages/prisma/seed-app-store.config.json +++ b/packages/prisma/seed-app-store.config.json @@ -2,221 +2,300 @@ { "/*": "This file is auto-generated and updated by `yarn app-store create/edit`. Don't edit it manually", "dirName": "routing-forms", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "routing-forms", "type": "routing-forms_other" }, { "dirName": "whereby", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "whereby", "type": "whereby_video" }, { "dirName": "around", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "around", "type": "around_video" }, { "dirName": "riverside", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "riverside", "type": "riverside_video" }, { "dirName": "typeform", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "typeform", "type": "typeform_other" }, { "dirName": "ping", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "ping", "type": "ping_video" }, { "dirName": "campfire", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "campfire", "type": "campfire_video" }, { "dirName": "rainbow", - "categories": ["web3"], + "categories": [ + "web3" + ], "slug": "rainbow", "type": "rainbow_web3" }, { "dirName": "raycast", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "raycast", "type": "raycast_other" }, { "dirName": "n8n", - "categories": ["automation"], + "categories": [ + "automation" + ], "slug": "n8n", "type": "n8n_automation" }, { "dirName": "exchangecalendar", - "categories": ["calendar"], + "categories": [ + "calendar" + ], "slug": "exchange", "type": "exchange_calendar" }, { "dirName": "qr_code", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "qr_code", "type": "qr_code_other" }, { "dirName": "weather_in_your_calendar", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "weather_in_your_calendar", "type": "weather_in_your_calendar_other" }, { "dirName": "fathom", - "categories": ["analytics"], + "categories": [ + "analytics" + ], "slug": "fathom", "type": "fathom_analytics" }, { "dirName": "plausible", - "categories": ["analytics"], + "categories": [ + "analytics" + ], "slug": "plausible", "type": "plausible_analytics" }, { "dirName": "wordpress", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "wordpress", "type": "wordpress_other" }, { "dirName": "ga4", - "categories": ["analytics"], + "categories": [ + "analytics" + ], "slug": "ga4", "type": "ga4_analytics" }, { "dirName": "pipedream", - "categories": ["automation"], + "categories": [ + "automation" + ], "slug": "pipedream", "type": "pipedream_automation" }, { "dirName": "sirius_video", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "sirius_video", "type": "sirius_video_video" }, { "dirName": "sendgrid", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "sendgrid", "type": "sendgrid_other_calendar" }, { "dirName": "closecom", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "closecom", "type": "closecom_other_calendar" }, { "dirName": "whatsapp", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "whatsapp", "type": "whatsapp_video" }, { "dirName": "telegram", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "telegram", "type": "telegram_video" }, { "dirName": "signal", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "signal", "type": "signal_video" }, { "dirName": "vimcal", - "categories": ["calendar"], + "categories": [ + "calendar" + ], "slug": "vimcal", "type": "vimcal_other" }, { "dirName": "amie", - "categories": ["calendar"], + "categories": [ + "calendar" + ], "slug": "amie", "type": "amie_other" }, { "dirName": "booking-pages-tag", - "categories": ["analytics"], + "categories": [ + "analytics" + ], "slug": "booking-pages-tag", "type": "booking-pages-tag_other", "isTemplate": true }, { "dirName": "event-type-app-card", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "event-type-app-card", "type": "event-type-app-card_other", "isTemplate": true }, { "dirName": "event-type-location-video-static", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "event-type-location-video-static", "type": "event-type-location-video-static_other", "isTemplate": true }, { "dirName": "general-app-settings", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "general-app-settings", "type": "general-app-settings_other", "isTemplate": true }, { "dirName": "link-as-an-app", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "link-as-an-app", "type": "link-as-an-app_other", "isTemplate": true }, { "dirName": "basic", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "basic", "type": "basic_other", "isTemplate": true }, { "dirName": "facetime", - "categories": ["video"], + "categories": [ + "video" + ], "slug": "facetime", "type": "facetime_video", "isTemplate": false }, { "dirName": "zohocrm", - "categories": ["other"], + "categories": [ + "other" + ], "slug": "zohocrm", "type": "zohocrm_other_calendar", "isTemplate": false }, { "dirName": "cron", - "categories": ["calendar"], + "categories": [ + "calendar" + ], "slug": "cron", "type": "cron_other", "isTemplate": false + }, + { + "dirName": "google-tag-manager", + "categories": [ + "analytics" + ], + "slug": "google-tag-manager", + "type": "google-tag-manager_analytics", + "isTemplate": false } -] +] \ No newline at end of file