@griddo/ax 11.10.11-rc.0 → 11.10.12-rc.0

package/src/components/Loader/components/Dots.js

@@ -1,19 +1,19 @@
 import * as React from "react";
 
 function SvgDots(props) {
-  return (
-    <svg data-testid="dots-svg" viewBox="0 0 100 100" {...props}>
-      <circle fill="#5057FF" cx={6} cy={50} r={6}>
-        <animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.1} />
-      </circle>
-      <circle fill="#5057FF" cx={26} cy={50} r={6}>
-        <animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.2} />
-      </circle>
-      <circle fill="#5057FF" cx={46} cy={50} r={6}>
-        <animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.3} />
-      </circle>
-    </svg>
-  );
+	return (
+		<svg data-testid="dots-svg" viewBox="0 0 100 100" {...props}>
+			<circle fill="#5057FF" cx={6} cy={50} r={6}>
+				<animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.1} />
+			</circle>
+			<circle fill="#5057FF" cx={26} cy={50} r={6}>
+				<animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.2} />
+			</circle>
+			<circle fill="#5057FF" cx={46} cy={50} r={6}>
+				<animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin={0.3} />
+			</circle>
+		</svg>
+	);
 }
 
 export default SvgDots;

package/src/components/Loader/index.tsx

@@ -6,40 +6,40 @@ import Dots from "./components/Dots";
 const components: Record<string, () => JSX.Element> = { Circle, Dots };
 
 const getImage = (name: string) => {
-  try {
-    return components[name];
-  } catch (err) {
-    return null;
-  }
+	try {
+		return components[name];
+	} catch (err) {
+		return null;
+	}
 };
 
 const Loader = (props: IProps): JSX.Element | null => {
-  const name = props.name
-    .replace(".svg", "")
-    .split("-")
-    .map((type: string) => type.charAt(0).toUpperCase() + type.slice(1))
-    .join("");
-
-  const { size = "70" } = props;
-
-  const elementProps = {
-    height: size,
-    width: size,
-    viewBox: "0 0 100 100",
-  };
-
-  const Svg = getImage(name);
-
-  if (Svg) {
-    return React.createElement(Svg, elementProps);
-  }
-  
-  return null;
+	const name = props.name
+		.replace(".svg", "")
+		.split("-")
+		.map((type: string) => type.charAt(0).toUpperCase() + type.slice(1))
+		.join("");
+
+	const { size = "70" } = props;
+
+	const elementProps = {
+		height: size,
+		width: size,
+		viewBox: "0 0 100 100",
+	};
+
+	const Svg = getImage(name);
+
+	if (Svg) {
+		return React.createElement(Svg, elementProps);
+	}
+
+	return null;
 };
 
 export interface IStateProps {
-  name: string;
-  size?: string;
+	name: string;
+	size?: string;
 }
 
 type IProps = IStateProps;

package/src/components/Loading/index.tsx

@@ -4,18 +4,18 @@ import { Loader } from "@ax/components";
 import * as S from "./style";
 
 const Loading = (props: IProps): JSX.Element => {
-  const { light = false } = props;
-  return (
-    <S.Wrapper data-testid="loading-wrapper" light={light}>
-      <S.LoadingWrapper>
-        <Loader name="circle" />
-      </S.LoadingWrapper>
-    </S.Wrapper>
-  );
+	const { light = false } = props;
+	return (
+		<S.Wrapper data-testid="loading-wrapper" light={light}>
+			<S.LoadingWrapper>
+				<Loader name="circle" />
+			</S.LoadingWrapper>
+		</S.Wrapper>
+	);
 };
 
 interface IProps {
-  light?: boolean;
+	light?: boolean;
 }
 
 export default Loading;

package/src/components/Login/LoginForm/RecoveryModal/index.tsx

