chore: remove unneeded props from AuthContainer and make its usages cleaner (#19191)

* refactor AuthContainer by removing app-dir related props

* fix

apps/web/app/(use-page-wrapper)/auth/error/page.tsx

@@ -23,7 +23,7 @@ const ServerPage = async ({ searchParams }: PageProps) => {
   const { error } = querySchema.parse({ error: searchParams?.error || undefined });
   const errorMsg = t("error_during_login") + (error ? ` Error code: ${error}` : "");
   return (
-    <AuthContainer title="" description="" isAppDir={true}>
+    <AuthContainer>
       <div>
         <div className="bg-error mx-auto flex h-12 w-12 items-center justify-center rounded-full">
           <Icon name="x" className="h-6 w-6 text-red-600" />

apps/web/components/ui/AuthContainer.tsx

@@ -1,23 +1,19 @@
 import classNames from "classnames";
 
-import { HeadSeo, Logo } from "@calcom/ui";
+import { Logo } from "@calcom/ui";
 
 import Loader from "@components/Loader";
 
 interface Props {
-  title: string;
-  description: string;
   footerText?: React.ReactNode | string;
   showLogo?: boolean;
   heading?: string;
   loading?: boolean;
-  isAppDir?: boolean;
 }
 
 export default function AuthContainer(props: React.PropsWithChildren<Props>) {
   return (
     <div className="bg-subtle dark:bg-darkgray-50 flex min-h-screen flex-col justify-center py-12 sm:px-6 lg:px-8">
-      {!props.isAppDir ? <HeadSeo title={props.title} description={props.description} /> : null}
       {props.showLogo && <Logo small inline={false} className="mx-auto mb-auto" />}
 
       <div className={classNames(props.showLogo ? "text-center" : "", "sm:mx-auto sm:w-full sm:max-w-md")}>

apps/web/modules/auth/forgot-password/[id]/forgot-password-single-view.tsx

@@ -73,11 +73,7 @@ export default function Page({ requestId, isRequestExpired, csrfToken }: PagePro
   };
 
   return (
-    <AuthContainer
-      showLogo
-      title={t("reset_password")}
-      description={t("change_your_password")}
-      heading={!success ? t("reset_password") : undefined}>
+    <AuthContainer showLogo heading={!success ? t("reset_password") : undefined}>
       {isRequestExpired && <Expired />}
       {!isRequestExpired && !success && (
         <>

apps/web/modules/auth/forgot-password/forgot-password-view.tsx

@@ -89,9 +89,7 @@ export default function ForgotPassword(props: PageProps) {
   return (
     <AuthContainer
       showLogo
-      title={!success ? t("forgot_password") : t("reset_link_sent")}
       heading={!success ? t("forgot_password") : t("reset_link_sent")}
-      description={t("request_password_reset")}
       footerText={
         !success && (
           <>

apps/web/modules/auth/login-view.tsx

@@ -182,9 +182,6 @@ PageProps & WithNonceProps<{}>) {
   return (
     <div className="dark:bg-brand dark:text-brand-contrast text-emphasis min-h-screen [--cal-brand-emphasis:#101010] [--cal-brand-subtle:#9CA3AF] [--cal-brand-text:white] [--cal-brand:#111827] dark:[--cal-brand-emphasis:#e1e1e1] dark:[--cal-brand-text:black] dark:[--cal-brand:white]">
       <AuthContainer
-        isAppDir
-        title={t("login")}
-        description={t("login")}
         showLogo
         heading={twoFactorRequired ? t("2fa_code") : t("welcome_back")}
         footerText={

apps/web/modules/auth/logout-view.tsx

@@ -41,7 +41,7 @@ export function Logout(props: PageProps) {
   };
 
   return (
-    <AuthContainer title={t("logged_out")} description={t("youve_been_logged_out")} showLogo isAppDir>
+    <AuthContainer showLogo>
       <div className="mb-4">
         <div className="bg-success mx-auto flex h-12 w-12 items-center justify-center rounded-full">
           <Icon name="check" className="h-6 w-6 text-green-600" />