contentoh-components-library 21.0.54 → 21.0.57

package/src/components/molecules/SignInLoginCreationApp/index.js

@@ -1,182 +0,0 @@
-import { Container } from "./styles";
-import { LogoImage } from "../../atoms/LogoImage/index";
-import { ScreenHeader } from "../../atoms/ScreenHeader/index";
-import { Button } from "../../atoms/GeneralButton/index";
-import { CheckBox } from "../../atoms/CheckBox/index";
-import { TagAndInput } from "../TagAndInput";
-import { FontFamily, GlobalColors } from "../../../global-files/variables";
-import { useState, useEffect } from "react";
-import { Loading } from "../../atoms/Loading";
-import { Redirect } from "react-router-dom";
-import axios from "axios";
-
-export const SignInLoginCreationApp = (props) => {
-  const [emptyEmail, setEmptyEmail] = useState(false);
-  const [invalidEmail, setInvalidEmail] = useState(false);
-  const [emptyPassword, setEmptyPassword] = useState(false);
-  const [showErrors, setShowErrors] = useState(true);
-  const [signInError, setSignInError] = useState("");
-  const [loading, setLoading] = useState(false);
-  const [upgradePlanRedirect, setUpgradePlanRedirect] = useState(false);
-
-  const validate = async (e) => {
-    e.preventDefault();
-    setSignInError("");
-    setShowErrors(true);
-    let valid = true;
-    const email = document.querySelector("#emailInput").value.trim();
-    const password = document.querySelector("#passwordInput").value;
-    !/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(
-      email
-    )
-      ? setInvalidEmail(true)
-      : setInvalidEmail(false);
-    if (email === "") {
-      valid = false;
-      setEmptyEmail(true);
-    } else {
-      setEmptyEmail(false);
-    }
-    if (password === "") {
-      valid = false;
-      setEmptyPassword(true);
-    } else {
-      setEmptyPassword(false);
-    }
-    if (valid) {
-      try {
-        setLoading(true);
-        console.log("try")
-        const session = await props.Auth.signIn(email, password);
-        if (session.challengeName === "NEW_PASSWORD_REQUIRED") {
-          props.setUser(session);
-          props.setPaso(8);
-        } else {
-          const userGroup =
-            session.signInUserSession.accessToken.payload["cognito:groups"];
-          const response = await axios.get(
-            process.env.REACT_APP_USER_ENDPOINT,
-            {
-              headers: {
-                Authorization: session.signInUserSession.idToken.jwtToken,
-              },
-            }
-          );
-
-          const userGroupValue =
-            typeof userGroup === "string" ? userGroup : userGroup[0];
-          if (userGroupValue === "colaboradores_contentoh") {
-            sessionStorage.setItem("auth", true);
-            sessionStorage.setItem(
-              "jwt",
-              session.signInUserSession.idToken.jwtToken
-            );
-            const user = JSON.parse(response.data.body).data[0];
-            const company = JSON.parse(response.data.body).data[1];
-            // const picture = getProfilePicture(user.id_user, 83, 83);
-            caches.keys().then((names) => {
-              names.forEach((name) => {
-                caches.delete(name);
-              });
-            });
-            user.src = `https://${
-              process.env.REACT_APP_IMAGES_PROFILE_BUCKET
-            }.s3.amazonaws.com/id-${user.id_user}/${
-              user.id_user
-            }.png?${new Date().getTime()}`;
-            sessionStorage.setItem("user", JSON.stringify(user));
-            sessionStorage.setItem("company", JSON.stringify(company));
-            setUpgradePlanRedirect(true);
-          } else {
-            setSignInError("NotAuthorizedException");
-            setLoading(false);
-          }
-        }
-      } catch (error) {
-        console.log(error);
-        setLoading(false);
-        if (error.code === "NotAuthorizedException") {
-          setSignInError("NotAuthorizedException");
-        } else if (error.code === "UserNotConfirmedException") {
-          sessionStorage.setItem(
-            "email",
-            JSON.stringify(document.querySelector("#usernameInput").value)
-          );
-          props.setPaso(5);
-        } else {
-          setSignInError("Error");
-        }
-      }
-    }
-  };
-  useEffect(() => {
-    sessionStorage.getItem("resetPasswordProcess") &&
-      sessionStorage.removeItem("resetPasswordProcess");
-  }, []);
-  useEffect(() => {
-    if (upgradePlanRedirect) setLoading(false);
-  }, [upgradePlanRedirect]);
-  return loading ? (
-    <Loading />
-  ) : (
-    <>
-      <Container className={"home-login"}>
-        <div className="main-container">
-          <LogoImage />
-          <div className="credenciales">
-            <ScreenHeader
-              fontFamily={FontFamily.AvenirNext}
-              color={GlobalColors.s5}
-              text={"Ingresa tus credenciales"}
-            />
-          </div>
-          <div className="user">
-            <TagAndInput
-              inputType={"text"}
-              label={"Nombre de usuario"}
-              inputPlaceHolder={"username@contentoh.com"}
-              inputId={"emailInput"}
-            />
-          </div>
-          {showErrors && emptyEmail && <label>Ingrese su correo</label>}
-          {invalidEmail && !emptyEmail && (
-            <label>Ingrese un correo válido</label>
-          )}
-          <div className="password">
-            <TagAndInput
-              inputType={"password"}
-              label={"Contraseña"}
-              inputPlaceHolder={"Escribe tu contraseña"}
-              inputId={"passwordInput"}
-            />
-          </div>
-          {showErrors && emptyPassword && <label>Ingrese su contraseña</label>}
-          <div className="select">
-            <CheckBox
-              label={"Mantener sesión activada"}
-              id={"chk-default"}
-              className="active-left"
-            />
-            <p onClick={() => props.setPaso(10)} className="active-right">
-              Olvide mi contraseña
-            </p>
-          </div>
-          {showErrors && signInError === "NotAuthorizedException" && (
-            <label>Correo o contraseña incorrectos</label>
-          )}
-          {showErrors && signInError === "Error" && (
-            <label>Ha habido un problema al iniciar sesión</label>
-          )}
-          <div className="button-right">
-            <Button
-              buttonType={"general-default-button"}
-              label={"Iniciar sesión"}
-              onClick={(e) => validate(e)}
-            />
-          </div>
-        </div>
-      </Container>
-      {upgradePlanRedirect && <Redirect to={{ pathname: "/dashboard" }} />}
-    </>
-  );
-};