@@ -7,83 +7,83 @@ import { Modal, FieldsBehavior } from "@ax/components";
 import * as S from "./style";
 
 const RecoveryModal = (props: IRecoveryProps): JSX.Element => {
-  const { isOpen, toggleModal } = props;
+	const { isOpen, toggleModal } = props;
 
-  const initialModalState = {
-    input: "",
-    isMailSent: false,
-    error: false,
-  };
+	const initialModalState = {
+		input: "",
+		isMailSent: false,
+		error: false,
+	};
 
-  const [modalState, setModalState] = useState(initialModalState);
+	const [modalState, setModalState] = useState(initialModalState);
 
-  const handleResetPassword = async () => {
-    const response = await global.forgotPassword(modalState.input);
-    if (isReqOk(response.status)) {
-      setModalState({ ...modalState, isMailSent: true });
-    } else {
-      setModalState({ ...modalState, error: true });
-    }
-  };
+	const handleResetPassword = async () => {
+		const response = await global.forgotPassword(modalState.input);
+		if (isReqOk(response.status)) {
+			setModalState({ ...modalState, isMailSent: true });
+		} else {
+			setModalState({ ...modalState, error: true });
+		}
+	};
 
-  const handleCloseModal = () => {
-    setModalState(initialModalState);
-    toggleModal();
-  };
+	const handleCloseModal = () => {
+		setModalState(initialModalState);
+		toggleModal();
+	};
 
-  const handleModalChange = (value: string) => {
-    setModalState({ ...modalState, input: value });
-  };
+	const handleModalChange = (value: string) => {
+		setModalState({ ...modalState, input: value });
+	};
 
-  const mainAction = !modalState.isMailSent
-    ? { title: "Reset Password", onClick: handleResetPassword, disabled: !validateEmail(modalState.input) }
-    : { title: "Got it!", onClick: handleCloseModal };
+	const mainAction = !modalState.isMailSent
+		? { title: "Reset Password", onClick: handleResetPassword, disabled: !validateEmail(modalState.input) }
+		: { title: "Got it!", onClick: handleCloseModal };
 
-  const secondaryAction = !modalState.isMailSent ? { title: "Cancel", onClick: handleCloseModal } : undefined;
+	const secondaryAction = !modalState.isMailSent ? { title: "Cancel", onClick: handleCloseModal } : undefined;
 
-  const errorText = modalState.error ? "Sorry, this email doesn't exist." : "";
+	const errorText = modalState.error ? "Sorry, this email doesn't exist." : "";
 
-  const ModalContent = !modalState.isMailSent ? (
-    <>
-      <p>Forgot your password? No problem, we&apos;ll send you an email with instructions to reset it.</p>
-      <FieldsBehavior
-        fieldType="TextField"
-        placeholder="Type your email"
-        title="Email"
-        mandatory={true}
-        value={modalState.input}
-        onChange={handleModalChange}
-        error={modalState.error}
-        helptext={errorText}
-        name="email"
-      />
-    </>
-  ) : (
-    <>
-      <p>
-        We sent you an email with further instructions to reset your password to <strong>{modalState.input}</strong>.
-      </p>
-      <p>If you don&apos;t receive it, please check your spam folder or contact support.</p>
-    </>
-  );
+	const ModalContent = !modalState.isMailSent ? (
+		<>
+			<p>Forgot your password? No problem, we&apos;ll send you an email with instructions to reset it.</p>
+			<FieldsBehavior
+				fieldType="TextField"
+				placeholder="Type your email"
+				title="Email"
+				mandatory={true}
+				value={modalState.input}
+				onChange={handleModalChange}
+				error={modalState.error}
+				helptext={errorText}
+				name="email"
+			/>
+		</>
+	) : (
+		<>
+			<p>
+				We sent you an email with further instructions to reset your password to <strong>{modalState.input}</strong>.
+			</p>
+			<p>If you don&apos;t receive it, please check your spam folder or contact support.</p>
+		</>
+	);
 
-  return (
-    <Modal
-      isOpen={isOpen}
-      hide={handleCloseModal}
-      size="S"
-      title="Recover Password"
-      mainAction={mainAction}
-      secondaryAction={secondaryAction}
-    >
-      {isOpen ? <S.ModalContent data-testid="recovery-modal-content">{ModalContent}</S.ModalContent> : null}
-    </Modal>
-  );
+	return (
+		<Modal
+			isOpen={isOpen}
+			hide={handleCloseModal}
+			size="S"
+			title="Recover Password"
+			mainAction={mainAction}
+			secondaryAction={secondaryAction}
+		>
+			{isOpen ? <S.ModalContent data-testid="recovery-modal-content">{ModalContent}</S.ModalContent> : null}
+		</Modal>
+	);
 };
 
 export interface IRecoveryProps {
-  isOpen: boolean;
-  toggleModal(): void;
+	isOpen: boolean;
+	toggleModal(): void;
 }
 
 export default RecoveryModal;

