refactor: Remove App Store's Type Dependency on Trpc Package (#23640)

* remove trpc type interface

* refactors

* refactors

packages/app-store/AppDependencyComponent.tsx

@@ -4,7 +4,6 @@ import Link from "next/link";
 
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import type { RouterOutputs } from "@calcom/trpc/react";
 import classNames from "@calcom/ui/classNames";
 import { Icon } from "@calcom/ui/components/icon";
 
@@ -13,7 +12,7 @@ export const AppDependencyComponent = ({
   dependencyData,
 }: {
   appName: string;
-  dependencyData: RouterOutputs["viewer"]["apps"]["queryForDependencies"];
+  dependencyData?: { name: string; slug: string; installed: boolean }[];
 }) => {
   const { t } = useLocale();
 

packages/app-store/_components/AppCard.tsx

@@ -4,14 +4,13 @@ import Link from "next/link";
 import { useAppContextWithSchema } from "@calcom/app-store/EventTypeAppContext";
 import { useIsPlatform } from "@calcom/atoms/hooks/useIsPlatform";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import type { RouterOutputs } from "@calcom/trpc/react";
 import classNames from "@calcom/ui/classNames";
 import { Button } from "@calcom/ui/components/button";
 import { Switch } from "@calcom/ui/components/form";
 import { Icon } from "@calcom/ui/components/icon";
 import { Section } from "@calcom/ui/components/section";
 
-import type { CredentialOwner } from "../types";
+import type { AppCardApp } from "../types";
 import OmniInstallAppButton from "./OmniInstallAppButton";
 
 export default function AppCard({
@@ -27,9 +26,7 @@ export default function AppCard({
   hideSettingsIcon = false,
   hideAppCardOptions = false,
 }: {
-  app: RouterOutputs["viewer"]["apps"]["integrations"]["items"][number] & {
-    credentialOwner?: CredentialOwner;
-  };
+  app: AppCardApp;
   description?: React.ReactNode;
   switchChecked?: boolean;
   switchOnClick?: (e: boolean) => void;

packages/app-store/_components/EventTypeAppCardInterface.tsx

@@ -4,20 +4,15 @@ import type { GetAppData, SetAppData } from "@calcom/app-store/EventTypeAppConte
 import EventTypeAppContext from "@calcom/app-store/EventTypeAppContext";
 import { EventTypeAddonMap } from "@calcom/app-store/apps.browser.generated";
 import type { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils";
-import type { RouterOutputs } from "@calcom/trpc/react";
 import { ErrorBoundary } from "@calcom/ui/components/errorBoundary";
 
-import type { EventTypeAppCardComponentProps, CredentialOwner } from "../types";
+import type { EventTypeAppCardComponentProps, AppCardApp } from "../types";
 import { DynamicComponent } from "./DynamicComponent";
 
-export type EventTypeApp = RouterOutputs["viewer"]["apps"]["integrations"]["items"][number] & {
-  credentialOwner?: CredentialOwner;
-};
-
 export type EventTypeForAppCard = EventTypeAppCardComponentProps["eventType"];
 
 export const EventTypeAppCard = (props: {
-  app: EventTypeApp;
+  app: AppCardApp;
   eventType: EventTypeForAppCard;
   getAppData: GetAppData;
   setAppData: SetAppData;

packages/app-store/_components/eventTypeAppCardInterface.test.tsx

@@ -1,9 +1,7 @@
 import { render, screen } from "@testing-library/react";
-import type { CredentialOwner } from "types";
+import type { AppCardApp } from "types";
 import { vi } from "vitest";
 
-import type { RouterOutputs } from "@calcom/trpc";
-
 import { DynamicComponent } from "./DynamicComponent";
 import { EventTypeAppCard } from "./EventTypeAppCardInterface";
 
@@ -26,9 +24,7 @@ const mockProps = {
     name: "TestApp",
     slug: "testapp",
     credentialOwner: {},
-  } as RouterOutputs["viewer"]["apps"]["integrations"]["items"][number] & {
-    credentialOwner?: CredentialOwner;
-  },
+  } as AppCardApp,
   eventType: {},
   getAppData: getAppDataMock,
   setAppData: setAppDataMock,

packages/app-store/_utils/useIsAppEnabled.ts

@@ -16,7 +16,7 @@ function useIsAppEnabled(app: EventTypeAppCardApp) {
     const credentialId = getAppData("credentialId");
     const isAppEnabledForCredential =
       isAppEnabled &&
-      (app.userCredentialIds.some((id) => id === credentialId) ||
+      (app.userCredentialIds.some((id: number) => id === credentialId) ||
         app.credentialOwner.credentialId === credentialId);
     return isAppEnabledForCredential ?? false; // Default to false if undefined
   });

packages/app-store/routing-forms/pages/route-builder/[...appPages].tsx

@@ -13,10 +13,10 @@ import type { z } from "zod";
 
 import { useOrgBranding } from "@calcom/features/ee/organizations/context/provider";
 import { areTheySiblingEntities } from "@calcom/lib/entityPermissionUtils.shared";
+import type { EventTypesByViewer } from "@calcom/lib/event-types/getEventTypesByViewer";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { buildEmptyQueryValue, raqbQueryValueUtils } from "@calcom/lib/raqb/raqbUtils";
 import { SchedulingType } from "@calcom/prisma/enums";
-import type { RouterOutputs } from "@calcom/trpc/react";
 import { trpc } from "@calcom/trpc/react";
 import type { inferSSRProps } from "@calcom/types/inferSSRProps";
 import classNames from "@calcom/ui/classNames";
@@ -63,8 +63,6 @@ import type {
 import type { zodRoutes } from "../../zod";
 import { RouteActionType } from "../../zod";
 
-type EventTypesByGroup = RouterOutputs["viewer"]["eventTypes"]["getByViewer"];
-
 type Form = inferSSRProps<typeof getServerSideProps>["form"];
 
 type SetRoute = (id: string, route: Partial<EditFormRoute>) => void;
@@ -141,7 +139,7 @@ const buildEventsData = ({
   form,
   route,
 }: {
-  eventTypesByGroup: EventTypesByGroup | undefined;
+  eventTypesByGroup: EventTypesByViewer | undefined;
   form: Form;
   route: EditFormRoute;
 }) => {
@@ -372,7 +370,7 @@ const Route = ({
   moveDown?: { fn: () => void; check: () => boolean } | null;
   appUrl: string;
   disabled?: boolean;
-  eventTypesByGroup: EventTypesByGroup;
+  eventTypesByGroup: EventTypesByViewer;
   attributes?: Attribute[];
   cardOptions?: {
     collapsible?: boolean;
@@ -1129,7 +1127,7 @@ const Routes = ({
   hookForm: UseFormReturn<RoutingFormWithResponseCount>;
   appUrl: string;
   attributes?: Attribute[];
-  eventTypesByGroup: EventTypesByGroup;
+  eventTypesByGroup: EventTypesByViewer;
 }) => {
   const { routes: serializedRoutes } = hookForm.getValues();
   const { t } = useLocale();

packages/app-store/types.d.ts

@@ -1,8 +1,8 @@
 import type React from "react";
 import type { z } from "zod";
 
+import type { ConnectedApps } from "@calcom/lib/getConnectedApps";
 import type { EventTypeFormMetadataSchema } from "@calcom/prisma/zod-utils";
-import type { RouterOutputs } from "@calcom/trpc/react";
 import type { ButtonProps } from "@calcom/ui/components/button";
 
 export type IntegrationOAuthCallbackState = {
@@ -22,8 +22,11 @@ export type CredentialOwner = {
   readOnly?: boolean;
 };
 
-export type EventTypeAppCardApp = RouterOutputs["viewer"]["apps"]["integrations"]["items"][number] & {
+export type AppCardApp = ConnectedApps[number] & {
   credentialOwner?: CredentialOwner;
+};
+
+export type EventTypeAppCardApp = AppCardApp & {
   credentialIds?: number[];
 };
 

packages/features/apps/components/AppList.tsx

@@ -3,7 +3,7 @@ import { useCallback, useState } from "react";
 import { InstallAppButton } from "@calcom/app-store/InstallAppButton";
 import { AppSettings } from "@calcom/app-store/_components/AppSettings";
 import { getLocationFromApp, type EventLocationType } from "@calcom/app-store/locations";
-import type { CredentialOwner } from "@calcom/app-store/types";
+import type { AppCardApp } from "@calcom/app-store/types";
 import AppListCard from "@calcom/features/apps/components/AppListCard";
 import type { UpdateUsersDefaultConferencingAppParams } from "@calcom/features/apps/components/AppSetDefaultLinkDialog";
 import { AppSetDefaultLinkDialog } from "@calcom/features/apps/components/AppSetDefaultLinkDialog";
@@ -69,13 +69,7 @@ export const AppList = ({
     showToast("Default app updated successfully", "success");
   }, []);
 
-  const ChildAppCard = ({
-    item,
-  }: {
-    item: RouterOutputs["viewer"]["apps"]["integrations"]["items"][number] & {
-      credentialOwner?: CredentialOwner;
-    };
-  }) => {
+  const ChildAppCard = ({ item }: { item: AppCardApp }) => {
     const appSlug = item?.slug;
     const appIsDefault =
       appSlug === defaultConferencingApp?.appSlug ||