@griddo/ax 11.10.48 → 11.10.49

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@griddo/ax",
   "description": "Griddo Author Experience",
-  "version": "11.10.48",
+  "version": "11.10.49",
   "authors": [
     "Álvaro Sánchez' <alvaro.sanches@secuoyas.com>",
     "Diego M. Béjar <diego.bejar@secuoyas.com>",
@@ -217,5 +217,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b7897ce23eafb03776e9ab9446685cd32709a00a"
+  "gitHead": "d52de056071bc84545249ed0dd87572e034136d8"
 }

package/src/api/global.tsx

@@ -1,3 +1,4 @@
+import { ICreatePasswordParams } from "@ax/types";
 import { template } from "./config";
 import { IServiceConfig, sendRequest } from "./utils";
 
@@ -53,7 +54,7 @@ const forgotPassword = async (user: string) => {
 	return sendRequest(SERVICES.FORGOT_PASSWORD);
 };
 
-const resetPassword = async (userID: any, data: any) => {
+const resetPassword = async (userID: string, data: ICreatePasswordParams) => {
 	const {
 		host,
 		endpoint: [prefix, suffix],
@@ -64,7 +65,7 @@ const resetPassword = async (userID: any, data: any) => {
 	return sendRequest(SERVICES.RESET_PASSWORD, { ...data });
 };
 
-const createPassword = async (userID: any, data: any) => {
+const createPassword = async (userID: number, data: ICreatePasswordParams) => {
 	const {
 		host,
 		endpoint: [prefix, suffix],

package/src/api/users.tsx

@@ -85,7 +85,7 @@ const getSiteUsers = async (params: any, siteID: number) => {
 	return sendRequest(SERVICES.GET_SITE_USERS);
 };
 
-const getUser = async (id: string | number, token?: string) => {
+const getUser = async (id: number, token?: string) => {
 	const { host, endpoint } = SERVICES.GET_USER;
 
 	SERVICES.GET_USER.dynamicUrl = `${host}${endpoint}${id}`;

package/src/components/LanguageMenu/index.tsx

@@ -14,7 +14,7 @@ const LanguageMenu = (props: ILanguageMenuProps): JSX.Element => {
 	const getLanguageIcon = (lang: string) => {
 		const isCurrentLanguage = lang === language;
 		const isAvailableToEdit = !isCurrentLanguage && isEditableVersion(lang);
-		let iconName;
+		let iconName: string;
 
 		if (isCurrentLanguage) {
 			iconName = "done";

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

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import { useState } from "react";
 
 import { global } from "@ax/api";
 import { isReqOk, validateEmail } from "@ax/helpers";
@@ -20,9 +20,9 @@ const RecoveryModal = (props: IRecoveryProps): JSX.Element => {
 	const handleResetPassword = async () => {
 		const response = await global.forgotPassword(modalState.input);
 		if (isReqOk(response.status)) {
-			setModalState({ ...modalState, isMailSent: true });
+			setModalState((prev) => ({ ...prev, isMailSent: true }));
 		} else {
-			setModalState({ ...modalState, error: true });
+			setModalState((prev) => ({ ...prev, error: true }));
 		}
 	};
 
@@ -32,7 +32,7 @@ const RecoveryModal = (props: IRecoveryProps): JSX.Element => {
 	};
 
 	const handleModalChange = (value: string) => {
-		setModalState({ ...modalState, input: value });
+		setModalState((prev) => ({ ...prev, input: value }));
 	};
 
 	const mainAction = !modalState.isMailSent
@@ -76,7 +76,7 @@ const RecoveryModal = (props: IRecoveryProps): JSX.Element => {
 			mainAction={mainAction}
 			secondaryAction={secondaryAction}
 		>
-			{isOpen ? <S.ModalContent data-testid="recovery-modal-content">{ModalContent}</S.ModalContent> : null}
+			{isOpen && <S.ModalContent data-testid="recovery-modal-content">{ModalContent}</S.ModalContent>}
 		</Modal>
 	);
 };

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

@@ -1,6 +1,6 @@
-import React, { useState } from "react";
+import { useState, useEffect } from "react";
 
-import { IGlobalSettings } from "@ax/containers/App/reducer";
+import type { IGlobalSettings } from "@ax/containers/App/reducer";
 import { useModal } from "@ax/hooks";
 import { Button, FieldsBehavior, ErrorToast } from "@ax/components";
 import RecoveryModal from "./RecoveryModal";
@@ -9,7 +9,7 @@ import * as S from "./style";
 
 declare global {
 	interface Window {
-		handleErrorClick: () => void;
+		handleErrorClick?: () => void;
 	}
 }
 
@@ -29,11 +29,12 @@ const LoginForm = (props: ILoginFormProps): JSX.Element => {
 	const [viewPass, setViewPass] = useState(false);
 	const { isOpen, toggleModal } = useModal();
 
-	window.handleErrorClick = toggleModal;
-
-	const _handleEmail = (e: string) => handleEmail(e);
-
-	const _handlePwd = (e: string) => handlePassword(e);
+	useEffect(() => {
+		window.handleErrorClick = toggleModal;
+		return () => {
+			delete window.handleErrorClick;
+		};
+	}, [toggleModal]);
 
 	const _togglePassword = () => setViewPass(!viewPass);
 
@@ -63,9 +64,9 @@ const LoginForm = (props: ILoginFormProps): JSX.Element => {
 						title="Email"
 						autoComplete="email"
 						value={email}
-						onChange={_handleEmail}
+						onChange={handleEmail}
 						name="email"
-						inversed={true}
+						inversed
 						placeholder="Type your email"
 					/>
 					<FieldsBehavior
@@ -73,13 +74,13 @@ const LoginForm = (props: ILoginFormProps): JSX.Element => {
 						title="Password"
 						inputType={inputType}
 						value={password}
-						onChange={_handlePwd}
+						onChange={handlePassword}
 						autoComplete="current-password"
 						icon={icon}
 						onClickIcon={_togglePassword}
 						iconPosition="in"
 						name="password"
-						inversed={true}
+						inversed
 					/>
 					<S.Actions>
 						<FieldsBehavior
@@ -89,22 +90,26 @@ const LoginForm = (props: ILoginFormProps): JSX.Element => {
 							onChange={handleRememberMe}
 							options={[{ title: "Remember me" }]}
 							name="rememberMe"
-							inversed={true}
+							inversed
 						/>
 						<S.Password>
-							<span
+							<button
+								type="button"
 								onClick={toggleModal}
-								onKeyDown={toggleModal}
-								role="checkbox"
-								aria-checked="false"
+								onKeyDown={(e) => {
+									if (e.key === "Enter" || e.key === " ") {
+										e.preventDefault();
+										toggleModal();
+									}
+								}}
 								tabIndex={0}
 								data-testid="forgot-button"
 							>
 								Lost your password?
-							</span>
+							</button>
 						</S.Password>
 					</S.Actions>
-					<Button type="submit" disabled={isLoggingIn ? true : false}>
+					<Button type="submit" disabled={isLoggingIn}>
 						{btnText}
 					</Button>
 					<RecoveryModal isOpen={isOpen} toggleModal={toggleModal} />

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

@@ -1,6 +1,5 @@
-import React from "react";
 import { Icon, ErrorToast } from "@ax/components";
-import { IGlobalSettings } from "@ax/containers/App/reducer";
+import type { IGlobalSettings } from "@ax/containers/App/reducer";
 
 import * as S from "./style";
 
@@ -9,16 +8,15 @@ const LoginSSO = (props: ILoginSSOProps): JSX.Element => {
 
 	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?.length ? (
+		settings.SSOWelcomeText
+	) : (
+		<>
+			To start using Griddo, login with your
+			<br />
+			autentication platform
+		</>
+	);
 
 	return (
 		<S.Wrapper>

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

@@ -1,4 +1,4 @@
-import React, { useRef } from "react";
+import { useEffect, useRef } from "react";
 import Slider from "react-slick";
 import "slick-carousel/slick/slick.css";
 
@@ -7,13 +7,30 @@ import * as S from "./style";
 const LoginSlider = (props: ILoginSliderProps): JSX.Element => {
 	const { className } = props;
 
-	const customSlider = useRef<any>(null);
+	const customSlider = useRef<Slider | null>(null);
+	const timeoutRef = useRef<NodeJS.Timeout | null>(null);
+
+	const setSliderRef = (slider: Slider | null) => {
+		customSlider.current = slider;
+	};
+
+	useEffect(() => {
+		return () => {
+			if (timeoutRef.current) {
+				clearTimeout(timeoutRef.current);
+			}
+		};
+	}, []);
 
 	const beforeChange = (prev: number, next: number) => {
+		if (!customSlider.current?.innerSlider?.list) return;
+
 		const prevSlideElement = customSlider.current.innerSlider.list.querySelector(`[data-index="${prev}"]`);
 		const nextSlideElement = customSlider.current.innerSlider.list.querySelector(`[data-index="${next}"]`);
 
-		setTimeout(() => {
+		if (!prevSlideElement || !nextSlideElement) return;
+
+		timeoutRef.current = setTimeout(() => {
 			prevSlideElement.classList.add("prev-slide-anim");
 			nextSlideElement.classList.remove("prev-slide-anim");
 		}, 100);
@@ -33,7 +50,7 @@ const LoginSlider = (props: ILoginSliderProps): JSX.Element => {
 	const handleNext = () => customSlider.current?.slickNext();
 	const handlePrev = () => customSlider.current?.slickPrev();
 
-	const Banner = ({ text, image }: any) => (
+	const Banner = ({ text, image }: IBannerProps) => (
 		<S.BannerWrapper>
 			<S.Title>{text}</S.Title>
 			<S.Image image={image} />
@@ -46,18 +63,23 @@ const LoginSlider = (props: ILoginSliderProps): JSX.Element => {
 				<S.Arrow onClick={handlePrev} direction="left" />
 				<S.Arrow onClick={handleNext} direction="right" />
 			</S.Buttons>
-			<Slider {...settings} ref={(slider) => (customSlider.current = slider)}>
+			<Slider {...settings} ref={setSliderRef}>
 				<Banner text="Full independence to publish content at any time" image="/img/slider/content.png" />
 				<Banner text="Thousands of possibilities, literally" image="/img/slider/editor.png" />
-				{/*<Banner text="Optimized images without any effort" image="/img/slider/gallery.png" />*/}
+				<Banner text="Optimized images without any effort" image="/img/slider/gallery.png" />
 				<Banner text="Comprehensive integration with Analytics" image="/img/slider/analytics.png" />
 			</Slider>
 		</S.Wrapper>
 	);
 };
 
+interface IBannerProps {
+	text: string;
+	image: string;
+}
+
 export interface ILoginSliderProps {
-	className: string;
+	className?: string;
 }
 
 export default LoginSlider;

package/src/components/Login/index.tsx

@@ -1,18 +1,12 @@
-import React, { useEffect, useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 
-import { IGlobalSettings } from "@ax/containers/App/reducer";
+import type { IGlobalSettings } from "@ax/containers/App/reducer";
 import { Circle } from "@ax/components";
 import LoginForm from "./LoginForm";
 import LoginSSO from "./LoginSSO";
 
 import * as S from "./style";
 
-declare global {
-	interface Window {
-		handleErrorClick: () => void;
-	}
-}
-
 const Login = (props: ILoginProps): JSX.Element => {
 	const {
 		handleSubmit,
@@ -34,14 +28,19 @@ const Login = (props: ILoginProps): JSX.Element => {
 	const wrapperRef = useRef<HTMLDivElement>(null);
 
 	useEffect(() => {
-		const handleResize = () => wrapperRef.current && setWrapperWidth(wrapperRef.current.clientWidth);
+		const handleResize = () => {
+			if (wrapperRef.current) {
+				setWrapperWidth(wrapperRef.current.clientWidth);
+			}
+		};
 
 		window.addEventListener("resize", handleResize, false);
+		handleResize();
 
-		if (wrapperRef.current) {
-			setWrapperWidth(wrapperRef.current.clientWidth);
-		}
-	}, [wrapperRef]);
+		return () => {
+			window.removeEventListener("resize", handleResize, false);
+		};
+	}, []);
 
 	const _handleAnimationEnd = () => handleLoginSuccess();
 

package/src/containers/App/actions.tsx

@@ -1,7 +1,9 @@
 import { global, languages } from "@ax/api";
 import { isReqOk } from "@ax/helpers";
 import type { IRootState } from "@ax/types";
+import { usersActions } from "@ax/containers/Users";
 
+import type { AxiosResponse } from "axios";
 import differenceInSeconds from "date-fns/differenceInSeconds";
 import type { Dispatch } from "redux";
 
@@ -145,24 +147,30 @@ function handleError(response: any, isMultiple = false, msg?: string): (dispatch
 	};
 }
 
-function login(
-	email?: string,
-	password?: string,
-	rememberMe?: boolean,
-	petitionId?: string,
-): (dispatch: Dispatch) => Promise<boolean> {
-	return async (dispatch) => {
+function login(loginData: {
+	email?: string;
+	password?: string;
+	rememberMe?: boolean;
+	petitionId?: string;
+}): (dispatch: Dispatch, setState: () => IRootState) => Promise<boolean> {
+	return async (dispatch, setState) => {
 		dispatch(setIsLogging(true));
-		const loginResponse: any = await global.login({ username: email, password, petitionId });
+		const { email, password, rememberMe, petitionId } = loginData;
+		const loginResponse: AxiosResponse<{ id: number; token: string }> = await global.login({
+			username: email,
+			password,
+			petitionId,
+		});
 		dispatch(setIsLogging(false));
 		switch (loginResponse?.status) {
 			case 200: {
 				const {
-					data: { token },
+					data: { id, token },
 				} = loginResponse;
-				const langResponse: { status: number; data: any } = await languages.getLanguages(token);
+				const langResponse = await languages.getLanguages(token);
 				isReqOk(langResponse.status) && dispatch(setGlobalLanguages(langResponse.data.items));
 				dispatch(setToken(loginResponse.data.token));
+				await usersActions.getUser(id, token, false)(dispatch, setState);
 				dispatch(setSessionStartedAt(new Date()));
 				dispatch(setHasAnimation(true));
 				if (rememberMe) {

package/src/containers/Users/actions.tsx

@@ -1,4 +1,4 @@
-import { Dispatch } from "redux";
+import type { Dispatch } from "redux";
 import {
 	SET_USERS,
 	SET_USER_FORM,
@@ -8,7 +8,7 @@ import {
 	SET_GLOBAL_PERMISSIONS,
 } from "./constants";
 
-import {
+import type {
 	ISetUsers,
 	ISetCurrentUser,
 	ISetUserForm,
@@ -16,7 +16,7 @@ import {
 	ISetCurrentPermissions,
 	ISetGlobalPermissions,
 } from "./interfaces";
-import { ICreatePasswordParams, IActivateRole, IGetRoles, IRole, IUser, IRootState } from "@ax/types";
+import type { ICreatePasswordParams, IActivateRole, IGetRoles, IRole, IUser, IRootState } from "@ax/types";
 import { global, users, roles } from "@ax/api";
 import { appActions } from "@ax/containers/App";
 import { handleRequest, isReqOk } from "@ax/helpers";
@@ -51,7 +51,7 @@ function getUsers(params: any, siteID?: number | null): (dispatch: Dispatch) =>
 			const callback = async () => (siteID ? users.getSiteUsers(params, siteID) : users.getUsers(params));
 
 			const responseActions = {
-				handleSuccess: (response: any) => {
+				handleSuccess: (response: IUser[]) => {
 					dispatch(setUsers(response));
 				},
 				handleError: (response: any) => appActions.handleError(response)(dispatch),
@@ -59,13 +59,13 @@ function getUsers(params: any, siteID?: number | null): (dispatch: Dispatch) =>
 
 			await handleRequest(callback, responseActions, [appActions.setIsLoading])(dispatch);
 		} catch (e) {
-			console.log(e); // TODO: capturar error bien
+			console.log(e);
 		}
 	};
 }
 
 function getUser(
-	id: string | number,
+	id: number,
 	token?: string,
 	hasLoading = true,
 ): (dispatch: Dispatch, getState: () => IRootState) => Promise<void> {
@@ -77,13 +77,10 @@ function getUser(
 				handleSuccess: (response: IUser) => {
 					if (token) {
 						dispatch(appActions.setToken(token));
-					}
-					if (id === "me") {
 						dispatch(setCurrentUser(response));
 						getUserCurrentPermissions()(dispatch, getState);
-					} else {
-						dispatch(setUserForm(response));
 					}
+					dispatch(setUserForm(response));
 				},
 				handleError: (response: any) => appActions.handleError(response)(dispatch),
 			};
@@ -92,7 +89,7 @@ function getUser(
 
 			await handleRequest(callback, responseActions, loading)(dispatch);
 		} catch (e) {
-			console.log(e); // TODO: capturar error bien
+			console.log(e);
 		}
 	};
 }
@@ -165,14 +162,14 @@ function createUser(data: { name: string; email: string }): (dispatch: Dispatch)
 
 			return await handleRequest(callback, responseActions, [appActions.setIsLoading])(dispatch);
 		} catch (e) {
-			console.log(e); // TODO: capturar error bien
+			console.log(e);
 			return false;
 		}
 	};
 }
 
 function createPassword(
-	id: string,
+	id: number,
 	params: ICreatePasswordParams,
 ): (dispatch: Dispatch, getState: () => IRootState) => Promise<boolean> {
 	return async (dispatch, getState) => {
@@ -182,14 +179,15 @@ function createPassword(
 			const responseActions = {
 				handleSuccess: async (response: any) => {
 					dispatch(appActions.setToken(response.token));
-					await getUser("me", response.token)(dispatch, getState);
+					await getRoles({ siteId: "global" }, response.token, false)(dispatch);
+					await getUser(id, response.token, false)(dispatch, getState);
 				},
 				handleError: (response: any) => appActions.handleError(response)(dispatch),
 			};
 
 			return await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
 		} catch (e) {
-			console.log(e); // TODO: capturar error bien
+			console.log(e);
 			return false;
 		}
 	};
@@ -330,20 +328,18 @@ function getUserCurrentPermissions(): (dispatch: Dispatch, getState: () => IRoot
 			: currentUser.roles.find((roleSite) => roleSite.siteId === "global")?.roles;
 
 		let permissions: string[] = [];
-		if (userRoles && userRoles.length) {
+		if (userRoles?.length) {
 			userRoles.forEach((roleID: number) => {
-				const rolePerms =
-					roles &&
-					roles.reduce((acc: string[], curr: IRole) => {
-						if (curr.id === roleID) {
-							const permissions = currentSiteInfo
-								? curr.permissions.sitePermissions
-								: [...curr.permissions.globalPermissions, ...curr.permissions.sitePermissions];
-							const keys = permissions.map((perm) => perm.key);
-							acc = [...acc, ...keys];
-						}
-						return acc;
-					}, []);
+				const rolePerms = roles?.reduce((acc: string[], curr: IRole) => {
+					if (curr.id === roleID) {
+						const permissions = currentSiteInfo
+							? curr.permissions.sitePermissions
+							: [...curr.permissions.globalPermissions, ...curr.permissions.sitePermissions];
+						const keys = permissions.map((perm) => perm.key);
+						acc.push(...keys);
+					}
+					return acc;
+				}, []);
 				permissions = [...permissions, ...rolePerms];
 			});
 		}

package/src/helpers/requests.tsx

@@ -1,4 +1,4 @@
-import { Dispatch } from "redux";
+import type { Dispatch } from "redux";
 
 const isReqOk = (reqStatus: number) => reqStatus >= 200 && reqStatus < 400;
 

package/src/modules/App/Routing/index.tsx

@@ -3,13 +3,13 @@ import { connect } from "react-redux";
 import { Switch, Route, matchPath } from "react-router-dom";
 
 import { ErrorGuard } from "@ax/guards";
-import { IRootState, IUser } from "@ax/types";
+import type { IRootState, IUser } from "@ax/types";
 import { appActions } from "@ax/containers/App";
-import { publicRoutes, privateRoutes, routes, IRouter } from "@ax/routes";
-import { ILogoutAction } from "@ax/containers/App/interfaces";
+import { publicRoutes, privateRoutes, routes, type IRouter } from "@ax/routes";
+import type { ILogoutAction } from "@ax/containers/App/interfaces";
 import { ErrorPage } from "@ax/components";
 import { usePermission } from "@ax/hooks";
-import { IGlobalSettings } from "@ax/containers/App/reducer";
+import type { IGlobalSettings } from "@ax/containers/App/reducer";
 import NavMenu from "./NavMenu";
 import PrivateRoute from "./PrivateRoute";
 import Logout from "./Logout";
@@ -36,7 +36,7 @@ const Routing = (props: IProps) => {
 	}, []);
 
 	const route: IRouter | undefined = routes.find((item: IRouter) => {
-		const cleanPath = path && path.replace(/\/$/, "");
+		const cleanPath = path?.replace(/\/$/, "");
 
 		const match = cleanPath
 			? matchPath(cleanPath, {
@@ -48,10 +48,9 @@ const Routing = (props: IProps) => {
 
 		return (
 			!!match ||
-			(item.routesGroups &&
-				item.routesGroups.find((subitem) => {
-					return subitem.routes.find((subroute) => subroute.path === path);
-				}))
+			item.routesGroups?.find((subitem) => {
+				return subitem.routes.find((subroute) => subroute.path === path);
+			})
 		);
 	});
 
@@ -89,8 +88,7 @@ const Routing = (props: IProps) => {
 			.map((singleRoute: IRouter, i) => (
 				<React.Fragment key={i}>
 					{getRoute(singleRoute.component, singleRoute.path, isPrivate, singleRoute.permission)}
-					{singleRoute.routesGroups &&
-						singleRoute.routesGroups.map((subgroup: any) => mapSubroutes(subgroup, isPrivate))}
+					{singleRoute.routesGroups?.map((subgroup: any) => mapSubroutes(subgroup, isPrivate))}
 				</React.Fragment>
 			));
 

package/src/modules/CreatePass/index.tsx

@@ -1,11 +1,11 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import { useParams } from "react-router-dom";
 import { connect } from "react-redux";
 
 import { appActions } from "@ax/containers/App";
 import { usersActions } from "@ax/containers/Users";
 import { Button, FieldsBehavior, ErrorToast } from "@ax/components";
-import { ICreatePasswordParams } from "@ax/types";
+import type { ICreatePasswordParams } from "@ax/types";
 
 import * as S from "./style";
 
@@ -28,14 +28,14 @@ const CreatePass = (props: IProps) => {
 	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
 		e.preventDefault();
 
-		const params = {
+		const params: ICreatePasswordParams = {
 			id,
 			token,
 			password: state.pass1,
 			retypedPassword: state.pass2,
 		};
 
-		const passCreated = await createPassword(id, params);
+		const passCreated = await createPassword(parseInt(id), params);
 		if (passCreated) {
 			setHistoryPush("/profile?init=true");
 		}
@@ -82,8 +82,8 @@ const CreatePass = (props: IProps) => {
 };
 
 interface IProps {
-	setHistoryPush(path: string): any;
-	createPassword(id: string, params: ICreatePasswordParams): Promise<boolean>;
+	setHistoryPush(path: string): Promise<void>;
+	createPassword(id: number, params: ICreatePasswordParams): Promise<boolean>;
 }
 
 const mapDispatchToProps = {

package/src/modules/Login/index.tsx

@@ -37,7 +37,7 @@ const LoginModule = (props: IProps) => {
 	// biome-ignore lint/correctness/useExhaustiveDependencies: TODO: fix this
 	useEffect(() => {
 		const handleLogin = async () => {
-			const isLogged = await login(undefined, undefined, undefined, petitionId);
+			const isLogged = await login({ petitionId });
 			if (isLogged) {
 				setIsSuccess(true);
 			}
@@ -59,7 +59,7 @@ const LoginModule = (props: IProps) => {
 
 	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
 		e.preventDefault();
-		const isLogged = await login(state.email, state.password, state.rememberMe);
+		const isLogged = await login({ email: state.email, password: state.password, rememberMe: state.rememberMe });
 		if (isLogged) {
 			setIsSuccess(true);
 		}
@@ -74,12 +74,12 @@ const LoginModule = (props: IProps) => {
 
 	const _handleEmail = (email: string) => {
 		resetError();
-		setState({ ...state, email });
+		setState((prev) => ({ ...prev, email }));
 	};
 
 	const handlePassword = (password: string) => {
 		resetError();
-		setState({ ...state, password });
+		setState((prev) => ({ ...prev, password }));
 	};
 
 	const handleLoginSuccess = () => {
@@ -87,7 +87,7 @@ const LoginModule = (props: IProps) => {
 		setHistoryPush(welcomePageURI);
 	};
 
-	const _handleRememberMe = () => setState({ ...state, rememberMe: !state.rememberMe });
+	const _handleRememberMe = () => setState((prev) => ({ ...prev, rememberMe: !state.rememberMe }));
 
 	return (
 		<Login
@@ -111,7 +111,7 @@ const LoginModule = (props: IProps) => {
 interface IProps {
 	isLoggingIn: boolean;
 	globalSettings: IGlobalSettings;
-	login(email?: string, password?: string, rememberMe?: boolean, petitionId?: string): Promise<boolean>;
+	login(loginData: { email?: string; password?: string; rememberMe?: boolean; petitionId?: string }): Promise<boolean>;
 	loginSSO(): Promise<string | null>;
 	resetError(): void;
 	getGlobalSettings(): void;

package/src/modules/ResetPass/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import { useParams } from "react-router-dom";
 import { connect } from "react-redux";
 
@@ -6,6 +6,7 @@ import { isReqOk } from "@ax/helpers";
 import { global } from "@ax/api";
 import { appActions } from "@ax/containers/App";
 import { Button, FieldsBehavior } from "@ax/components";
+import type { ICreatePasswordParams } from "@ax/types";
 
 import * as S from "./style";
 
@@ -28,7 +29,7 @@ const ResetPass = (props: IProps) => {
 	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
 		e.preventDefault();
 
-		const params = {
+		const params: ICreatePasswordParams = {
 			id,
 			token,
 			password: state.pass1,
@@ -39,8 +40,6 @@ const ResetPass = (props: IProps) => {
 		if (isReqOk(response.status) && response.data.code === 200) {
 			setHistoryPush("/login");
 		}
-
-		// TODO error and success messages
 	};
 
 	const validPasswords = state.pass1.trim() !== "" && state.pass2.trim() && state.pass1 === state.pass2;
@@ -80,7 +79,7 @@ const ResetPass = (props: IProps) => {
 };
 
 interface IProps {
-	setHistoryPush(path: string): any;
+	setHistoryPush(path: string): Promise<void>;
 }
 
 const mapDispatchToProps = {

package/src/modules/Sites/index.tsx

@@ -18,12 +18,12 @@ const Sites = (props: ISitesProps): JSX.Element => {
 		getStructuredData,
 		setLanguage,
 		getAllDataPacks,
-		getUser,
 		globalLangs,
 		getRoles,
 		updateCurrentSearch,
 		resetCurrentData,
 		setIsLoading,
+		getUserCurrentPermissions,
 	} = props;
 
 	// biome-ignore lint/correctness/useExhaustiveDependencies: TODO: fix this
@@ -34,7 +34,7 @@ const Sites = (props: ISitesProps): JSX.Element => {
 			updateCurrentSearch("");
 			resetCurrentData();
 			await getRoles({ siteId: "global" }, token, false);
-			await getUser("me", token, false);
+			await getUserCurrentPermissions();
 			await getStructuredData(token, null, false);
 			await getAllDataPacks();
 
@@ -72,11 +72,11 @@ interface IDispatchProps {
 	getStructuredData(token: string, siteId?: number | null, hasLoading?: boolean): Promise<void>;
 	setLanguage(lang: { locale: string; id: number | null }): void;
 	getAllDataPacks: () => Promise<void>;
-	getUser: (id: string, token?: string, hasLoading?: boolean) => Promise<void>;
 	getRoles: (params: IGetRoles, token?: string, hasLoading?: boolean) => Promise<void>;
 	updateCurrentSearch(query: string): Promise<void>;
 	resetCurrentData(): Promise<void>;
 	setIsLoading(isLoading: boolean): void;
+	getUserCurrentPermissions(): Promise<void>;
 }
 
 export type ISitesProps = IStateProps & IDispatchProps & RouteComponentProps;
@@ -86,11 +86,11 @@ const mapDispatchToProps = {
 	getStructuredData: structuredDataActions.getStructuredData,
 	setLanguage: appActions.setLanguage,
 	getAllDataPacks: dataPacksActions.getAllDataPacks,
-	getUser: usersActions.getUser,
 	getRoles: usersActions.getRoles,
 	updateCurrentSearch: structuredDataActions.updateCurrentSearch,
 	resetCurrentData: structuredDataActions.resetCurrentData,
 	setIsLoading: appActions.setIsLoading,
+	getUserCurrentPermissions: usersActions.getUserCurrentPermissions,
 };
 
 export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Sites));

package/src/modules/Users/Profile/index.tsx

@@ -1,18 +1,18 @@
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { connect } from "react-redux";
 
 import { appActions } from "@ax/containers/App";
 import { usersActions } from "@ax/containers/Users";
 import { sitesActions } from "@ax/containers/Sites";
 import { Loading, MainWrapper } from "@ax/components";
-import { IGetRoles, IRootState, ISite, IUser } from "@ax/types";
+import type { IRootState, ISite, IUser } from "@ax/types";
 import { useModal, useShouldBeSaved, useURLSearchParam } from "@ax/hooks";
 
 import UserForm from "../UserForm";
 import { LinkDeviceModal } from "./atoms";
 
 const Profile = (props: IProps) => {
-	const { user, getUser, updateUser, isSaving, isLoading, getSites, getRoles, currentSiteInfo, token } = props;
+	const { user, updateUser, isSaving, isLoading, getSites, currentSiteInfo, token } = props;
 
 	if (!user) {
 		throw new Error(`ERROR: User reached Profile with null user`);
@@ -28,9 +28,8 @@ const Profile = (props: IProps) => {
 
 	// biome-ignore lint/correctness/useExhaustiveDependencies: TODO: fix this
 	useEffect(() => {
-		isUserInit ? getSites() : getUser("me");
-		const siteId = isSiteView ? currentSiteInfo.id : "global";
-		getRoles({ siteId });
+		const getUserData = async () => await getSites();
+		isUserInit && getUserData();
 	}, []);
 
 	useEffect(() => {
@@ -85,19 +84,15 @@ const mapStateToProps = (state: IRootState) => ({
 });
 
 interface IDispatchProps {
-	setHistoryPush(path: string): any;
-	getUser(id: string): any;
+	setHistoryPush(path: string): Promise<void>;
 	getSites(): Promise<void>;
-	updateUser(id: number, data: any, isProfile: boolean, isList: boolean): any;
-	getRoles(params: IGetRoles): Promise<void>;
+	updateUser(id: number, data: IUser, isProfile: boolean, isList: boolean): Promise<boolean>;
 }
 
 const mapDispatchToProps = {
 	setHistoryPush: appActions.setHistoryPush,
-	getUser: usersActions.getUser,
 	updateUser: usersActions.updateUser,
 	getSites: sitesActions.getSites,
-	getRoles: usersActions.getRoles,
 };
 
 interface IProfileProps {

package/src/modules/Users/UserCreate/index.tsx

@@ -1,6 +1,6 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import { connect } from "react-redux";
-import { ISite, IRootState, IUser, IRole, ISiteRoles } from "@ax/types";
+import type { ISite, IRootState, IUser, IRole, ISiteRoles } from "@ax/types";
 import { appActions } from "@ax/containers/App";
 import { usersActions } from "@ax/containers/Users";
 import { ErrorToast, FieldsBehavior, MainWrapper, SearchField, Notification, Button, Modal } from "@ax/components";
@@ -155,7 +155,6 @@ const UserCreate = (props: IUserCreateProps) => {
 					value={state.name}
 					onChange={handleNameChange}
 					autoComplete="user-name"
-					autoFocus
 				/>
 				<FieldsBehavior
 					title="Email"
@@ -183,11 +182,10 @@ const UserCreate = (props: IUserCreateProps) => {
 							</S.SettingContent>
 						</S.SettingsWrapper>
 						<S.RoleList data-testid="user-role-list">
-							{siteSelectedRoles &&
-								siteSelectedRoles.roles.map((siteRoleId: number) => {
-									const role = roles.find((role: IRole) => role.id === siteRoleId);
-									return role && <RoleItem key={role.name} role={role} isReadOnly={true} />;
-								})}
+							{siteSelectedRoles?.roles.map((siteRoleId: number) => {
+								const role = roles.find((role: IRole) => role.id === siteRoleId);
+								return role && <RoleItem key={role.name} role={role} isReadOnly={true} />;
+							})}
 							{siteSelectedRoles && siteSelectedRoles.roles.length > 0 && (
 								<Button type="button" buttonStyle="line" onClick={toggleModal}>
 									Manage user roles
@@ -302,9 +300,9 @@ const UserCreate = (props: IUserCreateProps) => {
 				size="S"
 			>
 				<S.ModalContent>
-					Before creating an account, <strong>select the user's permissions and site access</strong>. If you proceed
-					without selecting any permissions, the user <strong>won't have access to anything or view any content</strong>
-					.
+					Before creating an account, <strong>select the user&apos;s permissions and site access</strong>. If you
+					proceed without selecting any permissions, the user{" "}
+					<strong>won&apos;t have access to anything or view any content</strong>.
 				</S.ModalContent>
 			</Modal>
 		</MainWrapper>

package/src/modules/Users/UserEdit/index.tsx

@@ -51,14 +51,12 @@ const UserEdit = (props: IProps) => {
 		action: form.roles.length === 0 && !form.isSuperAdmin ? toggleAdviseModal : handleSave,
 	};
 
-	const handleDelete = () => {
-		user.id &&
-			deleteUser(user.id).then((deleted: boolean) => {
-				if (deleted) {
-					setForm({ ...form, id: null });
-					setHistoryPush(usersRoute);
-				}
-			});
+	const handleDelete = async () => {
+		if (!user.id) return;
+		const isDeleted = await deleteUser(user.id);
+		if (isDeleted) {
+			setHistoryPush(usersRoute);
+		}
 	};
 
 	const isSameUser = currentUser && currentUser.id === user.id;

package/src/modules/Users/UserForm/index.tsx

@@ -1,9 +1,9 @@
-import React, { useState, useEffect } from "react";
+import { useState, useEffect } from "react";
 import { connect } from "react-redux";
 
 import { appActions } from "@ax/containers/App";
 import { Button, ErrorToast, FieldsBehavior, SearchField } from "@ax/components";
-import { IImage, IRootState, IUser, ISite, IRole, ISiteRoles } from "@ax/types";
+import type { IImage, IRootState, IUser, ISite, IRole, ISiteRoles } from "@ax/types";
 import { useModal } from "@ax/hooks";
 import { RouteLeavingGuard } from "@ax/guards";
 
@@ -308,12 +308,11 @@ const UserForm = (props: IProps) => {
 								</S.SettingContent>
 							</S.SettingsWrapper>
 							<S.RoleList>
-								{siteSelectedRoles &&
-									siteSelectedRoles.roles.map((siteRoleId: number) => {
-										const role = roles.find((role: IRole) => role.id === siteRoleId);
-										return role && <RoleItem key={role.name} role={role} isReadOnly={true} />;
-									})}
-								{siteSelectedRoles && siteSelectedRoles.roles.length > 0 && (
+								{siteSelectedRoles?.roles.map((siteRoleId: number) => {
+									const role = roles.find((role: IRole) => role.id === siteRoleId);
+									return role && <RoleItem key={role.name} role={role} isReadOnly={true} />;
+								})}
+								{siteSelectedRoles && siteSelectedRoles.roles.length > 0 && !isSameUser && (
 									<Button type="button" buttonStyle="line" onClick={toggleRoleModal}>
 										Manage user roles
 									</Button>
@@ -506,7 +505,7 @@ const mapStateToProps = (state: IRootState) => ({
 });
 
 interface IDispatchProps {
-	setHistoryPush(path: string): void;
+	setHistoryPush(path: string): Promise<void>;
 }
 
 const mapDispatchToProps = {