vimcal app (#5791)

* wip vimcal app

* added vimcal blog link

* todo: filter out external calendar apps

* Make it a non calendar type app with category and variant as calendar

Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>

apps/web/components/apps/App.tsx

@@ -66,7 +66,9 @@ const Component = ({
     }
   );
 
-  const allowedMultipleInstalls = categories.indexOf("calendar") > -1;
+  // variant not other allows, an app to be shown in calendar category without requiring an actual calendar connection e.g. vimcal
+  // Such apps, can only be installed once.
+  const allowedMultipleInstalls = categories.indexOf("calendar") > -1 && variant !== "other";
 
   return (
     <div className="relative flex-1 flex-col items-start justify-start px-4 md:flex md:px-8 lg:flex-row lg:px-0">

packages/app-store/apps.metadata.generated.ts

@@ -39,6 +39,7 @@ import { metadata as stripepayment_meta } from "./stripepayment/_metadata";
 import { metadata as tandemvideo_meta } from "./tandemvideo/_metadata";
 import { metadata as telegram_meta } from "./telegram/_metadata";
 import { metadata as typeform_meta } from "./typeform/_metadata";
+import { metadata as vimcal_meta } from "./vimcal/_metadata";
 import { metadata as vital_meta } from "./vital/_metadata";
 import { metadata as weather_in_your_calendar_meta } from "./weather_in_your_calendar/_metadata";
 import { metadata as whatsapp_meta } from "./whatsapp/_metadata";
@@ -86,6 +87,7 @@ export const appStoreMetadata = {
   tandemvideo: tandemvideo_meta,
   telegram: telegram_meta,
   typeform: typeform_meta,
+  vimcal: vimcal_meta,
   vital: vital_meta,
   weather_in_your_calendar: weather_in_your_calendar_meta,
   whatsapp: whatsapp_meta,

packages/app-store/apps.server.generated.ts

@@ -38,6 +38,7 @@ export const apiHandlers = {
   tandemvideo: import("./tandemvideo/api"),
   telegram: import("./telegram/api"),
   typeform: import("./typeform/api"),
+  vimcal: import("./vimcal/api"),
   vital: import("./vital/api"),
   weather_in_your_calendar: import("./weather_in_your_calendar/api"),
   whatsapp: import("./whatsapp/api"),

packages/app-store/vimcal/README.mdx

@@ -0,0 +1,11 @@
+---
+description: The world's fastest calendar, beautifully designed for a remote world
+items:
+  - /api/app-store/vimcal/1.gif
+  - /api/app-store/vimcal/2.gif
+  - /api/app-store/vimcal/3.gif
+  - /api/app-store/vimcal/4.gif
+---
+
+{description}
+

packages/app-store/vimcal/_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;

packages/app-store/vimcal/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://cal.com/blog/cal-plus-vimcal",
+  },
+  createCredential: ({ appType, user, slug }) =>
+    createDefaultInstallation({ appType, userId: user.id, slug, key: {} }),
+};
+
+export default handler;

packages/app-store/vimcal/api/index.ts

@@ -0,0 +1 @@
+export { default as add } from "./add";

packages/app-store/vimcal/config.json

@@ -0,0 +1,16 @@
+{
+  "/*": "Don't modify slug - If required, do it using cli edit command",
+  "name": "Vimcal",
+  "slug": "vimcal",
+  "type": "vimcal_other",
+  "imageSrc": "/api/app-store/vimcal/icon.svg",
+  "logo": "/api/app-store/vimcal/icon.svg",
+  "url": "https://cal.com/apps/vimcal",
+  "variant": "other",
+  "categories": ["calendar"],
+  "publisher": "Cal.com, Inc.",
+  "email": "support@cal.com",
+  "description": "The world's fastest calendar, beautifully designed for a remote world\r",
+  "extendsFeature": "User",
+  "__createdUsingCli": true
+}

packages/app-store/vimcal/index.ts

@@ -0,0 +1,2 @@
+export * as api from "./api";
+export { metadata } from "./_metadata";

packages/app-store/vimcal/package.json

@@ -0,0 +1,14 @@
+{
+  "$schema": "https://json.schemastore.org/package.json",
+  "private": true,
+  "name": "@calcom/vimcal",
+  "version": "0.0.0",
+  "main": "./index.ts",
+  "description": "The world's fastest calendar, beautifully designed for a remote world\r",
+  "dependencies": {
+    "@calcom/lib": "*"
+  },
+  "devDependencies": {
+    "@calcom/types": "*"
+  }
+}

packages/app-store/vimcal/static/icon.svg

@@ -0,0 +1,28 @@
+<svg width="62" height="58" viewBox="0 0 62 58" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.90676 11.7682C0.331514 15.5535 -0.904363 20.8542 2.31152 24.925C4.55796 27.7688 8.12817 28.9722 11.4731 28.3502C25.0725 15.2446 38.1409 10.9884 48.1289 10.1525C49.6733 10.0233 51.1425 9.97591 52.5271 9.98991C55.2643 7.11068 58.346 4.54111 61.7196 2.35078L61.7443 2.28935C61.7443 2.28935 47.1718 -1.08376 32.9863 0.929534C20.5999 2.68751 8.38054 7.03215 3.90676 11.7682Z" fill="url(#paint0_linear_1303_1047)"/>
+<path d="M13.9571 39.6669C11.2816 36.28 11.3264 31.6336 13.7764 28.3277C26.6775 16.3673 38.9317 12.4894 48.26 11.7088L50.7032 12.0128C46.1398 17.3558 42.6942 23.6199 40.6579 30.4189C37.9724 31.1454 35.321 32.4756 32.801 34.2211C29.4853 36.5177 26.3539 39.561 23.607 42.988C20.1257 43.8278 16.3134 42.6495 13.9571 39.6669Z" fill="url(#paint1_linear_1303_1047)"/>
+<path d="M24.7519 44.0672C24.5613 44.4084 24.3899 44.7653 24.2397 45.1369C22.2998 49.9396 24.6453 55.3958 29.4789 57.3235C31.0785 57.9616 32.7496 58.1333 34.3407 57.9032C35.9331 57.6814 37.4896 57.0516 38.8456 55.9941C39.1282 55.7738 39.3946 55.5405 39.6449 55.296C39.4201 54.2267 39.2282 53.1435 39.0705 52.047C38.0873 45.208 38.525 38.4931 40.1611 32.1969C37.9955 32.9019 35.8236 34.0315 33.7003 35.5022C30.4914 37.7248 27.4375 40.6986 24.7519 44.0672Z" fill="url(#paint2_linear_1303_1047)"/>
+<defs>
+<linearGradient id="paint0_linear_1303_1047" x1="57.8884" y1="7.12205" x2="-11.0432" y2="37.0341" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB6BE"/>
+<stop offset="0.113339" stop-color="#FA6753"/>
+<stop offset="0.432815" stop-color="#F50058"/>
+<stop offset="0.61187" stop-color="#F50081"/>
+<stop offset="0.77952" stop-color="#C71FD6"/>
+</linearGradient>
+<linearGradient id="paint1_linear_1303_1047" x1="57.8876" y1="7.12205" x2="-11.0441" y2="37.0341" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB6BE"/>
+<stop offset="0.113339" stop-color="#FA6753"/>
+<stop offset="0.432815" stop-color="#F50058"/>
+<stop offset="0.61187" stop-color="#F50081"/>
+<stop offset="0.77952" stop-color="#C71FD6"/>
+</linearGradient>
+<linearGradient id="paint2_linear_1303_1047" x1="57.8879" y1="7.12206" x2="-11.0437" y2="37.0341" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB6BE"/>
+<stop offset="0.113339" stop-color="#FA6753"/>
+<stop offset="0.432815" stop-color="#F50058"/>
+<stop offset="0.61187" stop-color="#F50081"/>
+<stop offset="0.77952" stop-color="#C71FD6"/>
+</linearGradient>
+</defs>
+</svg>

packages/prisma/seed-app-store.config.json

@@ -143,5 +143,11 @@
     "categories": ["video"],
     "slug": "signal",
     "type": "signal_video"
+  },
+  {
+    "dirName": "vimcal",
+    "categories": ["calendar"],
+    "slug": "vimcal",
+    "type": "vimcal_other"
   }
 ]