chore: app router - /team, /org, /[user] booking pages (excl. embeds)

.env.example

@@ -362,7 +362,6 @@ APP_ROUTER_APPS_CATEGORIES_ENABLED=0
 # whether we redirect to the future/apps/categories/[category] from /apps/categories/[category] or not
 APP_ROUTER_APPS_CATEGORIES_CATEGORY_ENABLED=0
 APP_ROUTER_APPS_ENABLED=0
-APP_ROUTER_TEAM_ENABLED=0
 APP_ROUTER_AUTH_FORGOT_PASSWORD_ENABLED=0
 APP_ROUTER_AUTH_LOGIN_ENABLED=0
 APP_ROUTER_AUTH_LOGOUT_ENABLED=0

apps/web/abTest/middlewareFactory.ts

@@ -20,7 +20,6 @@ const ROUTES: [URLPattern, boolean][] = [
   ["/auth/error", process.env.APP_ROUTER_AUTH_ERROR_ENABLED === "1"] as const,
   ["/auth/platform/:path*", process.env.APP_ROUTER_AUTH_PLATFORM_ENABLED === "1"] as const,
   ["/auth/oauth2/:path*", process.env.APP_ROUTER_AUTH_OAUTH2_ENABLED === "1"] as const,
-  ["/team", process.env.APP_ROUTER_TEAM_ENABLED === "1"] as const,
 ].map(([pathname, enabled]) => [
   new URLPattern({
     pathname,

apps/web/app/future/[user]/[type]/page.tsx → apps/web/app/[user]/[type]/page.tsx

@@ -1,10 +1,10 @@
 import { withAppDirSsr } from "app/WithAppDirSsr";
 import type { PageProps } from "app/_types";
-import { _generateMetadata } from "app/_utils";
+import { generateMeetingMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 import { headers, cookies } from "next/headers";
 
-import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
+import { getOrgFullOrigin, orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { EventRepository } from "@calcom/lib/server/repository/event";
 
 import { buildLegacyCtx } from "@lib/buildLegacyCtx";
@@ -18,7 +18,7 @@ export const generateMetadata = async ({ params, searchParams }: PageProps) => {
   const legacyCtx = buildLegacyCtx(headers(), cookies(), params, searchParams);
   const props = await getData(legacyCtx);
 
-  const { booking, user: username, slug: eventSlug } = props;
+  const { booking, user: username, slug: eventSlug, isSEOIndexable, eventData, isBrandingHidden } = props;
   const rescheduleUid = booking?.uid;
   const { currentOrgDomain, isValidOrgDomain } = orgDomainConfig(legacyCtx.req, legacyCtx.params?.orgSlug);
 
@@ -31,12 +31,35 @@ export const generateMetadata = async ({ params, searchParams }: PageProps) => {
   });
 
   const profileName = event?.profile?.name ?? "";
+  const profileImage = event?.profile.image;
   const title = event?.title ?? "";
 
-  return await _generateMetadata(
+  const meeting = {
+    title,
+    profile: { name: profileName, image: profileImage },
+    users: [
+      ...(event?.users || []).map((user) => ({
+        name: `${user.name}`,
+        username: `${user.username}`,
+      })),
+    ],
+  };
+
+  const metadata = await generateMeetingMetadata(
+    meeting,
     (t) => `${rescheduleUid && !!booking ? t("reschedule") : ""} ${title} | ${profileName}`,
-    (t) => `${rescheduleUid ? t("reschedule") : ""} ${title}`
+    (t) => `${rescheduleUid ? t("reschedule") : ""} ${title}`,
+    isBrandingHidden,
+    getOrgFullOrigin(eventData?.entity.orgSlug ?? null)
   );
+
+  return {
+    ...metadata,
+    robots: {
+      index: !(event?.hidden || !isSEOIndexable),
+      follow: !(event?.hidden || !isSEOIndexable),
+    },
+  };
 };
 const getData = withAppDirSsr<LegacyPageProps>(getServerSideProps);
 

apps/web/app/[user]/page.tsx

@@ -0,0 +1,55 @@
+import { withAppDirSsr } from "app/WithAppDirSsr";
+import type { PageProps } from "app/_types";
+import { generateMeetingMetadata } from "app/_utils";
+import { WithLayout } from "app/layoutHOC";
+import { headers, cookies } from "next/headers";
+
+import { getOrgFullOrigin } from "@calcom/features/ee/organizations/lib/orgDomains";
+import { UserRepository } from "@calcom/lib/server/repository/user";
+
+import { buildLegacyCtx } from "@lib/buildLegacyCtx";
+
+import { getServerSideProps } from "@server/lib/[user]/getServerSideProps";
+
+import type { PageProps as LegacyPageProps } from "~/users/views/users-public-view";
+import LegacyPage from "~/users/views/users-public-view";
+
+export const generateMetadata = async ({ params, searchParams }: PageProps) => {
+  const props = await getData(buildLegacyCtx(headers(), cookies(), params, searchParams));
+
+  const { profile, markdownStrippedBio, isOrgSEOIndexable, entity } = props;
+  const avatarUrl = await UserRepository.getAvatarUrl(profile.id);
+  const meeting = {
+    title: markdownStrippedBio,
+    profile: { name: `${profile.name}`, image: avatarUrl },
+    users: [
+      {
+        username: `${profile.username ?? ""}`,
+        name: `${profile.name ?? ""}`,
+      },
+    ],
+  };
+
+  const metadata = await generateMeetingMetadata(
+    meeting,
+    () => profile.name,
+    () => markdownStrippedBio,
+    false,
+    getOrgFullOrigin(entity.orgSlug ?? null)
+  );
+
+  const isOrg = !!profile?.organization;
+  const allowSEOIndexing =
+    (!isOrg && profile.allowSEOIndexing) || (isOrg && isOrgSEOIndexable && profile.allowSEOIndexing);
+
+  return {
+    ...metadata,
+    robots: {
+      index: allowSEOIndexing,
+      follow: allowSEOIndexing,
+    },
+  };
+};
+
+const getData = withAppDirSsr<LegacyPageProps>(getServerSideProps);
+export default WithLayout({ getData, Page: LegacyPage })<"P">;

apps/web/app/_utils.tsx

@@ -3,7 +3,8 @@ import i18next from "i18next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import { headers } from "next/headers";
 
-import { constructGenericImage } from "@calcom/lib/OgImages";
+import type { MeetingImageProps } from "@calcom/lib/OgImages";
+import { constructGenericImage, constructMeetingImage } from "@calcom/lib/OgImages";
 import { IS_CALCOM, WEBAPP_URL, APP_NAME, SEO_IMG_OGIMG, CAL_URL } from "@calcom/lib/constants";
 import { buildCanonical } from "@calcom/lib/next-seo.config";
 import { truncateOnWord } from "@calcom/lib/text";
@@ -103,3 +104,22 @@ export const _generateMetadata = async (
     },
   };
 };
+
+export const generateMeetingMetadata = async (
+  meeting: MeetingImageProps,
+  getTitle: (t: TFunction<string, undefined>) => string,
+  getDescription: (t: TFunction<string, undefined>) => string,
+  hideBranding?: boolean,
+  origin?: string
+) => {
+  const metadata = await _generateMetadataWithoutImage(getTitle, getDescription, hideBranding, origin);
+  const image = SEO_IMG_OGIMG + constructMeetingImage(meeting);
+
+  return {
+    ...metadata,
+    openGraph: {
+      ...metadata.openGraph,
+      images: [image],
+    },
+  };
+};

apps/web/app/d/[link]/[slug]/page.tsx

@@ -17,7 +17,7 @@ export const generateMetadata = async ({ params, searchParams }: _PageProps) =>
   const legacyCtx = buildLegacyCtx(headers(), cookies(), params, searchParams);
   const pageProps = await getData(legacyCtx);
 
-  const { booking, user: username, slug: eventSlug, isTeamEvent } = pageProps;
+  const { booking, user: username, slug: eventSlug, isTeamEvent, isBrandingHidden } = pageProps;
   const rescheduleUid = booking?.uid;
   const { currentOrgDomain, isValidOrgDomain } = orgDomainConfig(legacyCtx.req);
   const org = isValidOrgDomain ? currentOrgDomain : null;
@@ -34,7 +34,8 @@ export const generateMetadata = async ({ params, searchParams }: _PageProps) =>
   const title = event?.title ?? "";
   return await _generateMetadata(
     (t) => `${rescheduleUid && !!booking ? t("reschedule") : ""} ${title} | ${profileName}`,
-    (t) => `${rescheduleUid ? t("reschedule") : ""} ${title}`
+    (t) => `${rescheduleUid ? t("reschedule") : ""} ${title}`,
+    isBrandingHidden
   );
 };
 

apps/web/app/layout.tsx

@@ -26,7 +26,10 @@ export const generateMetadata = () => prepareRootMetadata();
 const getInitialProps = async (url: string) => {
   const { pathname, searchParams } = new URL(url);
 
-  const isEmbed = pathname.endsWith("/embed") || (searchParams?.get("embedType") ?? null) !== null;
+  const isEmbedSnippetGeneratorPath = pathname.startsWith("/event-types");
+  const isEmbed =
+    (pathname.endsWith("/embed") || (searchParams?.get("embedType") ?? null) !== null) &&
+    !isEmbedSnippetGeneratorPath;
   const embedColorScheme = searchParams?.get("ui.color-scheme");
 
   const req = { headers: headers(), cookies: cookies() };