fix: dont link to org url inside embeds (#13668)

* dont link to org url inside embeds

* Add comment

* Fix type issue

---------

Co-authored-by: Hariom <hariombalhara@gmail.com>

packages/ui/components/avatar/Avatar.tsx

@@ -15,7 +15,7 @@ export type AvatarProps = {
   imageSrc?: Maybe<string>;
   title?: string;
   alt: string;
-  href?: string;
+  href?: string | null;
   fallback?: React.ReactNode;
   accepted?: boolean;
   asChild?: boolean; // Added to ignore the outer span on the fallback component - messes up styling

packages/ui/components/avatar/AvatarGroup.tsx

@@ -8,7 +8,7 @@ export type AvatarGroupProps = {
     image: string;
     title?: string;
     alt?: string;
-    href?: string;
+    href?: string | null;
   }[];
   className?: string;
   truncateAfter?: number;

packages/ui/components/avatar/UserAvatarGroupWithOrg.tsx

@@ -1,3 +1,4 @@
+import { useIsEmbed } from "@calcom/embed-core/embed-iframe";
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { getUserAvatarUrl } from "@calcom/lib/getAvatarUrl";
 import { getBookerBaseUrlSync } from "@calcom/lib/getBookerUrl/client";
@@ -15,9 +16,12 @@ type UserAvatarProps = Omit<React.ComponentProps<typeof AvatarGroup>, "items"> &
 
 export function UserAvatarGroupWithOrg(props: UserAvatarProps) {
   const { users, organization, ...rest } = props;
+  const isEmbed = useIsEmbed();
+
   const items = [
     {
-      href: getBookerBaseUrlSync(organization.slug),
+      // We don't want booker to be able to see the list of other users or teams inside the embed
+      href: isEmbed ? null : getBookerBaseUrlSync(organization.slug),
       image: `${WEBAPP_URL}/team/${organization.slug}/avatar.png`,
       alt: organization.name || undefined,
       title: organization.name,