From 532b78a9b3eded5238175da1f7afdb487a5f5bbb Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@gmail.com>
Date: Tue, 18 Jun 2024 09:37:48 +0200
Subject: [PATCH] added empty screen for missing platform plan (#15467)

---
 .../platform/dashboard/NoPlatformPlan.tsx     | 19 +++++++++++++++++++
 apps/web/pages/settings/platform/index.tsx    |  3 ++-
 .../oauth-clients/[clientId]/edit/index.tsx   |  3 ++-
 .../platform/oauth-clients/create.tsx         |  3 ++-
 4 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 apps/web/components/settings/platform/dashboard/NoPlatformPlan.tsx

diff --git a/apps/web/components/settings/platform/dashboard/NoPlatformPlan.tsx b/apps/web/components/settings/platform/dashboard/NoPlatformPlan.tsx
new file mode 100644
index 0000000000..8e051611d6
--- /dev/null
+++ b/apps/web/components/settings/platform/dashboard/NoPlatformPlan.tsx
@@ -0,0 +1,19 @@
+import { EmptyScreen, Button } from "@calcom/ui";
+
+export default function NoPlatformPlan() {
+  return (
+    <EmptyScreen
+      Icon="credit-card"
+      headline="Subscription needed"
+      description="You are not subscribed to a Platform plan."
+      buttonRaw={
+        <div className="flex gap-2">
+          <Button href="https://cal.com/platform/pricing">Go to Pricing</Button>
+          <Button color="secondary" href="https://cal.com/pricing">
+            Contact Sales
+          </Button>
+        </div>
+      }
+    />
+  );
+}
diff --git a/apps/web/pages/settings/platform/index.tsx b/apps/web/pages/settings/platform/index.tsx
index 7d96b6e1c2..3e87323f39 100644
--- a/apps/web/pages/settings/platform/index.tsx
+++ b/apps/web/pages/settings/platform/index.tsx
@@ -12,6 +12,7 @@ import { useDeleteOAuthClient } from "@lib/hooks/settings/platform/oauth-clients
 
 import PageWrapper from "@components/PageWrapper";
 import { HelpCards } from "@components/settings/platform/dashboard/HelpCards";
+import NoPlatformPlan from "@components/settings/platform/dashboard/NoPlatformPlan";
 import { ManagedUserList } from "@components/settings/platform/dashboard/managed-user-list";
 import { OAuthClientsList } from "@components/settings/platform/dashboard/oauth-clients-list";
 import { useGetUserAttributes } from "@components/settings/platform/hooks/useGetUserAttributes";
@@ -98,7 +99,7 @@ export default function Platform() {
         hideHeadingOnMobile
         withoutMain={false}
         SidebarContainer={<></>}>
-        You are not subscribed to a Platform plan.
+        <NoPlatformPlan />
       </Shell>
     </div>
   );
diff --git a/apps/web/pages/settings/platform/oauth-clients/[clientId]/edit/index.tsx b/apps/web/pages/settings/platform/oauth-clients/[clientId]/edit/index.tsx
index 5633dc8fc4..d2ea3caab3 100644
--- a/apps/web/pages/settings/platform/oauth-clients/[clientId]/edit/index.tsx
+++ b/apps/web/pages/settings/platform/oauth-clients/[clientId]/edit/index.tsx
@@ -10,6 +10,7 @@ import { useOAuthClient } from "@lib/hooks/settings/platform/oauth-clients/useOA
 import { useUpdateOAuthClient } from "@lib/hooks/settings/platform/oauth-clients/usePersistOAuthClient";
 
 import PageWrapper from "@components/PageWrapper";
+import NoPlatformPlan from "@components/settings/platform/dashboard/NoPlatformPlan";
 import { useGetUserAttributes } from "@components/settings/platform/hooks/useGetUserAttributes";
 import type { FormValues } from "@components/settings/platform/oauth-clients/oauth-client-form";
 import { OAuthClientForm as EditOAuthClientForm } from "@components/settings/platform/oauth-clients/oauth-client-form";
@@ -124,7 +125,7 @@ export default function EditOAuthClient() {
   return (
     <div>
       <Shell isPlatformUser={true} hideHeadingOnMobile withoutMain={false} SidebarContainer={<></>}>
-        You are not subscribed to a Platform plan.
+        <NoPlatformPlan />
       </Shell>
     </div>
   );
diff --git a/apps/web/pages/settings/platform/oauth-clients/create.tsx b/apps/web/pages/settings/platform/oauth-clients/create.tsx
index 5968be5084..d71567e220 100644
--- a/apps/web/pages/settings/platform/oauth-clients/create.tsx
+++ b/apps/web/pages/settings/platform/oauth-clients/create.tsx
@@ -9,6 +9,7 @@ import { showToast } from "@calcom/ui";
 import { useCreateOAuthClient } from "@lib/hooks/settings/platform/oauth-clients/usePersistOAuthClient";
 
 import PageWrapper from "@components/PageWrapper";
+import NoPlatformPlan from "@components/settings/platform/dashboard/NoPlatformPlan";
 import { useGetUserAttributes } from "@components/settings/platform/hooks/useGetUserAttributes";
 import type { FormValues } from "@components/settings/platform/oauth-clients/oauth-client-form";
 import { OAuthClientForm } from "@components/settings/platform/oauth-clients/oauth-client-form";
@@ -82,7 +83,7 @@ export default function CreateOAuthClient() {
   return (
     <div>
       <Shell isPlatformUser={true} hideHeadingOnMobile withoutMain={false} SidebarContainer={<></>}>
-        You are not subscribed to a Platform plan.
+        <NoPlatformPlan />
       </Shell>
     </div>
   );