package/src/components/Login/LoginForm/index.tsx

@@ -8,128 +8,128 @@ import RecoveryModal from "./RecoveryModal";
 import * as S from "./style";
 
 declare global {
-  interface Window {
-    handleErrorClick: () => void;
-  }
+	interface Window {
+		handleErrorClick: () => void;
+	}
 }
 
 const LoginForm = (props: ILoginFormProps): JSX.Element => {
-  const {
-    handleSubmit,
-    email,
-    handleEmail,
-    password,
-    handlePassword,
-    isLoggingIn,
-    settings,
-    rememberMe,
-    handleRememberMe,
-  } = props;
+	const {
+		handleSubmit,
+		email,
+		handleEmail,
+		password,
+		handlePassword,
+		isLoggingIn,
+		settings,
+		rememberMe,
+		handleRememberMe,
+	} = props;
 
-  const [viewPass, setViewPass] = useState(false);
-  const { isOpen, toggleModal } = useModal();
+	const [viewPass, setViewPass] = useState(false);
+	const { isOpen, toggleModal } = useModal();
 
-  window.handleErrorClick = toggleModal;
+	window.handleErrorClick = toggleModal;
 
-  const _handleEmail = (e: string) => handleEmail(e);
+	const _handleEmail = (e: string) => handleEmail(e);
 
-  const _handlePwd = (e: string) => handlePassword(e);
+	const _handlePwd = (e: string) => handlePassword(e);
 
-  const _togglePassword = () => setViewPass(!viewPass);
+	const _togglePassword = () => setViewPass(!viewPass);
 
-  const btnText = isLoggingIn ? "Sending" : "Login";
+	const btnText = isLoggingIn ? "Sending" : "Login";
 
-  const inputType = viewPass ? "text" : "password";
-  const icon = viewPass ? "hide" : "view";
+	const inputType = viewPass ? "text" : "password";
+	const icon = viewPass ? "hide" : "view";
 
-  const textName = settings.welcomeText2 ? settings.welcomeText2 : "Griddo";
-  const nameLogo =
-    textName === "Griddo" ? <img src="/img/logos/logoGriddoExtended@3x.svg" alt="Griddo Logo" /> : textName;
+	const textName = settings.welcomeText2 ? settings.welcomeText2 : "Griddo";
+	const nameLogo =
+		textName === "Griddo" ? <img src="/img/logos/logoGriddoExtended@3x.svg" alt="Griddo Logo" /> : textName;
 
-  return (
-    <S.Wrapper>
-      <S.Main>
-        <S.Header>
-          <S.Title>
-            <div>Welcome to</div>
-            <div>{nameLogo}</div>
-          </S.Title>
-          <S.Subtitle>To start using {textName}, introduce your email and password.</S.Subtitle>
-        </S.Header>
-        <ErrorToast />
-        <S.Form onSubmit={handleSubmit}>
-          <FieldsBehavior
-            fieldType="TextField"
-            title="Email"
-            autoComplete="email"
-            value={email}
-            onChange={_handleEmail}
-            name="email"
-            inversed={true}
-            placeholder="Type your email"
-          />
-          <FieldsBehavior
-            fieldType="TextField"
-            title="Password"
-            inputType={inputType}
-            value={password}
-            onChange={_handlePwd}
-            autoComplete="current-password"
-            icon={icon}
-            onClickIcon={_togglePassword}
-            iconPosition="in"
-            name="password"
-            inversed={true}
-          />
-          <S.Actions>
-            <FieldsBehavior
-              fieldType="UniqueCheck"
-              title=""
-              value={rememberMe}
-              onChange={handleRememberMe}
-              options={[{ title: "Remember me" }]}
-              name="rememberMe"
-              inversed={true}
-            />
-            <S.Password>
-              <span
-                onClick={toggleModal}
-                onKeyDown={toggleModal}
-                role="checkbox"
-                aria-checked="false"
-                tabIndex={0}
-                data-testid="forgot-button"
-              >
-                Lost your password?
-              </span>
-            </S.Password>
-          </S.Actions>
-          <Button type="submit" disabled={isLoggingIn ? true : false}>
-            {btnText}
-          </Button>
-          <RecoveryModal isOpen={isOpen} toggleModal={toggleModal} />
-        </S.Form>
-      </S.Main>
-      <S.Secuoyas>
-        Made with care at{" "}
-        <a href="https://www.secuoyas.com/" target="_blank" rel="noopener noreferrer">
-          <img src="/img/logos/logoSQY.svg" alt="Secuoyas logo" />
-        </a>
-      </S.Secuoyas>
-    </S.Wrapper>
-  );
+	return (
+		<S.Wrapper>
+			<S.Main>
+				<S.Header>
+					<S.Title>
+						<div>Welcome to</div>
+						<div>{nameLogo}</div>
+					</S.Title>
+					<S.Subtitle>To start using {textName}, introduce your email and password.</S.Subtitle>
+				</S.Header>
+				<ErrorToast />
+				<S.Form onSubmit={handleSubmit}>
+					<FieldsBehavior
+						fieldType="TextField"
+						title="Email"
+						autoComplete="email"
+						value={email}
+						onChange={_handleEmail}
+						name="email"
+						inversed={true}
+						placeholder="Type your email"
+					/>
+					<FieldsBehavior
+						fieldType="TextField"
+						title="Password"
+						inputType={inputType}
+						value={password}
+						onChange={_handlePwd}
+						autoComplete="current-password"
+						icon={icon}
+						onClickIcon={_togglePassword}
+						iconPosition="in"
+						name="password"
+						inversed={true}
+					/>
+					<S.Actions>
+						<FieldsBehavior
+							fieldType="UniqueCheck"
+							title=""
+							value={rememberMe}
+							onChange={handleRememberMe}
+							options={[{ title: "Remember me" }]}
+							name="rememberMe"
+							inversed={true}
+						/>
+						<S.Password>
+							<span
+								onClick={toggleModal}
+								onKeyDown={toggleModal}
+								role="checkbox"
+								aria-checked="false"
+								tabIndex={0}
+								data-testid="forgot-button"
+							>
+								Lost your password?
+							</span>
+						</S.Password>
+					</S.Actions>
+					<Button type="submit" disabled={isLoggingIn ? true : false}>
+						{btnText}
+					</Button>
+					<RecoveryModal isOpen={isOpen} toggleModal={toggleModal} />
+				</S.Form>
+			</S.Main>
+			<S.Secuoyas>
+				Made with care at{" "}
+				<a href="https://www.secuoyas.com/" target="_blank" rel="noopener noreferrer">
+					<img src="/img/logos/logoSQY.svg" alt="Secuoyas logo" />
+				</a>
+			</S.Secuoyas>
+		</S.Wrapper>
+	);
 };
 
 export interface ILoginFormProps {
-  handleSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
-  email: string;
-  handleEmail: (email: string) => void;
-  password: string;
-  handlePassword: (password: string) => void;
-  isLoggingIn: boolean;
-  settings: IGlobalSettings;
-  rememberMe: boolean;
-  handleRememberMe: () => void;
+	handleSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
+	email: string;
+	handleEmail: (email: string) => void;
+	password: string;
+	handlePassword: (password: string) => void;
+	isLoggingIn: boolean;
+	settings: IGlobalSettings;
+	rememberMe: boolean;
+	handleRememberMe: () => void;
 }
 
 export default LoginForm;

