diff --git a/apps/web/pages/[user].tsx b/apps/web/pages/[user].tsx index cbe3339e9b..4cc9dd9d24 100644 --- a/apps/web/pages/[user].tsx +++ b/apps/web/pages/[user].tsx @@ -13,12 +13,7 @@ import { import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains"; import { EventTypeDescriptionLazy as EventTypeDescription } from "@calcom/features/eventtypes/components"; import EmptyPage from "@calcom/features/eventtypes/components/EmptyPage"; -import defaultEvents, { - getDynamicEventDescription, - getGroupName, - getUsernameList, - getUsernameSlugLink, -} from "@calcom/lib/defaultEvents"; +import { getUsernameList } from "@calcom/lib/defaultEvents"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import useTheme from "@calcom/lib/hooks/useTheme"; import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML"; @@ -26,7 +21,7 @@ import { stripMarkdown } from "@calcom/lib/stripMarkdown"; import prisma from "@calcom/prisma"; import { baseEventTypeSelect } from "@calcom/prisma/selects"; import { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils"; -import { Avatar, AvatarGroup, HeadSeo } from "@calcom/ui"; +import { Avatar, HeadSeo } from "@calcom/ui"; import { Verified, ArrowRight } from "@calcom/ui/components/icon"; import type { inferSSRProps } from "@lib/types/inferSSRProps"; @@ -38,16 +33,7 @@ import { ssrInit } from "@server/lib/ssr"; export type UserPageProps = inferSSRProps & EmbedProps; export function UserPage(props: UserPageProps) { - const { - users, - profile, - eventTypes, - isDynamicGroup, - dynamicNames, - dynamicUsernames, - isSingleUser, - markdownStrippedBio, - } = props; + const { users, profile, eventTypes, isSingleUser, markdownStrippedBio } = props; const [user] = users; //To be used when we only have a single user, not dynamic group useTheme(user.theme); const { t } = useLocale(); @@ -55,47 +41,6 @@ export function UserPage(props: UserPageProps) { const isBioEmpty = !user.bio || !user.bio.replace("


", "").length; - const groupEventTypes = props.users.some((user) => !user.allowDynamicBooking) ? ( -
-
-
-

{" " + t("unavailable")}

-

{t("user_dynamic_booking_disabled") as string}

-
-
-
- ) : ( - - ); - const isEmbed = useIsEmbed(props.isEmbed); const eventTypeListItemEmbedStyles = useEmbedStyles("eventTypeListItem"); const shouldAlignCentrallyInEmbed = useEmbedNonStylesConfig("align") !== "left"; @@ -117,14 +62,12 @@ export function UserPage(props: UserPageProps) { return ( <> ({ username, name: dynamicNames[index] })) - : [{ username: `${user.username}`, name: `${user.name}` }], + users: [{ username: `${user.username}`, name: `${user.name}` }], }} /> @@ -165,8 +108,6 @@ export function UserPage(props: UserPageProps) {

{t("user_away_description") as string}

- ) : isDynamicGroup ? ( //When we deal with dynamic group (users > 1) - groupEventTypes ) : ( eventTypes.map((type) => (
}, }); + const isDynamicGroup = usersWithoutAvatar.length > 1; + if (isDynamicGroup) { + return { + redirect: { + permanent: false, + destination: `/${usernameList.join("+")}/dynamic`, + }, + } as { + redirect: { + permanent: false; + destination: string; + }; + }; + } + const users = usersWithoutAvatar.map((user) => ({ ...user, avatar: `/${user.username}/avatar.png`, @@ -300,45 +256,18 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) => notFound: true; }; } - const isDynamicGroup = users.length > 1; - if (isDynamicGroup) { - // sort and be in the same order as usernameList so first user is the first user in the list - users.sort((a, b) => { - const aIndex = (a.username && usernameList.indexOf(a.username)) || 0; - const bIndex = (b.username && usernameList.indexOf(b.username)) || 0; - return aIndex - bIndex; - }); - } - - const dynamicNames = isDynamicGroup - ? users.map((user) => { - return user.name || ""; - }) - : []; const [user] = users; //to be used when dealing with single user, not dynamic group - const profile = isDynamicGroup - ? { - name: getGroupName(dynamicNames), - image: null, - theme: null, - weekStart: "Sunday", - brandColor: "", - darkBrandColor: "", - allowDynamicBooking: !users.some((user) => { - return !user.allowDynamicBooking; - }), - } - : { - name: user.name || user.username, - image: user.avatar, - theme: user.theme, - brandColor: user.brandColor, - darkBrandColor: user.darkBrandColor, - }; + const profile = { + name: user.name || user.username, + image: user.avatar, + theme: user.theme, + brandColor: user.brandColor, + darkBrandColor: user.darkBrandColor, + }; - const eventTypesWithHidden = isDynamicGroup ? [] : await getEventTypesWithHiddenFromDB(user.id); + const eventTypesWithHidden = await getEventTypesWithHiddenFromDB(user.id); const dataFetchEnd = Date.now(); if (context.query.log === "1") { context.res.setHeader("X-Data-Fetch-Time", `${dataFetchEnd - dataFetchStart}ms`); @@ -352,11 +281,6 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) => })); const isSingleUser = users.length === 1; - const dynamicUsernames = isDynamicGroup - ? users.map((user) => { - return user.username || ""; - }) - : []; const safeBio = markdownToSafeHTML(user.bio) || ""; @@ -368,20 +292,12 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) => safeBio, profile, // Dynamic group has no theme preference right now. It uses system theme. - themeBasis: isDynamicGroup ? null : user.username, + themeBasis: user.username, user: { emailMd5: crypto.createHash("md5").update(user.email).digest("hex"), }, - eventTypes: isDynamicGroup - ? defaultEvents.map((event) => { - event.description = getDynamicEventDescription(dynamicUsernames, event.slug); - return event; - }) - : eventTypes, + eventTypes, trpcState: ssr.dehydrate(), - isDynamicGroup, - dynamicNames, - dynamicUsernames, isSingleUser, markdownStrippedBio, }, diff --git a/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts b/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts index 3b1675d4fd..ec6d4fb070 100644 --- a/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts +++ b/packages/app-store/routing-forms/playwright/tests/basic.e2e.ts @@ -236,10 +236,7 @@ test.describe("Routing Forms", () => { await user.apiLogin(); await page.goto(`/apps/routing-forms/reporting/${routingForm.id}`); - // Can't keep waiting forever. So, added a timeout of 5000ms - await page.waitForResponse((response) => response.url().includes("appRoutingForms/report"), { - timeout: 5000, - }); + const headerEls = page.locator("[data-testid='reporting-header'] th"); // Once the response is there, React would soon render it, so 500ms is enough // FIXME: Sometimes it takes more than 500ms, so added a timeout of 1000ms for now. There might be something wrong with rendering. diff --git a/packages/features/bookings/components/event-meta/Duration.tsx b/packages/features/bookings/components/event-meta/Duration.tsx index c094901ce5..94f3c1009c 100644 --- a/packages/features/bookings/components/event-meta/Duration.tsx +++ b/packages/features/bookings/components/event-meta/Duration.tsx @@ -14,17 +14,23 @@ export const EventDuration = ({ event }: { event: PublicEvent }) => { state.setSelectedDuration, ]); + const isDynamicEvent = "isDynamic" in event && event.isDynamic; + // Sets initial value of selected duration to the default duration. useEffect(() => { // Only store event duration in url if event has multiple durations. - if (!selectedDuration && event.metadata?.multipleDuration) setSelectedDuration(event.length); - }, [selectedDuration, setSelectedDuration, event.length, event.metadata?.multipleDuration]); + if (!selectedDuration && (event.metadata?.multipleDuration || isDynamicEvent)) + setSelectedDuration(event.length); + }, [selectedDuration, setSelectedDuration, event.metadata?.multipleDuration, event.length, isDynamicEvent]); - if (!event?.metadata?.multipleDuration) return <>{t("multiple_duration_mins", { count: event.length })}; + if (!event?.metadata?.multipleDuration && !isDynamicEvent) + return <>{t("multiple_duration_mins", { count: event.length })}; + + const durations = event?.metadata?.multipleDuration || [15, 30, 60]; return (
- {event.metadata.multipleDuration.map((duration) => ( + {durations.map((duration) => ( { return `Book a ${slug} min event with ${dynamicUsernames.join(", ")}`; @@ -152,7 +132,7 @@ export const getDefaultEvent = (slug: string) => { const event = defaultEvents.find((obj) => { return obj.slug === slug; }); - return event || min15Event; + return event || dynamicEvent; }; export const getGroupName = (usernameList: string[]): string => {