Login:App:Confirm: some fixes on pages

packages/login/src/app/(root)/confirm/EmailActivation/page.tsx

@@ -24,14 +24,14 @@
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
-import EmailActivationForm from "@/components/EmailActivationForm";
+import EmailActivationHandler from "@/components/EmailActivationHandler";
 
 type EmailActivationProps = {
   searchParams: { [key: string]: string };
 };
 
 async function Page({ searchParams }: EmailActivationProps) {
-  return <EmailActivationForm />;
+  return <EmailActivationHandler />;
 }
 
 export default Page;

packages/login/src/app/(root)/confirm/PasswordChange/page.tsx

@@ -30,11 +30,11 @@ import { GreetingContainer } from "@/components/GreetingContainer";
 import PasswordChangeForm from "@/components/PasswordChangeForm";
 import { getSettings } from "@/utils/actions";
 
-type EmailActivationProps = {
+type PasswordChangProps = {
   searchParams: { [key: string]: string };
 };
 
-async function Page({ searchParams }: EmailActivationProps) {
+async function Page({ searchParams }: PasswordChangProps) {
   const settings = await getSettings();
 
   return (
@@ -42,7 +42,7 @@ async function Page({ searchParams }: EmailActivationProps) {
       {settings && typeof settings !== "string" && (
         <>
           <GreetingContainer greetingSettings={settings?.greetingSettings} />
-          <FormWrapper>
+          <FormWrapper id="password-change-form">
             <PasswordChangeForm passwordHash={settings.passwordHash} />
           </FormWrapper>
         </>

packages/login/src/app/(root)/confirm/PortalOwnerChange/page.tsx

@@ -49,7 +49,7 @@ async function Page({ searchParams }: PortalOwnerChangeProps) {
       {settings && typeof settings !== "string" && (
         <>
           <GreetingContainer greetingSettings={settings.greetingSettings} />
-          <FormWrapper id="login-form">
+          <FormWrapper id="owner-change-form">
             <ChangeOwnerForm newOwner={user?.displayName} />
           </FormWrapper>
         </>

packages/login/src/app/(root)/confirm/TfaActivation/page.tsx

@@ -25,6 +25,7 @@
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
 import TfaActivationForm from "@/components/TfaActivationForm";
+import { StyledForm } from "@/components/TfaActivationForm/TfaActivationForm.styled";
 import { getStringFromSearchParams } from "@/utils";
 import {
   getColorTheme,
@@ -33,11 +34,11 @@ import {
   getUserFromConfirm,
 } from "@/utils/actions";
 
-type PortalOwnerChangeProps = {
+type TfaActivationProps = {
   searchParams: { [key: string]: string };
 };
 
-async function Page({ searchParams }: PortalOwnerChangeProps) {
+async function Page({ searchParams }: TfaActivationProps) {
   const colorTheme = await getColorTheme();
 
   const currentColorScheme = colorTheme?.themes.find((theme) => {
@@ -54,7 +55,7 @@ async function Page({ searchParams }: PortalOwnerChangeProps) {
   return (
     <>
       {settings && typeof settings !== "string" && (
-        <>
+        <StyledForm className="set-app-container">
           <TfaActivationForm
             secretKey={res.manualEntryKey}
             qrCode={res.qrCodeSetupImageUrl}
@@ -62,7 +63,7 @@ async function Page({ searchParams }: PortalOwnerChangeProps) {
             userName={user?.userName}
             currentColorScheme={currentColorScheme}
           />
-        </>
+        </StyledForm>
       )}
     </>
   );

packages/login/src/app/(root)/confirm/TfaAuth/page.tsx

@@ -24,15 +24,17 @@
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
+import { GreetingContainer } from "@/components/GreetingContainer";
 import TfaAuthForm from "@/components/TfaAuthForm";
 import { getStringFromSearchParams } from "@/utils";
 import { getSettings, getUserFromConfirm } from "@/utils/actions";
+import { FormWrapper } from "@docspace/shared/components/form-wrapper";
 
-type PortalOwnerChangeProps = {
+type TfaAuthProps = {
   searchParams: { [key: string]: string };
 };
 
-async function Page({ searchParams }: PortalOwnerChangeProps) {
+async function Page({ searchParams }: TfaAuthProps) {
   const confirmKey = getStringFromSearchParams(searchParams);
   const uid = searchParams.uid;
 
@@ -43,10 +45,13 @@ async function Page({ searchParams }: PortalOwnerChangeProps) {
     <>
       {settings && typeof settings !== "string" && (
         <>
-          <TfaAuthForm
+          <GreetingContainer />
-            passwordHash={settings.passwordHash}
+          <FormWrapper id="tfa-auth-form">
-            userName={user?.userName}
+            <TfaAuthForm
-          />
+              passwordHash={settings.passwordHash}
+              userName={user?.userName}
+            />
+          </FormWrapper>
         </>
       )}
     </>

packages/login/src/app/(root)/confirm/[Invite]/page.tsx

@@ -32,6 +32,7 @@ import CreateUserForm from "@/components/CreateUserForm";
 import { GreetingCleateUserContainer } from "@/components/GreetingContainer";
 import { getStringFromSearchParams } from "@/utils";
 import { getSettings, getUserFromConfirm } from "@/utils/actions";
+import LanguageComboboxWrapper from "@/components/LanguageCombobox";
 
 type LinkInviteProps = {
   searchParams: { [key: string]: string };
@@ -53,6 +54,7 @@ async function Page({ searchParams, params }: LinkInviteProps) {
 
   return (
     <>
+      <LanguageComboboxWrapper />
       {settings && typeof settings !== "string" && (
         <>
           <GreetingCleateUserContainer
@@ -60,7 +62,7 @@ async function Page({ searchParams, params }: LinkInviteProps) {
             firstName={user?.firstName}
             lastName={user?.lastName}
           />
-          <FormWrapper id="login-form">
+          <FormWrapper id="invite-form">
             <CreateUserForm
               userNameRegex={settings.userNameRegex}
               passwordHash={settings.passwordHash}