change useHasTeamPlan hook to useHasPaidPlan (#6699)

Co-authored-by: CarinaWolli <wollencarina@gmail.com>

apps/web/pages/settings/my-account/appearance.tsx

@@ -4,7 +4,7 @@ import { Controller, useForm } from "react-hook-form";
 
 import { getLayout } from "@calcom/features/settings/layouts/SettingsLayout";
 import { APP_NAME } from "@calcom/lib/constants";
-import { useHasTeamPlan } from "@calcom/lib/hooks/useHasTeamPlan";
+import { useHasPaidPlan } from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { trpc } from "@calcom/trpc/react";
 import {
@@ -51,7 +51,7 @@ const AppearanceView = () => {
   const utils = trpc.useContext();
   const { data: user, isLoading } = trpc.viewer.me.useQuery();
 
-  const { isLoading: isTeamPlanStatusLoading, hasTeamPlan } = useHasTeamPlan();
+  const { isLoading: isTeamPlanStatusLoading, hasPaidPlan } = useHasPaidPlan();
 
   const formMethods = useForm({
     defaultValues: {
@@ -191,11 +191,11 @@ const AppearanceView = () => {
               <div className="flex-none">
                 <Switch
                   id="hideBranding"
-                  disabled={!hasTeamPlan}
+                  disabled={!hasPaidPlan}
                   onCheckedChange={(checked) =>
                     formMethods.setValue("hideBranding", checked, { shouldDirty: true })
                   }
-                  checked={hasTeamPlan ? value : false}
+                  checked={hasPaidPlan ? value : false}
                 />
               </div>
             </div>

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

@@ -6,7 +6,7 @@ import Shell, { ShellMain } from "@calcom/features/shell/Shell";
 import { UpgradeTip } from "@calcom/features/tips";
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import useApp from "@calcom/lib/hooks/useApp";
-import { useHasTeamPlan } from "@calcom/lib/hooks/useHasTeamPlan";
+import { useHasPaidPlan } from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { trpc } from "@calcom/trpc/react";
 import { AppGetServerSidePropsContext, AppPrisma, AppUser } from "@calcom/types/AppGetServerSideProps";
@@ -49,7 +49,7 @@ export default function RoutingForms({
   appUrl,
 }: inferSSRProps<typeof getServerSideProps> & { appUrl: string }) {
   const { t } = useLocale();
-  const { hasTeamPlan } = useHasTeamPlan();
+  const { hasPaidPlan } = useHasPaidPlan();
 
   const { data: forms, isLoading } = trpc.viewer.appRoutingForms.forms.useQuery(undefined, {
     initialData: forms_,
@@ -105,7 +105,7 @@ export default function RoutingForms({
   return (
     <ShellMain
       heading="Routing Forms"
-      CTA={hasTeamPlan && <NewFormButton />}
+      CTA={hasPaidPlan && <NewFormButton />}
       subtitle={t("routing_forms_description")}>
       <UpgradeTip
         dark

packages/features/ee/video/ViewRecordingsDialog.tsx

@@ -2,7 +2,7 @@ import { useState } from "react";
 
 import dayjs from "@calcom/dayjs";
 import LicenseRequired from "@calcom/features/ee/common/components/v2/LicenseRequired";
-import useHasTeamPlan from "@calcom/lib/hooks/useHasTeamPlan";
+import useHasPaidPlan from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { RecordingItemSchema } from "@calcom/prisma/zod-utils";
 import { RouterOutputs, trpc } from "@calcom/trpc/react";
@@ -66,7 +66,7 @@ export const ViewRecordingsDialog = (props: IViewRecordingsDialog) => {
   const { isOpenDialog, setIsOpenDialog, booking, timeFormat } = props;
   const [downloadingRecordingId, setRecordingId] = useState<string | null>(null);
 
-  const { hasTeamPlan, isLoading: isTeamPlanStatusLoading } = useHasTeamPlan();
+  const { hasPaidPlan, isLoading: isTeamPlanStatusLoading } = useHasPaidPlan();
 
   const roomName =
     booking?.references?.find((reference: PartialReference) => reference.type === "daily_video")?.meetingId ??
@@ -127,7 +127,7 @@ export const ViewRecordingsDialog = (props: IViewRecordingsDialog) => {
                           {convertSecondsToMs(recording.duration)}
                         </p>
                       </div>
-                      {hasTeamPlan ? (
+                      {hasPaidPlan ? (
                         <Button
                           StartIcon={FiDownload}
                           className="ml-4 lg:ml-0"

packages/features/shell/TeamInviteBadge.tsx

@@ -1,4 +1,4 @@
-import { useTeamInvites } from "@calcom/lib/hooks/useHasTeamPlan";
+import { useTeamInvites } from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Badge } from "@calcom/ui";
 

packages/features/tips/UpgradeTip.tsx

@@ -2,7 +2,7 @@ import { useMemo } from "react";
 import type { ReactNode } from "react";
 
 import { classNames } from "@calcom/lib";
-import { useHasTeamPlan } from "@calcom/lib/hooks/useHasTeamPlan";
+import { useHasPaidPlan } from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import isCalcom from "@calcom/lib/isCalcom";
 import { EmptyScreen } from "@calcom/ui";
@@ -29,9 +29,9 @@ export function UpgradeTip({
   isParentLoading?: ReactNode;
 }) {
   const { t } = useLocale();
-  const { isLoading, hasTeamPlan } = useHasTeamPlan();
+  const { isLoading, hasPaidPlan } = useHasPaidPlan();
 
-  if (hasTeamPlan) return children;
+  if (hasPaidPlan) return children;
 
   if (isParentLoading || isLoading) return <>{isParentLoading}</>;
 

packages/lib/hooks/useHasPaidPlan.ts

@@ -0,0 +1,25 @@
+import { trpc } from "@calcom/trpc/react";
+
+import hasKeyInMetadata from "../hasKeyInMetadata";
+
+export function useHasPaidPlan() {
+  const { data: hasTeamPlan, isLoading: isLoadingTeamQuery } = trpc.viewer.teams.hasTeamPlan.useQuery();
+
+  const { data: user, isLoading: isLoadingUserQuery } = trpc.viewer.me.useQuery();
+
+  const isLoading = isLoadingTeamQuery || isLoadingUserQuery;
+
+  const isCurrentUsernamePremium = user && user.metadata && hasKeyInMetadata(user, "isPremium");
+
+  const hasPaidPlan = hasTeamPlan?.hasTeamPlan || isCurrentUsernamePremium;
+
+  return { isLoading, hasPaidPlan };
+}
+
+export function useTeamInvites() {
+  const listInvites = trpc.viewer.teams.listInvites.useQuery();
+
+  return { isLoading: listInvites.isLoading, listInvites: listInvites.data };
+}
+
+export default useHasPaidPlan;

packages/lib/hooks/useHasTeamPlan.ts

@@ -1,15 +0,0 @@
-import { trpc } from "@calcom/trpc/react";
-
-export function useHasTeamPlan() {
-  const hasTeam = trpc.viewer.teams.hasTeamPlan.useQuery();
-
-  return { isLoading: hasTeam.isLoading, hasTeamPlan: hasTeam.data?.hasTeamPlan || false };
-}
-
-export function useTeamInvites() {
-  const listInvites = trpc.viewer.teams.listInvites.useQuery();
-
-  return { isLoading: listInvites.isLoading, listInvites: listInvites.data };
-}
-
-export default useHasTeamPlan;

packages/ui/components/badge/UpgradeTeamsBadge.tsx

@@ -1,6 +1,6 @@
 import Link from "next/link";
 
-import { useHasTeamPlan } from "@calcom/lib/hooks/useHasTeamPlan";
+import { useHasPaidPlan } from "@calcom/lib/hooks/useHasPaidPlan";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 
 import { Tooltip } from "../tooltip";
@@ -8,9 +8,9 @@ import { Badge } from "./Badge";
 
 export const UpgradeTeamsBadge = function UpgradeTeamsBadge() {
   const { t } = useLocale();
-  const { hasTeamPlan } = useHasTeamPlan();
+  const { hasPaidPlan } = useHasPaidPlan();
 
-  if (hasTeamPlan) return null;
+  if (hasPaidPlan) return null;
 
   return (
     <Tooltip content={t("upgrade_to_enable_feature")}>