more fixes

components/booking/DatePicker.tsx

@@ -5,12 +5,12 @@ import dayjsBusinessTime from "dayjs-business-time";
 import timezone from "dayjs/plugin/timezone";
 import utc from "dayjs/plugin/utc";
 import Link from "next/link";
-import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 
 import classNames from "@lib/classNames";
 import { useLocale } from "@lib/hooks/useLocale";
 import getSlots from "@lib/slots";
+import { useRouterPathname } from "@lib/useRouterPathname";
 
 dayjs.extend(dayjsBusinessTime);
 dayjs.extend(utc);
@@ -40,6 +40,7 @@ function DatePicker({
         : date.month()
       : dayjs().month() /* High chance server is going to have the same month */
   );
+  const basePath = useRouterPathname();
 
   useEffect(() => {
     if (dayjs().month() !== selectedMonth) {
@@ -129,7 +130,6 @@ function DatePicker({
     setDays(days);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [selectedMonth]);
-  const router = useRouter();
 
   return (
     <div
@@ -184,9 +184,10 @@ function DatePicker({
               <div key={`e-${idx}`} />
             ) : (
               <Link
-                href={`/${router.query.user}/${router.query.type}?date=${encodeURIComponent(
+                href={`${basePath}?date=${encodeURIComponent(
                   inviteeDate().date(day.date).format("YYYY-MM-DDZZ")
-                )}`}>
+                )}`}
+                scroll={false}>
                 <a
                   className={classNames(
                     "rounded-sm text-center border border-transparent absolute inset-0",

components/booking/pages/AvailabilityPage.tsx

@@ -14,6 +14,7 @@ import { useLocale } from "@lib/hooks/useLocale";
 import useTheme from "@lib/hooks/useTheme";
 import { isBrandingHidden } from "@lib/isBrandingHidden";
 import { collectPageParameters, telemetryEventTypes, useTelemetry } from "@lib/telemetry";
+import { useRouterPathname } from "@lib/useRouterPathname";
 
 import AvailableTimes from "@components/booking/AvailableTimes";
 import DatePicker from "@components/booking/DatePicker";
@@ -59,8 +60,10 @@ const AvailabilityPage = ({ profile, eventType, workingHours }: Props) => {
     telemetry.withJitsu((jitsu) => jitsu.track(telemetryEventTypes.pageView, collectPageParameters()));
   }, [telemetry]);
 
+  const basePath = useRouterPathname();
   const changeDate = (newDate: Dayjs) => {
     telemetry.withJitsu((jitsu) => jitsu.track(telemetryEventTypes.dateSelected, collectPageParameters()));
+
     router.replace(
       {
         query: {
@@ -68,7 +71,12 @@ const AvailabilityPage = ({ profile, eventType, workingHours }: Props) => {
           date: newDate.format("YYYY-MM-DDZZ"),
         },
       },
-      undefined,
+      {
+        pathname: basePath,
+        query: {
+          date: newDate.format("YYYY-MM-DDZZ"),
+        },
+      },
       {
         shallow: true,
       }

lib/useRouterPathname.ts

@@ -0,0 +1,9 @@
+import { useRouter } from "next/router";
+import { useMemo } from "react";
+
+export function useRouterPathname() {
+  const router = useRouter();
+  return useMemo(() => {
+    return router.asPath.split("?")[0] as string;
+  }, [router.asPath]);
+}

pages/_middleware.ts

@@ -26,6 +26,8 @@ const SKIP_PATHS = [
   "team",
 ];
 
+const FIXME_LOCALES = ["en", "fr", "it", "ru", "es", "de", "pt", "ro", "nl", "pt-BR", "es-419", "ko", "ja"];
+
 export async function middleware(req: NextRequest) {
   const pathname = req.nextUrl.pathname;
 
@@ -37,7 +39,12 @@ export async function middleware(req: NextRequest) {
 
   const isFileRequest = pathname.includes(".");
 
-  if (SKIP_PATHS.includes(firstPart) || isFileRequest || pathname === "/") {
+  if (
+    SKIP_PATHS.includes(firstPart) ||
+    isFileRequest ||
+    pathname === "/" ||
+    FIXME_LOCALES.includes(firstPart)
+  ) {
     return;
   }