diff --git a/.env.example b/.env.example index 4354cb0c36..771e2b0574 100644 --- a/.env.example +++ b/.env.example @@ -355,8 +355,6 @@ E2E_TEST_OIDC_USER_PASSWORD= # provide a value between 0 and 100 to ensure the percentage of traffic # redirected from the legacy to the future pages AB_TEST_BUCKET_PROBABILITY=50 -# whether we redirect to the future/event-types from event-types or not -APP_ROUTER_EVENT_TYPES_ENABLED=0 APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED=0 APP_ROUTER_APPS_SLUG_ENABLED=0 APP_ROUTER_APPS_SLUG_SETUP_ENABLED=0 diff --git a/apps/web/abTest/middlewareFactory.ts b/apps/web/abTest/middlewareFactory.ts index 279223ce83..6f22156259 100644 --- a/apps/web/abTest/middlewareFactory.ts +++ b/apps/web/abTest/middlewareFactory.ts @@ -5,7 +5,6 @@ import { NextResponse, URLPattern } from "next/server"; import { FUTURE_ROUTES_ENABLED_COOKIE_NAME, FUTURE_ROUTES_OVERRIDE_COOKIE_NAME } from "@calcom/lib/constants"; const ROUTES: [URLPattern, boolean][] = [ - ["/event-types", process.env.APP_ROUTER_EVENT_TYPES_ENABLED === "1"] as const, ["/apps/installed/:category", process.env.APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED === "1"] as const, ["/apps/:slug", process.env.APP_ROUTER_APPS_SLUG_ENABLED === "1"] as const, ["/apps/:slug/setup", process.env.APP_ROUTER_APPS_SLUG_SETUP_ENABLED === "1"] as const, diff --git a/apps/web/app/future/event-types/[type]/page.tsx b/apps/web/app/event-types/[type]/page.tsx similarity index 69% rename from apps/web/app/future/event-types/[type]/page.tsx rename to apps/web/app/event-types/[type]/page.tsx index 6bd794a2b1..2c151f3a27 100644 --- a/apps/web/app/future/event-types/[type]/page.tsx +++ b/apps/web/app/event-types/[type]/page.tsx @@ -4,11 +4,10 @@ import { _generateMetadata } from "app/_utils"; import { WithLayout } from "app/layoutHOC"; import { cookies, headers } from "next/headers"; -import { EventType } from "@calcom/atoms/monorepo"; - import { buildLegacyCtx } from "@lib/buildLegacyCtx"; import { getServerSideProps } from "@lib/event-types/[type]/getServerSideProps"; -import type { PageProps as EventTypePageProps } from "@lib/event-types/[type]/getServerSideProps"; + +import EventTypePageWrapper from "~/event-types/views/event-types-single-view"; export const generateMetadata = async ({ params, searchParams }: PageProps) => { const legacyCtx = buildLegacyCtx(headers(), cookies(), params, searchParams); @@ -21,5 +20,5 @@ export const generateMetadata = async ({ params, searchParams }: PageProps) => { }; const getData = withAppDirSsr(getServerSideProps); -const Page = ({ type, ...rest }: EventTypePageProps) => ; -export default WithLayout({ getLayout: null, getData, Page })<"P">; + +export default WithLayout({ getLayout: null, getData, Page: EventTypePageWrapper })<"P">; diff --git a/apps/web/app/future/event-types/page.tsx b/apps/web/app/event-types/page.tsx similarity index 100% rename from apps/web/app/future/event-types/page.tsx rename to apps/web/app/event-types/page.tsx diff --git a/apps/web/middleware.ts b/apps/web/middleware.ts index 43fce568e0..8992d36864 100644 --- a/apps/web/middleware.ts +++ b/apps/web/middleware.ts @@ -173,8 +173,7 @@ export const config = { */ "/apps/routing_forms/:path*", - "/event-types", - "/future/event-types/", + "/event-types/:path*", "/apps/installed/:category/", "/future/apps/installed/:category/", "/apps/:slug/", diff --git a/apps/web/modules/event-types/views/event-types-listing-view.tsx b/apps/web/modules/event-types/views/event-types-listing-view.tsx index 55e2b4a37c..656d4dcbad 100644 --- a/apps/web/modules/event-types/views/event-types-listing-view.tsx +++ b/apps/web/modules/event-types/views/event-types-listing-view.tsx @@ -3,7 +3,7 @@ import { useAutoAnimate } from "@formkit/auto-animate/react"; import { Trans } from "next-i18next"; import Link from "next/link"; -import { usePathname, useRouter } from "next/navigation"; +import { usePathname, useRouter, useSearchParams } from "next/navigation"; import type { FC } from "react"; import { memo, useEffect, useState } from "react"; import { z } from "zod"; @@ -18,7 +18,6 @@ import { getTeamsFiltersFromQuery } from "@calcom/features/filters/lib/getTeamsF import Shell from "@calcom/features/shell/Shell"; import { classNames, parseEventTypeColor } from "@calcom/lib"; import { APP_NAME, WEBSITE_URL } from "@calcom/lib/constants"; -import { useCompatSearchParams } from "@calcom/lib/hooks/useCompatSearchParams"; import { useCopy } from "@calcom/lib/hooks/useCopy"; import { useDebounce } from "@calcom/lib/hooks/useDebounce"; import { useInViewObserver } from "@calcom/lib/hooks/useInViewObserver"; @@ -47,7 +46,6 @@ import { DropdownMenuSeparator, DropdownMenuTrigger, EmptyScreen, - HeadSeo, HorizontalTabs, Icon, Label, @@ -60,7 +58,6 @@ import { UserAvatarGroup, } from "@calcom/ui"; -import type { AppProps } from "@lib/app-providers"; import useMeQuery from "@lib/hooks/useMeQuery"; type GetUserEventGroupsResponse = RouterOutputs["viewer"]["eventTypes"]["getUserEventGroups"]; @@ -256,7 +253,7 @@ export const InfiniteEventTypeList = ({ const { t } = useLocale(); const router = useRouter(); const pathname = usePathname(); - const searchParams = useCompatSearchParams(); + const searchParams = useSearchParams(); const { copyToClipboard } = useCopy(); const [parent] = useAutoAnimate(); const [deleteDialogOpen, setDeleteDialogOpen] = useState(false); @@ -373,7 +370,7 @@ export const InfiniteEventTypeList = ({ // inject selection data into url for correct router history const openDuplicateModal = (eventType: InfiniteEventType, group: InfiniteEventTypeGroup) => { - const newSearchParams = new URLSearchParams(searchParams ?? undefined); + const newSearchParams = new URLSearchParams(searchParams?.toString() ?? undefined); function setParamsIfDefined(key: string, value: string | number | boolean | null | undefined) { if (value) newSearchParams.set(key, value.toString()); if (value === null) newSearchParams.delete(key); @@ -897,7 +894,7 @@ const InfiniteScrollMain = ({ eventTypeGroups: GetUserEventGroupsResponse["eventTypeGroups"] | undefined; profiles: GetUserEventGroupsResponse["profiles"] | undefined; }) => { - const searchParams = useCompatSearchParams(); + const searchParams = useSearchParams(); const { data } = useTypedQuery(querySchema); const orgBranding = useOrgBranding(); @@ -945,11 +942,9 @@ const InfiniteScrollMain = ({ ); }; -const EventTypesPage: React.FC & { - PageWrapper?: AppProps["Component"]["PageWrapper"]; - getLayout?: AppProps["Component"]["getLayout"]; -} = () => { +const EventTypesPage: React.FC = () => { const { t } = useLocale(); + const searchParams = useSearchParams(); const { data: user } = useMeQuery(); // eslint-disable-next-line @typescript-eslint/no-unused-vars const [_showProfileBanner, setShowProfileBanner] = useState(false); @@ -1003,18 +998,13 @@ const EventTypesPage: React.FC & { return ( }> - - { - return ; + return ; }; export default EventTypePageWrapper; diff --git a/apps/web/pages/event-types/[type]/index.tsx b/apps/web/pages/event-types/[type]/index.tsx deleted file mode 100644 index 027bd8b837..0000000000 --- a/apps/web/pages/event-types/[type]/index.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import type { PageProps } from "@lib/event-types/[type]/getServerSideProps"; - -import PageWrapper from "@components/PageWrapper"; - -import EventTypePageWrapper from "~/event-types/views/event-types-single-view"; - -export type { - FormValues, - CustomInputParsed, - EventTypeSetup, - EventTypeSetupProps, - Host, -} from "@calcom/features/eventtypes/lib/types"; - -const Page = (props: PageProps) => ; -Page.PageWrapper = PageWrapper; - -export { getServerSideProps } from "@lib/event-types/[type]/getServerSideProps"; -export default Page; diff --git a/apps/web/pages/event-types/index.tsx b/apps/web/pages/event-types/index.tsx deleted file mode 100644 index 25af9e4ea4..0000000000 --- a/apps/web/pages/event-types/index.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import PageWrapper from "@components/PageWrapper"; - -import EventTypesPage from "~/event-types/views/event-types-listing-view"; - -export { getServerSideProps } from "@lib/event-types/getServerSideProps"; - -EventTypesPage.PageWrapper = PageWrapper; - -export default EventTypesPage; diff --git a/apps/web/playwright/manage-booking-questions.e2e.ts b/apps/web/playwright/manage-booking-questions.e2e.ts index ce2d3bd22e..41fe6c46c4 100644 --- a/apps/web/playwright/manage-booking-questions.e2e.ts +++ b/apps/web/playwright/manage-booking-questions.e2e.ts @@ -258,8 +258,6 @@ test.describe("Manage Booking Questions", () => { await test.step("Go to First Team Event", async () => { await page.getByTestId(`horizontal-tab-${team?.name}`).click(); - await page.waitForLoadState("networkidle"); - const $eventTypes = page.locator("[data-testid=event-types]").locator("li a"); const firstEventTypeElement = $eventTypes.first(); diff --git a/apps/web/scripts/vercel-app-router-deploy.sh b/apps/web/scripts/vercel-app-router-deploy.sh index 84f1a6775a..f7b2f81ddc 100755 --- a/apps/web/scripts/vercel-app-router-deploy.sh +++ b/apps/web/scripts/vercel-app-router-deploy.sh @@ -6,7 +6,6 @@ checkRoute () { # These conditionals are used to remove directories from the build that are not needed in production # This is to reduce the size of the build and prevent OOM errors -checkRoute "$APP_ROUTER_EVENT_TYPES_ENABLED" app/future/event-types checkRoute "$APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED" app/future/apps/installed checkRoute "$APP_ROUTER_APPS_SLUG_ENABLED" app/future/apps/\[slug\] checkRoute "$APP_ROUTER_APPS_SLUG_SETUP_ENABLED" app/future/apps/\[slug\]/setup diff --git a/packages/features/eventtypes/components/EventTypeLayout.tsx b/packages/features/eventtypes/components/EventTypeLayout.tsx index 4b2a69f05f..526060cd90 100644 --- a/packages/features/eventtypes/components/EventTypeLayout.tsx +++ b/packages/features/eventtypes/components/EventTypeLayout.tsx @@ -101,6 +101,7 @@ function EventTypeSingleLayout({ backPath="/event-types" title={`${eventType.title} | ${t("event_type")}`} heading={eventType.title} + withoutSeo={!isPlatform} // Metadata is handled by App Router Metadata API for Event Type Web Page CTA={
{!formMethods.getValues("metadata")?.managedEventConfig && ( diff --git a/packages/platform/atoms/event-types/wrappers/EventTypeWebWrapper.tsx b/packages/platform/atoms/event-types/wrappers/EventTypeWebWrapper.tsx index 2819a7a42b..c3f4601cc5 100644 --- a/packages/platform/atoms/event-types/wrappers/EventTypeWebWrapper.tsx +++ b/packages/platform/atoms/event-types/wrappers/EventTypeWebWrapper.tsx @@ -1,12 +1,7 @@ "use client"; -import type { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime"; import dynamic from "next/dynamic"; import { usePathname, useRouter as useAppRouter } from "next/navigation"; -// eslint-disable-next-line @calcom/eslint/deprecated-imports-next-router -import { useRouter as usePageRouter } from "next/router"; -// eslint-disable-next-line @calcom/eslint/deprecated-imports-next-router -import type { NextRouter as NextPageRouter } from "next/router"; import { useEffect, useRef, useState } from "react"; import { z } from "zod"; @@ -89,74 +84,21 @@ const EventAITab = dynamic(() => export type EventTypeWebWrapperProps = { id: number; - isAppDir?: boolean; }; -// discriminative factor: isAppDir -type EventTypeAppComponentProp = { - id: number; - isAppDir: true; - pathname: string; - pageRouter: null; - appRouter: AppRouterInstance; -}; - -// discriminative factor: isAppDir -type EventTypePageComponentProp = { - id: number; - isAppDir: false; - pageRouter: NextPageRouter; - pathname: null; - appRouter: null; -}; - -type EventTypeAppPageComponentProp = EventTypeAppComponentProp | EventTypePageComponentProp; - -export const EventTypeWebWrapper = ({ id, isAppDir }: EventTypeWebWrapperProps & { isAppDir?: boolean }) => { +export const EventTypeWebWrapper = ({ id }: EventTypeWebWrapperProps) => { const { data: eventTypeQueryData } = trpc.viewer.eventTypes.get.useQuery({ id }); if (!eventTypeQueryData) return null; - return isAppDir ? ( - - ) : ( - - ); + return ; }; -const EventTypePageWrapper = ({ id, ...rest }: EventTypeSetupProps & { id: number }) => { - const router = usePageRouter(); - return ( - - ); -}; - -const EventTypeAppWrapper = ({ id, ...rest }: EventTypeSetupProps & { id: number }) => { - const pathname = usePathname(); - const router = useAppRouter(); - return ( - - ); -}; - -const EventTypeWeb = ({ - id, - isAppDir, - pageRouter, - appRouter, - pathname, - ...rest -}: EventTypeSetupProps & EventTypeAppPageComponentProp) => { +const EventTypeWeb = ({ id, ...rest }: EventTypeSetupProps & { id: number }) => { const { t } = useLocale(); const utils = trpc.useUtils(); - + const pathname = usePathname(); + const appRouter = useAppRouter(); const { data: user, isPending: isLoggedInUserPending } = useMeQuery(); const isTeamEventTypeDeleted = useRef(false); const leaveWithoutAssigningHosts = useRef(false); @@ -281,7 +223,7 @@ const EventTypeWeb = ({ } as const; useHandleRouteChange({ - watchTrigger: isAppDir ? pageRouter : pathname, + watchTrigger: pathname, isTeamEventTypeDeleted: isTeamEventTypeDeleted.current, isleavingWithoutAssigningHosts: leaveWithoutAssigningHosts.current, isTeamEventType: !!team, @@ -292,22 +234,10 @@ const EventTypeWeb = ({ onError: (url) => { setIsOpenAssignmentWarnDialog(true); setPendingRoute(url); - if (!isAppDir) { - pageRouter.events.emit( - "routeChangeError", - new Error(`Aborted route change to ${url} because none was assigned to team event`) - ); - throw "Aborted"; - } - - if (isAppDir) throw new Error(`Aborted route change to ${url} because none was assigned to team event`); + throw new Error(`Aborted route change to ${url} because none was assigned to team event`); }, onStart: (handleRouteChange) => { - !isAppDir && pageRouter.events.on("routeChangeStart", handleRouteChange); - isAppDir && handleRouteChange(pathname || ""); - }, - onEnd: (handleRouteChange) => { - !isAppDir && pageRouter.events.off("routeChangeStart", handleRouteChange); + handleRouteChange(pathname || ""); }, }); @@ -370,7 +300,7 @@ const EventTypeWeb = ({ await utils.viewer.eventTypes.invalidate(); showToast(t("event_type_deleted_successfully"), "success"); isTeamEventTypeDeleted.current = true; - isAppDir ? appRouter.push("/event-types") : pageRouter.push("/event-types"); + appRouter.push("/event-types"); setSlugExistsChildrenDialogOpen([]); setIsOpenAssignmentWarnDialog(false); }, diff --git a/turbo.json b/turbo.json index a9871f96d3..837bbb7431 100644 --- a/turbo.json +++ b/turbo.json @@ -243,7 +243,6 @@ "APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED", "APP_ROUTER_APPS_SLUG_ENABLED", "APP_ROUTER_APPS_SLUG_SETUP_ENABLED", - "APP_ROUTER_EVENT_TYPES_ENABLED", "APP_ROUTER_AUTH_FORGOT_PASSWORD_ENABLED", "APP_ROUTER_AUTH_LOGIN_ENABLED", "APP_ROUTER_AUTH_LOGOUT_ENABLED",