package/src/components/Login/LoginSSO/index.tsx

@@ -5,72 +5,72 @@ import { IGlobalSettings } from "@ax/containers/App/reducer";
 import * as S from "./style";
 
 const LoginSSO = (props: ILoginSSOProps): JSX.Element => {
-  const { handleSSO, errorSSO, settings } = props;
+	const { handleSSO, errorSSO, settings } = props;
 
-  const handleClick = () => handleSSO();
+	const handleClick = () => handleSSO();
 
-  const welcomeText =
-    settings.SSOWelcomeText && settings.SSOWelcomeText.length ? (
-      settings.SSOWelcomeText
-    ) : (
-      <>
-        To start using Griddo, login with your
-        <br />
-        autentication platform
-      </>
-    );
+	const welcomeText =
+		settings.SSOWelcomeText && settings.SSOWelcomeText.length ? (
+			settings.SSOWelcomeText
+		) : (
+			<>
+				To start using Griddo, login with your
+				<br />
+				autentication platform
+			</>
+		);
 
-  return (
-    <S.Wrapper>
-      <S.Main>
-        <S.Logo>
-          <img src="/img/logos/logoGriddoExtended@3x.svg" alt="Griddo Logo" />
-        </S.Logo>
-        <S.Welcome>
-          Wel
-          <br />
-          come
-        </S.Welcome>
-        <S.StartWrapper>
-          <ErrorToast />
-          {errorSSO ? (
-            <>
-              <S.StyledNotification text={errorSSO} type="error" closeButton={false} />
-              <S.StyledButton type="button" iconFill={false} onClick={handleClick}>
-                <S.ContentButton>
-                  <S.TextButton>Try again</S.TextButton>
-                </S.ContentButton>
-              </S.StyledButton>
-            </>
-          ) : (
-            <>
-              <S.Text>{welcomeText}</S.Text>
-              <S.StyledButton type="button" iconFill={false} onClick={handleClick}>
-                <S.ContentButton>
-                  <S.IconButton>
-                    <Icon name="microsoft" size="16" viewBox={16} />
-                  </S.IconButton>
-                  <S.TextButton>Microsoft ID</S.TextButton>
-                </S.ContentButton>
-              </S.StyledButton>
-            </>
-          )}
-        </S.StartWrapper>
-      </S.Main>
-      <S.Secuoyas>
-        Made with care at{" "}
-        <a href="https://www.secuoyas.com/" target="_blank" rel="noopener noreferrer">
-          <img src="/img/logos/logoSQY.svg" alt="Secuoyas logo" />
-        </a>
-      </S.Secuoyas>
-    </S.Wrapper>
-  );
+	return (
+		<S.Wrapper>
+			<S.Main>
+				<S.Logo>
+					<img src="/img/logos/logoGriddoExtended@3x.svg" alt="Griddo Logo" />
+				</S.Logo>
+				<S.Welcome>
+					Wel
+					<br />
+					come
+				</S.Welcome>
+				<S.StartWrapper>
+					<ErrorToast />
+					{errorSSO ? (
+						<>
+							<S.StyledNotification text={errorSSO} type="error" closeButton={false} />
+							<S.StyledButton type="button" iconFill={false} onClick={handleClick}>
+								<S.ContentButton>
+									<S.TextButton>Try again</S.TextButton>
+								</S.ContentButton>
+							</S.StyledButton>
+						</>
+					) : (
+						<>
+							<S.Text>{welcomeText}</S.Text>
+							<S.StyledButton type="button" iconFill={false} onClick={handleClick}>
+								<S.ContentButton>
+									<S.IconButton>
+										<Icon name="microsoft" size="16" viewBox={16} />
+									</S.IconButton>
+									<S.TextButton>Microsoft ID</S.TextButton>
+								</S.ContentButton>
+							</S.StyledButton>
+						</>
+					)}
+				</S.StartWrapper>
+			</S.Main>
+			<S.Secuoyas>
+				Made with care at{" "}
+				<a href="https://www.secuoyas.com/" target="_blank" rel="noopener noreferrer">
+					<img src="/img/logos/logoSQY.svg" alt="Secuoyas logo" />
+				</a>
+			</S.Secuoyas>
+		</S.Wrapper>
+	);
 };
 
 interface ILoginSSOProps {
-  handleSSO: () => void;
-  errorSSO: string | null;
-  settings: IGlobalSettings;
+	handleSSO: () => void;
+	errorSSO: string | null;
+	settings: IGlobalSettings;
 }
 
 export default LoginSSO;