From 70d29ab6fac6bcd45d3933b2d625d51ecae046fc Mon Sep 17 00:00:00 2001
From: "devin-ai-integration[bot]"
 <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Mon, 14 Apr 2025 11:13:05 +0000
Subject: [PATCH] feat: conditionally show contact us or report issue based on
 plan (#20629)

* feat: conditionally show contact us or report issue based on plan

Co-Authored-By: peer@cal.com <peer@cal.com>

* fix: update icon name to triangle-alert to fix type error

Co-Authored-By: peer@cal.com <peer@cal.com>

* fix: check specific plan type instead of isPaidUser flag

Co-Authored-By: peer@cal.com <peer@cal.com>

* fix: check userBillingData.valid to ensure billing plan is active

Co-Authored-By: peer@cal.com <peer@cal.com>

* fix: convert plan to lowercase before comparison

Co-Authored-By: peer@cal.com <peer@cal.com>

* fixup: dont show contact card for free platform users

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: peer@cal.com <peer@cal.com>
Co-authored-by: amrit <iamamrit27@gmail.com>
Co-authored-by: Ryukemeister <sahalrajiv6900@gmail.com>
---
 .../settings/platform/dashboard/HelpCards.tsx | 22 ++++++++++++++++---
 apps/web/lib/settings/platform/utils.ts       | 11 ++++++++++
 apps/web/public/static/locales/en/common.json |  3 +++
 3 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/apps/web/components/settings/platform/dashboard/HelpCards.tsx b/apps/web/components/settings/platform/dashboard/HelpCards.tsx
index 2e9aaad2f1..d08004f503 100644
--- a/apps/web/components/settings/platform/dashboard/HelpCards.tsx
+++ b/apps/web/components/settings/platform/dashboard/HelpCards.tsx
@@ -1,23 +1,39 @@
+import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Card } from "@calcom/ui/components/card";
 import { Icon } from "@calcom/ui/components/icon";
 
 import { helpCards } from "@lib/settings/platform/utils";
 
+import { useGetUserAttributes } from "@components/settings/platform/hooks/useGetUserAttributes";
+
 export const HelpCards = () => {
+  const { t } = useLocale();
+  const { userBillingData } = useGetUserAttributes();
+  const isPaidUser = userBillingData?.valid && userBillingData?.plan?.toLowerCase() !== "free";
+
   return (
     <>
       <div className="grid-col-1 mb-4 grid gap-2 md:grid-cols-3">
         {helpCards.map((card) => {
+          if (card.title === "Contact us" && !isPaidUser) return null;
+
+          if (card.title === "Report issue" && isPaidUser) return null;
+
+          const title = card.title === "Report issue" ? t("report_issue") : card.title;
+          const description =
+            card.title === "Report issue" ? t("report_issue_description") : card.description;
+          const actionButtonChild = card.title === "Report issue" ? t("open_issue") : card.actionButton.child;
+
           return (
             <div key={card.title}>
               <Card
                 icon={<Icon name={card.icon} className="h-5 w-5 text-green-700" />}
                 variant={card.variant}
-                title={card.title}
-                description={card.description}
+                title={title}
+                description={description}
                 actionButton={{
                   href: `${card.actionButton.href}`,
-                  child: `${card.actionButton.child}`,
+                  child: actionButtonChild,
                 }}
               />
             </div>
diff --git a/apps/web/lib/settings/platform/utils.ts b/apps/web/lib/settings/platform/utils.ts
index f91b67ec60..73bf23c903 100644
--- a/apps/web/lib/settings/platform/utils.ts
+++ b/apps/web/lib/settings/platform/utils.ts
@@ -104,4 +104,15 @@ export const helpCards: HelpCardInfo[] = [
       child: "Schedule a call",
     },
   },
+  {
+    icon: "triangle-alert",
+    title: "Report issue",
+    description:
+      "You can submit a ticket on GitHub or upgrade your plan to receive real-time support with developer conferences",
+    variant: "basic",
+    actionButton: {
+      href: "https://github.com/calcom/cal.com/issues/new?template=platform.md",
+      child: "Open Issue",
+    },
+  },
 ];
diff --git a/apps/web/public/static/locales/en/common.json b/apps/web/public/static/locales/en/common.json
index f194e9659d..3798415cc1 100644
--- a/apps/web/public/static/locales/en/common.json
+++ b/apps/web/public/static/locales/en/common.json
@@ -3085,6 +3085,9 @@
   "disable_delegation_credential_description": "Once delegation credential is disabled, organization members who haven’t connected their calendars will need to do so manually.",
   "salesforce_on_cancel_write_to_event": "On cancelled booking, write to event record instead of deleting event",
   "salesforce_on_every_cancellation": "On every cancellation",
+  "report_issue": "Report issue",
+  "report_issue_description": "You can submit a ticket on GitHub or upgrade your plan to receive real-time support with developer conferences",
+  "open_issue": "Open Issue",
   "this_is_your_current_plan": "This is your current plan",
   "per_month": "per month",
   "schedule_a_time": "Schedule a time",