package/src/components/molecules/SignInLoginCreationApp/styles.js

@@ -1,79 +0,0 @@
-import styled from "styled-components";
-import { FontFamily, GlobalColors } from "../../../global-files/variables";
-
-export const Container = styled.div`
-  background: "white";
-  display: flex;
-  height: 100vh;
-  width: 50%;
-  justify-content: center;
-  align-items: center;
-  label {
-    color: red;
-    margin-top: 3px;
-    margin-left: 15px;
-    font-family: ${FontFamily.Raleway_700};
-    font-size: 11px;
-    & + * {
-      margin-top: 12px;
-    }
-  }
-
-  &.home-login {
-    .credenciales {
-      & + * {
-        margin-top: 30px;
-      }
-    }
-    .user {
-      & + * {
-        margin-top: 20px;
-      }
-    }
-    .password {
-      & + * {
-        margin-top: 20px;
-      }
-    }
-    .select {
-      display: flex;
-      justify-content: space-between;
-      .active-right {
-        font-family: ${FontFamily.AvenirNext};
-        font-weight: 500;
-        font-size: 13px;
-        line-height: 24px;
-        letter-spacing: -0.015em;
-        color: ${GlobalColors.s5};
-        cursor: pointer;
-      }
-      & + * {
-        margin-top: 50px;
-      }
-    }
-    .button-right {
-      text-align: right;
-      & + * {
-        margin-top: 55px;
-      }
-    }
-    .new-login {
-      p {
-        font-family: ${FontFamily.AvenirNext};
-        text-align: right;
-        font-weight: 500;
-        font-size: 13px;
-        line-height: 24px;
-        color: ${GlobalColors.s5};
-        cursor: pointer;
-        span {
-          color: ${GlobalColors.secondary_magenta};
-        }
-      }
-    }
-  }
-  .main-container {
-    max-width: 80%;
-    max-height: 80%;
-  }
-`;