From 31cd77345da40525e70d4f1e489e6930f8df27dd Mon Sep 17 00:00:00 2001
From: Tushar Bhatt <95581504+TusharBhatt1@users.noreply.github.com>
Date: Wed, 5 Mar 2025 21:11:54 +0530
Subject: [PATCH] all changes (#19720)

---
 .../components/RoutingNavBar.tsx              | 22 +++++++++++++++----
 .../incomplete-booking/[...appPages].tsx      | 11 +---------
 2 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/packages/app-store/routing-forms/components/RoutingNavBar.tsx b/packages/app-store/routing-forms/components/RoutingNavBar.tsx
index 57276c8fd0..fdba6a992b 100644
--- a/packages/app-store/routing-forms/components/RoutingNavBar.tsx
+++ b/packages/app-store/routing-forms/components/RoutingNavBar.tsx
@@ -1,8 +1,10 @@
 import type { Dispatch, SetStateAction } from "react";
 import type { UseFormReturn } from "react-hook-form";
 
+import { trpc } from "@calcom/trpc";
 import { HorizontalTabs } from "@calcom/ui";
 
+import { enabledIncompleteBookingApps } from "../lib/enabledIncompleteBookingApps";
 import type { getSerializableForm } from "../lib/getSerializableForm";
 import type { RoutingFormWithResponseCount } from "./SingleForm";
 
@@ -17,6 +19,14 @@ export default function RoutingNavBar({
   hookForm: UseFormReturn<RoutingFormWithResponseCount>;
   setShowInfoLostDialog: Dispatch<SetStateAction<boolean>>;
 }) {
+  const { data } = trpc.viewer.appRoutingForms.getIncompleteBookingSettings.useQuery({
+    formId: form.id,
+  });
+
+  const showIncompleteBookingTab = data?.credentials.some((credential) =>
+    enabledIncompleteBookingApps.includes(credential?.appId ?? "")
+  );
+
   const tabs = [
     {
       name: "Form",
@@ -38,10 +48,14 @@ export default function RoutingNavBar({
       target: "_blank",
       href: `${appUrl}/reporting/${form?.id}`,
     },
-    {
-      name: "Incomplete Booking",
-      href: `${appUrl}/incomplete-booking/${form?.id}`,
-    },
+    ...(showIncompleteBookingTab
+      ? [
+          {
+            name: "Incomplete Booking",
+            href: `${appUrl}/incomplete-booking/${form?.id}`,
+          },
+        ]
+      : []),
   ];
   return (
     <div className="mb-4">
diff --git a/packages/app-store/routing-forms/pages/incomplete-booking/[...appPages].tsx b/packages/app-store/routing-forms/pages/incomplete-booking/[...appPages].tsx
index ed81dd0078..7ade5b3582 100644
--- a/packages/app-store/routing-forms/pages/incomplete-booking/[...appPages].tsx
+++ b/packages/app-store/routing-forms/pages/incomplete-booking/[...appPages].tsx
@@ -16,7 +16,6 @@ import SingleForm, {
   getServerSidePropsForSingleFormView as getServerSideProps,
 } from "../../components/SingleForm";
 import type { RoutingFormWithResponseCount } from "../../components/SingleForm";
-import { enabledIncompleteBookingApps } from "../../lib/enabledIncompleteBookingApps";
 
 function Page({ form }: { form: RoutingFormWithResponseCount }) {
   const { t } = useLocale();
@@ -94,14 +93,6 @@ function Page({ form }: { form: RoutingFormWithResponseCount }) {
   if (isLoading) {
     return <div>Loading...</div>;
   }
-
-  // Check to see if the user has any compatible credentials
-  if (
-    !data?.credentials.some((credential) => enabledIncompleteBookingApps.includes(credential?.appId ?? ""))
-  ) {
-    return <div>No apps installed that support this feature</div>;
-  }
-
   return (
     <>
       <div className="bg-default border-subtle rounded-md border p-8">
@@ -294,7 +285,7 @@ function Page({ form }: { form: RoutingFormWithResponseCount }) {
               },
               actionType: IncompleteBookingActionType.SALESFORCE,
               enabled: salesforceActionEnabled,
-              credentialId: selectedCredential?.value ?? data.credentials[0].id,
+              credentialId: selectedCredential?.value ?? data?.credentials[0].id,
             });
           }}>
           {t("save")}