added empty screen for missing platform plan (#15467)

Author: PeerRich

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>
+      }
+    />
+  );
+}

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>
   );

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>
   );

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>
   );