Login:Src:Components: some changes after merge

packages/login/src/components/ChangeOwnerForm/index.tsx

@@ -32,7 +32,6 @@ import { useTranslation } from "react-i18next";
 import { Button, ButtonSize } from "@docspace/shared/components/button";
 import { Text } from "@docspace/shared/components/text";
 import { toastr } from "@docspace/shared/components/toast";
-import { PRODUCT_NAME } from "@docspace/shared/constants";
 
 import withLoader from "@/HOCs/withLoader";
 import { TError, WithLoaderProps } from "@/types";
@@ -86,7 +85,7 @@ const ChangeOwnerForm = ({ newOwner }: ChangeOwnerFormProps) => {
       {isOwnerChanged ? (
         <Text>
           {t("ConfirmOwnerPortalSuccessMessage", {
-            productName: PRODUCT_NAME,
+            productName: t("Common:ProductName"),
           })}
         </Text>
       ) : (
@@ -94,7 +93,7 @@ const ChangeOwnerForm = ({ newOwner }: ChangeOwnerFormProps) => {
           <Text className="subtitle">
             {t("ConfirmOwnerPortalTitle", {
               newOwner: newOwner,
-              productName: PRODUCT_NAME,
+              productName: t("Common:ProductName"),
             })}
           </Text>
           <ButtonsWrapper>

packages/login/src/components/CreateUserForm/index.tsx

@@ -100,6 +100,7 @@ const CreateUserForm = (props: CreateUserFormProps) => {
 
   const emailFromLink = linkData?.email ? linkData.email : "";
   const roomName = roomData?.title;
+  const roomId = roomData?.roomId;
 
   const [email, setEmail] = useState(emailFromLink);
   const [emailValid, setEmailValid] = useState(true);
@@ -142,7 +143,7 @@ const CreateUserForm = (props: CreateUserFormProps) => {
       return signupOAuth(signupAccount)
         .then(() => {
           const url = roomData.roomId
-            ? `/rooms/shared/filter?folder=${roomData.roomId}/`
+            ? `/rooms/shared/${roomData.roomId}/filter?folder=${roomData.roomId}/`
             : defaultPage;
           window.location.replace(url);
         })
@@ -166,23 +167,13 @@ const CreateUserForm = (props: CreateUserFormProps) => {
   }, [authCallback]);
 
   const onContinue = async () => {
-    setIsLoading(true);
-
-    let hasError = false;
-
-    const emailRegex = "[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$";
-    const validationEmail = new RegExp(emailRegex);
-
-    if (!validationEmail.test(email.trim())) {
-      hasError = true;
-      setEmailValid(!hasError);
-    }
-
-    if (hasError) {
-      setIsLoading(false);
+    if (!emailValid) {
+      setIsEmailErrorShow(true);
       return;
     }
 
+    setIsLoading(true);
+
     const headerKey = linkData?.confirmHeader ?? null;
 
     const toBinaryStr = (str: string) => {
@@ -200,6 +191,7 @@ const CreateUserForm = (props: CreateUserFormProps) => {
           roomName,
           firstName,
           lastName,
+          linkData,
         }),
       ),
     );
@@ -221,6 +213,14 @@ const CreateUserForm = (props: CreateUserFormProps) => {
       "max-age": COOKIE_EXPIRATION_YEAR,
     });
 
+    const finalUrl = roomId
+      ? `/rooms/shared/${roomId}/filter?folder=${roomId}`
+      : defaultPage;
+
+    if (roomId) {
+      sessionStorage.setItem("referenceUrl", finalUrl);
+    }
+
     window.location.href = combineUrl(
       window.ClientConfig?.proxy?.url,
       "/login",
@@ -248,14 +248,6 @@ const CreateUserForm = (props: CreateUserFormProps) => {
       setSnameValid(!hasError);
     }
 
-    const emailRegex = "[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$";
-    const validationEmail = new RegExp(emailRegex);
-
-    if (!validationEmail.test(email.trim())) {
-      hasError = true;
-      setEmailValid(!hasError);
-    }
-
     if (!passwordValid || !password.trim()) {
       hasError = true;
       setPasswordValid(!hasError);
@@ -328,7 +320,7 @@ const CreateUserForm = (props: CreateUserFormProps) => {
     const res = await login(userName, passwordHash);
 
     const finalUrl = roomData.roomId
-      ? `/rooms/shared/filter?folder=${roomData.roomId}`
+      ? `/rooms/shared/${roomData.roomId}/filter?folder=${roomData.roomId}`
       : defaultPage;
 
     const isConfirm = typeof res === "string" && res.includes("confirm");

packages/login/src/components/CreateUserForm/sub-components/RegistrationForm.tsx

@@ -38,7 +38,6 @@ import {
   InputType,
   TextInput,
 } from "@docspace/shared/components/text-input";
-import { getPasswordErrorMessage } from "@docspace/shared/utils/getPasswordErrorMessage";
 
 import { ConfirmRouteContext } from "@/components/ConfirmRoute";
 
@@ -171,9 +170,7 @@ const RegistrationForm = ({
         isVertical={true}
         labelVisible={false}
         hasError={isPasswordErrorShow && !passwordValid}
-        errorMessage={`${t(
-          "Common:PasswordLimitMessage",
-        )}: ${getPasswordErrorMessage(t, passwordSettings)}`}
+        errorMessage={t("Common:IncorrectPassword")}
       >
         <PasswordInput
           simpleView={false}
@@ -201,6 +198,7 @@ const RegistrationForm = ({
           tooltipPasswordCapital={`${t("Common:PasswordLimitUpperCase")}`}
           tooltipPasswordSpecial={`${t("Common:PasswordLimitSpecialSymbols")}`}
           generatePasswordTitle={t("Wizard:GeneratePassword")}
+          tooltipAllowedCharacters={`${t("Common:AllowedCharacters")}: ${ALLOWED_PASSWORD_CHARACTERS}`}
         />
       </FieldContainer>
 

packages/login/src/components/GreetingContainer/GreetingCreateUserContainer/GreetingCreateUserContainer.tsx

@@ -99,7 +99,7 @@ export const GreetingCleateUserContainer = ({
                 values={{
                   firstName,
                   lastName,
-                  productName: PRODUCT_NAME,
+                  productName: t("Common:ProductName"),
                   ...(roomData.title
                     ? { roomName: roomData.title }
                     : { spaceAddress: hostName }),

packages/login/src/components/PasswordChangeForm/index.tsx

@@ -150,9 +150,7 @@ const PasswordChangeForm = ({
           isVertical={true}
           labelVisible={false}
           hasError={isPasswordErrorShow && !passwordValid}
-          errorMessage={`${t(
-            "Common:PasswordLimitMessage",
-          )}: ${getPasswordErrorMessage(t, passwordSettings)}`}
+          errorMessage={t("Common:IncorrectPassword")}
         >
           <PasswordInput
             simpleView={false}
@@ -181,6 +179,7 @@ const PasswordChangeForm = ({
               "Common:PasswordLimitSpecialSymbols",
             )}`}
             generatePasswordTitle={t("Wizard:GeneratePassword")}
+            tooltipAllowedCharacters={`${t("Common:AllowedCharacters")}: ${ALLOWED_PASSWORD_CHARACTERS}`}
           />
         </FieldContainer>
       </div>

packages/login/src/components/StyledLayout.styled.ts

@@ -33,7 +33,7 @@ import { mobile, tablet } from "@docspace/shared/utils/device";
 
 export const FormWrapper = styled.div<{ bgPattern: string }>`
   width: 100%;
-  height: 100vh;
+  height: 100dvh;
 
   box-sizing: border-box;
 
@@ -47,10 +47,7 @@ export const FormWrapper = styled.div<{ bgPattern: string }>`
     background-attachment: fixed;
     background-size: cover;
     position: fixed;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
+    inset: 0;
 
     @media ${mobile} {
       background-image: none;
@@ -79,7 +76,7 @@ export const FormWrapper = styled.div<{ bgPattern: string }>`
 
   .language-combo-box {
     position: fixed;
-    right: 28px;
+    inset-inline-end: 28px;
     top: 28px;
 
     @media ${mobile} {
@@ -105,14 +102,7 @@ export const FormWrapper = styled.div<{ bgPattern: string }>`
         text-overflow: ellipsis;
         overflow: hidden;
 
-        ${(props) =>
-          props.theme.interfaceDirection === "rtl"
-            ? css`
-                right: 0;
-              `
-            : css`
-                left: 0;
-              `};
+        inset-inline-start: 0;
 
         display: flex;
         gap: 4px;

packages/login/src/components/TfaActivationForm/index.tsx

@@ -58,7 +58,6 @@ import withLoader from "@/HOCs/withLoader";
 import { TError, WithLoaderProps } from "@/types";
 import { ConfirmRouteContext } from "../ConfirmRoute";
 
-
 import { GreetingContainer } from "../GreetingContainer";
 
 const PROXY_BASE_URL = combineUrl(window.ClientConfig?.proxy?.url, "/profile");