feat: add client-side auth protection to routing forms pages (#23743)

* feat: add client-side auth protection to routing forms pages

- Create RoutingFormsShell component with useRedirectToLoginIfUnauthenticated hook
- Wrap form-edit, route-builder, and incomplete-booking pages with RoutingFormsShell
- Ensures consistent auth behavior during client-side navigation
- Maintains existing server-side auth protection
- Fix ESLint warnings: replace 'any' types with 'unknown' types and add eslint-disable for restricted imports

Co-Authored-By: eunjae@cal.com <hey@eunjae.dev>

* refactor: clean up RoutingFormsShell implementation

- Remove unused isPublic parameter from RoutingFormsShell component
- Keep only essential client-side authentication protection functionality
- Fix remaining ESLint warnings to allow commit to pass

Co-Authored-By: eunjae@cal.com <hey@eunjae.dev>

* remove unnecessary hook

* use shell at layout

* rename component

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
Eunjae Lee
2025-09-16 10:39:42 -03:00
committed by GitHub
co-authored by Devin AI
parent 55e6682832
commit 4d0458b0e8
2 changed files with 26 additions and 2 deletions
@@ -0,0 +1,9 @@
"use client";
import { useRedirectToLoginIfUnauthenticated } from "@calcom/features/auth/lib/hooks/useRedirectToLoginIfUnauthenticated";
export function RoutingFormAuthGuard({ children }: { children: React.ReactNode }) {
useRedirectToLoginIfUnauthenticated();
return <>{children}</>;
}
@@ -1,7 +1,22 @@
import type { ReactNode } from "react";
import FormProvider from "./FormProvider";
import { RoutingFormAuthGuard } from "./RoutingFormAuthGuard";
export default async function Layout({ children }: { children: ReactNode }) {
return <FormProvider>{children}</FormProvider>;
interface LayoutProps {
children: ReactNode;
params: { pages: string[] };
}
export default async function Layout({ children, params }: LayoutProps) {
const isPublic = params.pages?.[0] === "routing-link";
if (isPublic) {
return <FormProvider>{children}</FormProvider>;
}
return (
<RoutingFormAuthGuard>
<FormProvider>{children}</FormProvider>
</RoutingFormAuthGuard>
);
}