selectAction(action, team?.id as number)}
isPending={deleteTeamMutation.isPending}
hideDropdown={hideDropdown}
diff --git a/packages/features/ee/teams/components/TeamListItem.tsx b/packages/features/ee/teams/components/TeamListItem.tsx
index 3ed23d0461..8e3a344dbf 100644
--- a/packages/features/ee/teams/components/TeamListItem.tsx
+++ b/packages/features/ee/teams/components/TeamListItem.tsx
@@ -30,11 +30,13 @@ import {
} from "@calcom/ui/components/dropdown";
import { showToast } from "@calcom/ui/components/toast";
import { Tooltip } from "@calcom/ui/components/tooltip";
+import { revalidateTeamsList } from "@calcom/web/app/(use-page-wrapper)/(main-nav)/teams/actions";
import { TeamRole } from "./TeamPill";
interface Props {
team: RouterOutputs["viewer"]["teams"]["list"][number];
+ user: RouterOutputs["viewer"]["me"]["get"];
key: number;
onActionSelect: (text: string) => void;
isPending?: boolean;
@@ -46,8 +48,7 @@ export default function TeamListItem(props: Props) {
const searchParams = useCompatSearchParams();
const { t } = useLocale();
const utils = trpc.useUtils();
- const user = trpc.viewer.me.get.useQuery().data;
- const team = props.team;
+ const { team, user } = props;
const showDialog = searchParams?.get("inviteModal") === "true";
const [openMemberInvitationModal, setOpenMemberInvitationModal] = useState(showDialog);
@@ -59,6 +60,7 @@ export default function TeamListItem(props: Props) {
showToast(t("success"), "success");
utils.viewer.teams.get.invalidate();
utils.viewer.teams.list.invalidate();
+ revalidateTeamsList();
utils.viewer.teams.hasTeamPlan.invalidate();
utils.viewer.teams.listInvites.invalidate();
const userOrganizationId = user?.profile?.organization?.id;
diff --git a/packages/features/ee/teams/components/TeamsListing.tsx b/packages/features/ee/teams/components/TeamsListing.tsx
index d1b11a326b..1aac291a26 100644
--- a/packages/features/ee/teams/components/TeamsListing.tsx
+++ b/packages/features/ee/teams/components/TeamsListing.tsx
@@ -1,56 +1,40 @@
-import { useRouter } from "next/navigation";
-import { useEffect, useMemo, useState } from "react";
+"use client";
+import { useRouter, useSearchParams } from "next/navigation";
+import { useEffect, useMemo } from "react";
+
+import SkeletonLoaderTeamList from "@calcom/features/ee/teams/components/SkeletonloaderTeamList";
import { APP_NAME, WEBAPP_URL } from "@calcom/lib/constants";
-import { useCompatSearchParams } from "@calcom/lib/hooks/useCompatSearchParams";
import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { CreationSource } from "@calcom/prisma/enums";
-import { trpc } from "@calcom/trpc/react";
-import { Icon } from "@calcom/ui/components/icon";
-import { Label } from "@calcom/ui/components/form";
-import { Alert } from "@calcom/ui/components/alert";
+import type { RouterOutputs } from "@calcom/trpc/react";
import { Button } from "@calcom/ui/components/button";
import { ButtonGroup } from "@calcom/ui/components/buttonGroup";
import { EmptyScreen } from "@calcom/ui/components/empty-screen";
+import { Label } from "@calcom/ui/components/form";
+import { Icon } from "@calcom/ui/components/icon";
import { showToast } from "@calcom/ui/components/toast";
import { UpgradeTip } from "../../../tips";
-import SkeletonLoaderTeamList from "./SkeletonloaderTeamList";
import TeamList from "./TeamList";
-export function TeamsListing() {
- const searchParams = useCompatSearchParams();
- const token = searchParams?.get("token");
+type TeamsListingProps = {
+ user: RouterOutputs["viewer"]["me"]["get"];
+ teams: RouterOutputs["viewer"]["teams"]["list"];
+ teamNameFromInvite: string | null;
+ errorMsgFromInvite: string | null;
+};
+
+export function TeamsListing({
+ user,
+ teams: data,
+ teamNameFromInvite,
+ errorMsgFromInvite,
+}: TeamsListingProps) {
+ const searchParams = useSearchParams();
+ const token = searchParams.get("token");
const { t } = useLocale();
- const trpcContext = trpc.useUtils();
const router = useRouter();
- const [inviteTokenChecked, setInviteTokenChecked] = useState(false);
-
- const { data, isPending, error } = trpc.viewer.teams.list.useQuery(
- {
- includeOrgs: true,
- },
- {
- enabled: inviteTokenChecked,
- }
- );
-
- const { data: user } = trpc.viewer.me.get.useQuery();
-
- const { mutate: inviteMemberByToken } = trpc.viewer.teams.inviteMemberByToken.useMutation({
- onSuccess: (teamName) => {
- trpcContext.viewer.teams.list.invalidate();
- showToast(t("team_invite_received", { teamName }), "success");
- },
- onError: (e) => {
- showToast(e.message, "error");
- },
- onSettled: () => {
- setInviteTokenChecked(true);
- },
- });
-
const teams = useMemo(() => data?.filter((m) => m.accepted && !m.isOrganization) || [], [data]);
const teamInvites = useMemo(() => data?.filter((m) => !m.accepted && !m.isOrganization) || [], [data]);
@@ -101,58 +85,63 @@ export function TeamsListing() {
];
useEffect(() => {
- if (!router) return;
- if (token) inviteMemberByToken({ token, creationSource: CreationSource.WEBAPP });
- else setInviteTokenChecked(true);
- }, [router, inviteMemberByToken, setInviteTokenChecked, token]);
+ if (!token) {
+ return;
+ }
- if (isPending || !inviteTokenChecked) {
- return ;
- }
+ if (teamNameFromInvite) {
+ showToast(t("team_invite_received", { teamName: teamNameFromInvite }), "success");
+ return;
+ }
+
+ if (errorMsgFromInvite) {
+ showToast(errorMsgFromInvite, "error");
+ return;
+ }
+ }, []);
return (
<>
- {!!error && }
-
{organizationInvites.length > 0 && (
-
+
)}
{teamInvites.length > 0 && (
-
+
)}
-
-
-
-
-
-
- ) : (
- {t("org_admins_can_create_new_teams")}
- )
- }>
- {teams.length > 0 ? (
-
- ) : (
+ {teams.length > 0 && }
+
+ {teams.length === 0 && (
+
+
+
+
+
+
+ ) : (
+ {t("org_admins_can_create_new_teams")}
+ )
+ }
+ isParentLoading={}>
}
/>
- )}
-
+
+ )}
{t("tip_username_plus")}
diff --git a/packages/features/ee/teams/components/TeamsUpgradeBanner.tsx b/packages/features/ee/teams/components/TeamsUpgradeBanner.tsx
index 9a7f999423..74008702ca 100644
--- a/packages/features/ee/teams/components/TeamsUpgradeBanner.tsx
+++ b/packages/features/ee/teams/components/TeamsUpgradeBanner.tsx
@@ -1,10 +1,12 @@
+"use client";
+
import { useRouter } from "next/navigation";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { trpc } from "@calcom/trpc/react";
import type { RouterOutputs } from "@calcom/trpc/react";
-import { TopBanner } from "@calcom/ui/components/top-banner";
import { showToast } from "@calcom/ui/components/toast";
+import { TopBanner } from "@calcom/ui/components/top-banner";
export type TeamsUpgradeBannerProps = {
data: RouterOutputs["viewer"]["me"]["getUserTopBanners"]["teamUpgradeBanner"];
diff --git a/packages/features/ee/teams/pages/team-listing-view.tsx b/packages/features/ee/teams/pages/team-listing-view.tsx
deleted file mode 100644
index 112eff6a52..0000000000
--- a/packages/features/ee/teams/pages/team-listing-view.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-"use client";
-
-import { TeamsListing } from "../components";
-
-const TeamListingView = () => {
- return ;
-};
-
-export default TeamListingView;
diff --git a/packages/features/ee/teams/pages/team-profile-view.tsx b/packages/features/ee/teams/pages/team-profile-view.tsx
index 784126e62d..e55d802d17 100644
--- a/packages/features/ee/teams/pages/team-profile-view.tsx
+++ b/packages/features/ee/teams/pages/team-profile-view.tsx
@@ -42,6 +42,7 @@ import {
} from "@calcom/ui/components/skeleton";
import { showToast } from "@calcom/ui/components/toast";
import { Tooltip } from "@calcom/ui/components/tooltip";
+import { revalidateTeamsList } from "@calcom/web/app/(use-page-wrapper)/(main-nav)/teams/actions";
const regex = new RegExp("^[a-zA-Z0-9-]*$");
@@ -123,6 +124,7 @@ const ProfileView = () => {
const deleteTeamMutation = trpc.viewer.teams.delete.useMutation({
async onSuccess() {
await utils.viewer.teams.list.invalidate();
+ revalidateTeamsList();
await utils.viewer.eventTypes.getUserEventGroups.invalidate();
await utils.viewer.eventTypes.getByViewer.invalidate();
showToast(t("your_team_disbanded_successfully"), "success");
@@ -138,6 +140,7 @@ const ProfileView = () => {
async onSuccess() {
await utils.viewer.teams.get.invalidate();
await utils.viewer.teams.list.invalidate();
+ revalidateTeamsList();
await utils.viewer.eventTypes.invalidate();
showToast(t("success"), "success");
},
@@ -276,6 +279,7 @@ const TeamProfileForm = ({ team, teamId }: TeamProfileFormProps) => {
await utils.viewer.eventTypes.getUserEventGroups.invalidate();
// TODO: Not all changes require list invalidation
await utils.viewer.teams.list.invalidate();
+ revalidateTeamsList();
showToast(t("your_team_updated_successfully"), "success");
},
});
diff --git a/packages/features/timezone-buddy/components/AvailabilitySliderTable.tsx b/packages/features/timezone-buddy/components/AvailabilitySliderTable.tsx
index ed1d54e300..5792051f0e 100644
--- a/packages/features/timezone-buddy/components/AvailabilitySliderTable.tsx
+++ b/packages/features/timezone-buddy/components/AvailabilitySliderTable.tsx
@@ -47,7 +47,7 @@ function UpgradeTeamTip() {
-
{t(title)}
-
{t(description)}
+
{title}
+
{description}
{buttons}