@griddo/ax 12.3.0-beta.0 → 12.4.0

package/src/__tests__/components/Login/Login.test.tsx

@@ -24,15 +24,15 @@ const settings = {
 describe("Login component rendering", () => {
 	it("should render the component", () => {
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn(),
+			handleSubmit: vi.fn(),
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "password",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -48,17 +48,17 @@ describe("Login component rendering", () => {
 	});
 
 	it("should render the component with log button disabled", () => {
-		const handleSubmitMock = jest.fn();
+		const handleSubmitMock = vi.fn();
 		const defaultProps: ILoginProps = {
 			handleSubmit: handleSubmitMock,
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "password",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: true,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -78,17 +78,17 @@ describe("Login component rendering", () => {
 
 describe("Login component events", () => {
 	it("should call submit function on button click", () => {
-		const handleSubmitMock = jest.fn((e) => e.preventDefault());
+		const handleSubmitMock = vi.fn((e) => e.preventDefault());
 		const defaultProps: ILoginProps = {
 			handleSubmit: handleSubmitMock,
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "password",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -104,17 +104,17 @@ describe("Login component events", () => {
 	});
 
 	it("should call handleEmail function on email change", () => {
-		const handleEmailMock = jest.fn();
+		const handleEmailMock = vi.fn();
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn((e) => e.preventDefault()),
+			handleSubmit: vi.fn((e) => e.preventDefault()),
 			email: "hola@secuoyas.com",
 			handleEmail: handleEmailMock,
 			password: "password",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -130,17 +130,17 @@ describe("Login component events", () => {
 	});
 
 	it("should call handlePassword function on password change", () => {
-		const handlePasswordMock = jest.fn();
+		const handlePasswordMock = vi.fn();
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn((e) => e.preventDefault()),
+			handleSubmit: vi.fn((e) => e.preventDefault()),
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "password",
 			handlePassword: handlePasswordMock,
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -156,13 +156,13 @@ describe("Login component events", () => {
 	});
 
 	it("should call handleRememberMe function on input click", () => {
-		const handleRememberMeMock = jest.fn();
+		const handleRememberMeMock = vi.fn();
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn((e) => e.preventDefault()),
+			handleSubmit: vi.fn((e) => e.preventDefault()),
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "password",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
@@ -183,15 +183,15 @@ describe("Login component events", () => {
 
 	it("should change input type on button click", () => {
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn((e) => e.preventDefault()),
+			handleSubmit: vi.fn((e) => e.preventDefault()),
 			email: "hola@secuoyas.com",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(
@@ -215,15 +215,15 @@ describe("Login component events", () => {
 describe("Recovery Modal rendering", () => {
 	it("should render the recovery modal on button click", () => {
 		const defaultProps: ILoginProps = {
-			handleSubmit: jest.fn(),
+			handleSubmit: vi.fn(),
 			email: "",
-			handleEmail: jest.fn(),
+			handleEmail: vi.fn(),
 			password: "",
-			handlePassword: jest.fn(),
+			handlePassword: vi.fn(),
 			isLoggingIn: false,
 			settings,
 			rememberMe: false,
-			handleRememberMe: jest.fn(),
+			handleRememberMe: vi.fn(),
 		};
 
 		render(

package/src/__tests__/components/Login/RecoveryModal/RecoveryModal.test.tsx

@@ -1,3 +1,4 @@
+import type { MockedFunction } from "vitest";
 import * as React from "react";
 import Axios from "axios";
 import { ThemeProvider } from "styled-components";
@@ -10,14 +11,14 @@ import globalTheme from "@ax/themes/theme.json";
 
 afterEach(cleanup);
 
-jest.mock("axios"); // This overwrites axios methods with jest Mock
-const mockedAxios = Axios as jest.MockedFunction<typeof Axios>;
+vi.mock("axios"); // This overwrites axios methods with jest Mock
+const mockedAxios = Axios as MockedFunction<typeof Axios>;
 
 describe("Recovery modal component rendering", () => {
 	it("should render the component if closed", () => {
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
-			toggleModal: jest.fn(),
+			toggleModal: vi.fn(),
 		};
 
 		render(
@@ -33,7 +34,7 @@ describe("Recovery modal component rendering", () => {
 	it("should not render the component content if closed", () => {
 		const defaultProps: IRecoveryProps = {
 			isOpen: false,
-			toggleModal: jest.fn(),
+			toggleModal: vi.fn(),
 		};
 
 		render(
@@ -49,7 +50,7 @@ describe("Recovery modal component rendering", () => {
 
 describe("Login component events", () => {
 	it("should call toggleModal on cancel button click", () => {
-		const toggleModalMock = jest.fn();
+		const toggleModalMock = vi.fn();
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
 			toggleModal: toggleModalMock,
@@ -69,7 +70,7 @@ describe("Login component events", () => {
 	});
 
 	it("should disable button if email is not valid", () => {
-		const toggleModalMock = jest.fn();
+		const toggleModalMock = vi.fn();
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
 			toggleModal: toggleModalMock,
@@ -91,7 +92,7 @@ describe("Login component events", () => {
 	});
 
 	it("should enable button if email is valid", async () => {
-		const toggleModalMock = jest.fn();
+		const toggleModalMock = vi.fn();
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
 			toggleModal: toggleModalMock,
@@ -117,7 +118,7 @@ describe("Login component events", () => {
 	it("should hide input if api response is ok", async () => {
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
-			toggleModal: jest.fn(),
+			toggleModal: vi.fn(),
 		};
 
 		const data = { data: [], status: 200, statusText: "Ok", headers: {}, config: {} };
@@ -153,7 +154,7 @@ describe("Login component events", () => {
 	it("should show error if api response is not ok", async () => {
 		const defaultProps: IRecoveryProps = {
 			isOpen: true,
-			toggleModal: jest.fn(),
+			toggleModal: vi.fn(),
 		};
 
 		const data = { data: [], status: 400, statusText: "error", headers: {}, config: {} };

package/src/__tests__/components/MainWrapper/AppBar/AppBar.test.tsx

@@ -162,7 +162,7 @@ describe("AppBar component rendering", () => {
 				{ name: "tab2", text: "Tab 2" },
 			],
 			selectedTab: "tab1",
-			action: jest.fn(),
+			action: vi.fn(),
 		};
 
 		const defaultProps: IAppBarProps = {
@@ -185,7 +185,7 @@ describe("AppBar component rendering", () => {
 		const tabs = {
 			tabSet: ["Tab 1", "Tab 2"],
 			selectedTab: "Tab 1",
-			action: jest.fn(),
+			action: vi.fn(),
 		};
 
 		const defaultProps: IAppBarProps = {
@@ -207,7 +207,7 @@ describe("AppBar component rendering", () => {
 	it("should render the search field", () => {
 		const defaultProps: IAppBarProps = {
 			title: "the title",
-			searchAction: jest.fn(),
+			searchAction: vi.fn(),
 		};
 
 		render(
@@ -262,12 +262,12 @@ describe("AppBar component rendering", () => {
 				{
 					icon: "icon",
 					label: "Action 1",
-					action: jest.fn(),
+					action: vi.fn(),
 				},
 				{
 					icon: "icon2",
 					label: "Action 2",
-					action: jest.fn(),
+					action: vi.fn(),
 				},
 			],
 		};
@@ -330,7 +330,7 @@ describe("AppBar component rendering", () => {
 			title: "the title",
 			rightLineButton: {
 				label,
-				action: jest.fn(),
+				action: vi.fn(),
 			},
 		};
 
@@ -351,7 +351,7 @@ describe("AppBar component rendering", () => {
 			title: "the title",
 			rightButton: {
 				label,
-				action: jest.fn(),
+				action: vi.fn(),
 			},
 		};
 
@@ -375,15 +375,15 @@ describe("AppBar component rendering", () => {
 					{
 						icon: "icon",
 						label: "Action 1",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 					{
 						icon: "icon2",
 						label: "Action 2",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 				],
-				button: { label: "the menu button", action: jest.fn() },
+				button: { label: "the menu button", action: vi.fn() },
 			},
 		};
 
@@ -409,15 +409,15 @@ describe("AppBar component events", () => {
 					{
 						icon: "icon",
 						label: "Action 1",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 					{
 						icon: "icon2",
 						label: "Action 2",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 				],
-				button: { label: "the menu button", action: jest.fn() },
+				button: { label: "the menu button", action: vi.fn() },
 			},
 			language: { locale: "en_GB", id: 4 },
 			availableLanguages: [
@@ -443,9 +443,9 @@ describe("AppBar component events", () => {
 				},
 			],
 			languageActions: {
-				createNewTranslation: jest.fn(),
-				getSiteContent: jest.fn(),
-				setLanguage: jest.fn(),
+				createNewTranslation: vi.fn(),
+				getSiteContent: vi.fn(),
+				setLanguage: vi.fn(),
 			},
 		};
 
@@ -478,27 +478,27 @@ describe("AppBar component events", () => {
 					{
 						icon: "icon",
 						label: "Action 1",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 					{
 						icon: "icon2",
 						label: "Action 2",
-						action: jest.fn(),
+						action: vi.fn(),
 					},
 				],
-				button: { label: "the menu button", action: jest.fn() },
+				button: { label: "the menu button", action: vi.fn() },
 			},
 			pageStatus: "active",
 			pageStatusActions: [
 				{
 					icon: "icon",
 					label: "Action 1",
-					action: jest.fn(),
+					action: vi.fn(),
 				},
 				{
 					icon: "icon2",
 					label: "Action 2",
-					action: jest.fn(),
+					action: vi.fn(),
 				},
 			],
 		};

package/src/__tests__/components/MenuItem/MenuItem.test.tsx

@@ -45,7 +45,7 @@ describe("MenuItem component rendering", () => {
 	it("should render with extendend action visible", () => {
 		const defaultProps: IMenuItemProps = {
 			children: <div>Item</div>,
-			extendedAction: { icon: "delete", action: jest.fn(), onlyOnHover: false },
+			extendedAction: { icon: "delete", action: vi.fn(), onlyOnHover: false },
 		};
 
 		render(
@@ -63,7 +63,7 @@ describe("MenuItem component rendering", () => {
 	it("should render with extendend action not visible", () => {
 		const defaultProps: IMenuItemProps = {
 			children: <div>Item</div>,
-			extendedAction: { icon: "delete", action: jest.fn(), onlyOnHover: true },
+			extendedAction: { icon: "delete", action: vi.fn(), onlyOnHover: true },
 		};
 
 		render(
@@ -81,7 +81,7 @@ describe("MenuItem component rendering", () => {
 	it("should render with extendend action not visible if onlyOnHover is undefined", () => {
 		const defaultProps: IMenuItemProps = {
 			children: <div>Item</div>,
-			extendedAction: { icon: "delete", action: jest.fn() },
+			extendedAction: { icon: "delete", action: vi.fn() },
 		};
 
 		render(
@@ -99,7 +99,7 @@ describe("MenuItem component rendering", () => {
 
 describe("component events", () => {
 	test("onClick is been called", () => {
-		const onClickMock = jest.fn();
+		const onClickMock = vi.fn();
 		const defaultProps: IMenuItemProps = {
 			children: <div>Item</div>,
 			onClick: onClickMock,
@@ -118,7 +118,7 @@ describe("component events", () => {
 	});
 
 	test("extended action is called", async () => {
-		const actionMock = jest.fn();
+		const actionMock = vi.fn();
 		const defaultProps: IMenuItemProps = {
 			children: <div>Item</div>,
 			extendedAction: { icon: "delete", action: actionMock, onlyOnHover: false },

package/src/__tests__/components/Modal/Modal.test.tsx

@@ -14,7 +14,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 		};
 
 		render(
@@ -33,7 +33,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: false,
-			hide: jest.fn(),
+			hide: vi.fn(),
 		};
 
 		render(
@@ -51,7 +51,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			title: titleText,
 		};
 
@@ -70,10 +70,10 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			mainAction: {
 				title: buttonText,
-				onClick: jest.fn(),
+				onClick: vi.fn(),
 			},
 		};
 
@@ -92,10 +92,10 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			mainAction: {
 				title: buttonText,
-				onClick: jest.fn(),
+				onClick: vi.fn(),
 				disabled: true,
 			},
 		};
@@ -116,10 +116,10 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			secondaryAction: {
 				title: buttonText,
-				onClick: jest.fn(),
+				onClick: vi.fn(),
 			},
 		};
 
@@ -137,7 +137,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			overflow: "hidden",
 		};
 
@@ -157,7 +157,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			size: "M",
 		};
 
@@ -176,7 +176,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			size: "L",
 		};
 
@@ -195,7 +195,7 @@ describe("Modal component rendering", () => {
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			size: "XL",
 		};
 
@@ -213,7 +213,7 @@ describe("Modal component rendering", () => {
 
 describe("Modal events", () => {
 	it("should call hide on icon button click", () => {
-		const hideMock = jest.fn();
+		const hideMock = vi.fn();
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
@@ -233,12 +233,12 @@ describe("Modal events", () => {
 	});
 
 	it("should call action on main action button click", () => {
-		const actionMock = jest.fn();
+		const actionMock = vi.fn();
 		const buttonText = "Main Action";
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			mainAction: {
 				title: buttonText,
 				onClick: actionMock,
@@ -258,12 +258,12 @@ describe("Modal events", () => {
 	});
 
 	it("should not call action on main action button click if disabled", () => {
-		const actionMock = jest.fn();
+		const actionMock = vi.fn();
 		const buttonText = "Main Action";
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			mainAction: {
 				title: buttonText,
 				onClick: actionMock,
@@ -284,12 +284,12 @@ describe("Modal events", () => {
 	});
 
 	it("should call action on secondary action button click", () => {
-		const actionMock = jest.fn();
+		const actionMock = vi.fn();
 		const buttonText = "Secondary Action";
 		const defaultProps: IModalProps = {
 			children: <div>the children</div>,
 			isOpen: true,
-			hide: jest.fn(),
+			hide: vi.fn(),
 			secondaryAction: {
 				title: buttonText,
 				onClick: actionMock,

package/src/__tests__/components/Nav/Nav.test.tsx

@@ -22,7 +22,7 @@ describe("Nav component rendering", () => {
 		const defaultProps: INavProps = {
 			items,
 			current: items[0],
-			onClick: jest.fn(),
+			onClick: vi.fn(),
 		};
 
 		render(
@@ -40,7 +40,7 @@ describe("Nav component rendering", () => {
 		const defaultProps: INavProps = {
 			items: [],
 			current: undefined,
-			onClick: jest.fn(),
+			onClick: vi.fn(),
 		};
 
 		render(

package/src/__tests__/components/Notification/Notification.test.tsx

@@ -162,7 +162,7 @@ describe("Notification component with subnotifications", () => {
 
 describe("Notification component events", () => {
 	it("should call onClick on action button click", () => {
-		const onClickMock = jest.fn();
+		const onClickMock = vi.fn();
 		const defaultProps: INotificationProps = {
 			text: "Notification text",
 			type: "success",
@@ -183,7 +183,7 @@ describe("Notification component events", () => {
 	});
 
 	it("should call resetError on close and hide notification", () => {
-		const resetErrorMock = jest.fn();
+		const resetErrorMock = vi.fn();
 		const defaultProps: INotificationProps = {
 			text: "Notification text",
 			type: "success",