From a9df3309b9a2736367fedbb8cbc0a215f01403fb Mon Sep 17 00:00:00 2001 From: Peer Richelsen Date: Tue, 29 Nov 2022 21:57:26 +0000 Subject: [PATCH] added wordpress plugin (#5168) --- packages/app-store/apps.browser.generated.tsx | 1 + packages/app-store/apps.metadata.generated.ts | 2 + packages/app-store/apps.schemas.generated.ts | 2 + packages/app-store/apps.server.generated.ts | 1 + packages/app-store/wordpress/README.mdx | 16 +++++++ packages/app-store/wordpress/_metadata.ts | 10 +++++ packages/app-store/wordpress/api/add.ts | 21 +++++++++ packages/app-store/wordpress/api/index.ts | 1 + .../app-store/wordpress/components/.gitkeep | 0 packages/app-store/wordpress/config.json | 16 +++++++ .../wordpress/extensions/EventTypeAppCard.tsx | 43 +++++++++++++++++++ packages/app-store/wordpress/index.ts | 2 + packages/app-store/wordpress/package.json | 14 ++++++ packages/app-store/wordpress/plugin.php | 22 ++++++++++ packages/app-store/wordpress/static/icon.svg | 1 + packages/app-store/wordpress/zod.ts | 9 ++++ packages/prisma/seed-app-store.config.json | 6 +++ 17 files changed, 167 insertions(+) create mode 100644 packages/app-store/wordpress/README.mdx create mode 100644 packages/app-store/wordpress/_metadata.ts create mode 100644 packages/app-store/wordpress/api/add.ts create mode 100644 packages/app-store/wordpress/api/index.ts create mode 100644 packages/app-store/wordpress/components/.gitkeep create mode 100644 packages/app-store/wordpress/config.json create mode 100644 packages/app-store/wordpress/extensions/EventTypeAppCard.tsx create mode 100644 packages/app-store/wordpress/index.ts create mode 100644 packages/app-store/wordpress/package.json create mode 100644 packages/app-store/wordpress/plugin.php create mode 100644 packages/app-store/wordpress/static/icon.svg create mode 100644 packages/app-store/wordpress/zod.ts diff --git a/packages/app-store/apps.browser.generated.tsx b/packages/app-store/apps.browser.generated.tsx index 0da82056e8..1b64236571 100644 --- a/packages/app-store/apps.browser.generated.tsx +++ b/packages/app-store/apps.browser.generated.tsx @@ -38,4 +38,5 @@ export const EventTypeAddonMap = { qr_code: dynamic(() => import("./qr_code/extensions/EventTypeAppCard")), rainbow: dynamic(() => import("./rainbow/extensions/EventTypeAppCard")), stripepayment: dynamic(() => import("./stripepayment/extensions/EventTypeAppCard")), + wordpress: dynamic(() => import("./wordpress/extensions/EventTypeAppCard")), }; diff --git a/packages/app-store/apps.metadata.generated.ts b/packages/app-store/apps.metadata.generated.ts index 09223fb3ab..7d8bb53464 100644 --- a/packages/app-store/apps.metadata.generated.ts +++ b/packages/app-store/apps.metadata.generated.ts @@ -43,6 +43,7 @@ import { metadata as weather_in_your_calendar_meta } from "./weather_in_your_cal import { metadata as whatsapp_meta } from "./whatsapp/_metadata"; import { metadata as whereby_meta } from "./whereby/_metadata"; import { metadata as wipemycalother_meta } from "./wipemycalother/_metadata"; +import { metadata as wordpress_meta } from "./wordpress/_metadata"; import { metadata as zapier_meta } from "./zapier/_metadata"; import { metadata as zoomvideo_meta } from "./zoomvideo/_metadata"; @@ -88,6 +89,7 @@ export const appStoreMetadata = { whatsapp: whatsapp_meta, whereby: whereby_meta, wipemycalother: wipemycalother_meta, + wordpress: wordpress_meta, zapier: zapier_meta, zoomvideo: zoomvideo_meta, }; diff --git a/packages/app-store/apps.schemas.generated.ts b/packages/app-store/apps.schemas.generated.ts index 83a4131d47..8052328221 100644 --- a/packages/app-store/apps.schemas.generated.ts +++ b/packages/app-store/apps.schemas.generated.ts @@ -9,6 +9,7 @@ import { appDataSchema as giphy_schema } from "./giphy/zod"; import { appDataSchema as qr_code_schema } from "./qr_code/zod"; import { appDataSchema as rainbow_schema } from "./rainbow/zod"; import { appDataSchema as stripepayment_schema } from "./stripepayment/zod"; +import { appDataSchema as wordpress_schema } from "./wordpress/zod"; export const appDataSchemas = { "routing-forms": routing_forms_schema, @@ -18,4 +19,5 @@ export const appDataSchemas = { qr_code: qr_code_schema, rainbow: rainbow_schema, stripe: stripepayment_schema, + wordpress: wordpress_schema, }; diff --git a/packages/app-store/apps.server.generated.ts b/packages/app-store/apps.server.generated.ts index b58572deed..7a9c2d08c3 100644 --- a/packages/app-store/apps.server.generated.ts +++ b/packages/app-store/apps.server.generated.ts @@ -42,6 +42,7 @@ export const apiHandlers = { whatsapp: import("./whatsapp/api"), whereby: import("./whereby/api"), wipemycalother: import("./wipemycalother/api"), + wordpress: import("./wordpress/api"), zapier: import("./zapier/api"), zoomvideo: import("./zoomvideo/api"), }; diff --git a/packages/app-store/wordpress/README.mdx b/packages/app-store/wordpress/README.mdx new file mode 100644 index 0000000000..5b5c61f6e6 --- /dev/null +++ b/packages/app-store/wordpress/README.mdx @@ -0,0 +1,16 @@ +Embedded booking pages right into your wordpress page. + +#### FEATURES +- Add Cal.com booking calendar to any WordPress page/post with a simple shortcode. +- Display your Cal.com booking calendar inline or in a popup. +- Customize your booking button to suit you. + +#### SHORTCODE + +[cal url=/username/meetingid type=2 text="Schedule a call with me"] + +#### SHORTCODE CUSTOMIZATION +- url: URL of the booking calendar +- type: Add inline or popup embed. Inline embed: 1, Popup embed: 2 +- text: For popup embed, customize the text/button that triggers the popup. + diff --git a/packages/app-store/wordpress/_metadata.ts b/packages/app-store/wordpress/_metadata.ts new file mode 100644 index 0000000000..9c7f2aa320 --- /dev/null +++ b/packages/app-store/wordpress/_metadata.ts @@ -0,0 +1,10 @@ +import type { AppMeta } from "@calcom/types/App"; + +import config from "./config.json"; + +export const metadata = { + category: "other", + ...config, +} as AppMeta; + +export default metadata; diff --git a/packages/app-store/wordpress/api/add.ts b/packages/app-store/wordpress/api/add.ts new file mode 100644 index 0000000000..fb6e427a8a --- /dev/null +++ b/packages/app-store/wordpress/api/add.ts @@ -0,0 +1,21 @@ +import { AppDeclarativeHandler } from "@calcom/types/AppHandler"; + +import { createDefaultInstallation } from "../../_utils/installation"; +import appConfig from "../config.json"; + +const handler: AppDeclarativeHandler = { + // Instead of passing appType and slug from here, api/integrations/[..args] should be able to derive and pass these directly to createCredential + appType: appConfig.type, + variant: appConfig.variant, + slug: appConfig.slug, + supportsMultipleInstalls: false, + handlerType: "add", + redirect: { + newTab: true, + url: "https://wordpress.org/plugins/cal-com/", + }, + createCredential: ({ appType, user, slug }) => + createDefaultInstallation({ appType, userId: user.id, slug, key: {} }), +}; + +export default handler; diff --git a/packages/app-store/wordpress/api/index.ts b/packages/app-store/wordpress/api/index.ts new file mode 100644 index 0000000000..4c0d2ead01 --- /dev/null +++ b/packages/app-store/wordpress/api/index.ts @@ -0,0 +1 @@ +export { default as add } from "./add"; diff --git a/packages/app-store/wordpress/components/.gitkeep b/packages/app-store/wordpress/components/.gitkeep new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/app-store/wordpress/config.json b/packages/app-store/wordpress/config.json new file mode 100644 index 0000000000..d34d7ee8d9 --- /dev/null +++ b/packages/app-store/wordpress/config.json @@ -0,0 +1,16 @@ +{ + "/*": "Don't modify slug - If required, do it using cli edit command", + "name": "Wordpress", + "slug": "wordpress", + "type": "wordpress_other", + "imageSrc": "/api/app-store/wordpress/icon.svg", + "logo": "/api/app-store/wordpress/icon.svg", + "url": "https://github.com/calcom/wp-plugin", + "variant": "other", + "categories": ["other"], + "publisher": "Cal.com, Inc.", + "email": "support@cal.com", + "description": "Embedded booking pages right into your wordpress page", + "extendsFeature": "EventType", + "__createdUsingCli": true +} diff --git a/packages/app-store/wordpress/extensions/EventTypeAppCard.tsx b/packages/app-store/wordpress/extensions/EventTypeAppCard.tsx new file mode 100644 index 0000000000..a48a616b8c --- /dev/null +++ b/packages/app-store/wordpress/extensions/EventTypeAppCard.tsx @@ -0,0 +1,43 @@ +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 { Icon } from "@calcom/ui"; + +import { appDataSchema } from "../zod"; + +const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({ eventType, app }) { + const [getAppData, setAppData] = useAppContextWithSchema(); + const isSunrise = getAppData("isSunrise"); + const [enabled, setEnabled] = useState(getAppData("enabled")); + + return ( + { + if (!e) { + setEnabled(false); + setAppData("isSunrise", false); + } else { + setEnabled(true); + setAppData("isSunrise", true); + } + }} + switchChecked={enabled}> +
+
+ {isSunrise ? : }I am an AppCard + for Event with Title: {eventType.title} +
{" "} +
+ Edit packages/app-store/{app.slug}/extensions/EventTypeAppCard.tsx{" "} + to play with me +
+
+ + ); +}; + +export default EventTypeAppCard; diff --git a/packages/app-store/wordpress/index.ts b/packages/app-store/wordpress/index.ts new file mode 100644 index 0000000000..5d372ceda3 --- /dev/null +++ b/packages/app-store/wordpress/index.ts @@ -0,0 +1,2 @@ +export * as api from "./api"; +export { metadata } from "./_metadata"; diff --git a/packages/app-store/wordpress/package.json b/packages/app-store/wordpress/package.json new file mode 100644 index 0000000000..f6de58b3c4 --- /dev/null +++ b/packages/app-store/wordpress/package.json @@ -0,0 +1,14 @@ +{ + "$schema": "https://json.schemastore.org/package.json", + "private": true, + "name": "@calcom/wordpress", + "version": "0.0.0", + "main": "./index.ts", + "description": "Embedded booking pages right into your wordpress page", + "dependencies": { + "@calcom/lib": "*" + }, + "devDependencies": { + "@calcom/types": "*" + } +} diff --git a/packages/app-store/wordpress/plugin.php b/packages/app-store/wordpress/plugin.php new file mode 100644 index 0000000000..5f8ba65cb3 --- /dev/null +++ b/packages/app-store/wordpress/plugin.php @@ -0,0 +1,22 @@ + $post->post_title, +), $atts)); +if(empty($content)) $content='Embed Cal.com'; + +return ' ' +} +add_shortcode('cal', 'cal_shortcode'); \ No newline at end of file diff --git a/packages/app-store/wordpress/static/icon.svg b/packages/app-store/wordpress/static/icon.svg new file mode 100644 index 0000000000..72183e9042 --- /dev/null +++ b/packages/app-store/wordpress/static/icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/app-store/wordpress/zod.ts b/packages/app-store/wordpress/zod.ts new file mode 100644 index 0000000000..14cccd01a9 --- /dev/null +++ b/packages/app-store/wordpress/zod.ts @@ -0,0 +1,9 @@ +import { z } from "zod"; + +import { eventTypeAppCardZod } from "../eventTypeAppCardZod"; + +export const appDataSchema = eventTypeAppCardZod.merge( + z.object({ + isSunrise: z.boolean(), + }) +); diff --git a/packages/prisma/seed-app-store.config.json b/packages/prisma/seed-app-store.config.json index 13bddc7dea..9abb2a0bee 100644 --- a/packages/prisma/seed-app-store.config.json +++ b/packages/prisma/seed-app-store.config.json @@ -84,6 +84,12 @@ "slug": "fathom", "type": "fathom_analytics" }, + { + "dirName": "wordpress", + "categories": ["other"], + "slug": "wordpress", + "type": "wordpress_other" + }, { "dirName": "ga4", "categories": ["analytics"],