@griddo/ax 11.11.8-rc.1 → 11.12.0

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

@@ -1,178 +0,0 @@
-import React from "react";
-
-import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
-import "@testing-library/jest-dom";
-
-import type { HeadingNode } from "@ax/types";
-import HeadingsPreviewModal from "@ax/components/HeadingsPreviewModal";
-import * as headingsUtils from "@ax/components/HeadingsPreviewModal/utils";
-import globalTheme from "@ax/themes/theme.json";
-
-jest.mock("@ax/components/HeadingsPreviewModal/utils", () => ({
-	...jest.requireActual("@ax/components/HeadingsPreviewModal/utils"),
-	parseHeadingsTree: jest.fn().mockReturnValue([]),
-}));
-
-afterEach(cleanup);
-
-const createHeadingNode = (
-	tag: HeadingNode["tag"],
-	text: string,
-	level: HeadingNode["level"],
-	children: HeadingNode[] = [],
-): HeadingNode => ({
-	tag,
-	text,
-	level,
-	isHidden: false,
-	children,
-});
-
-const mockHeadings: HeadingNode[] = [
-	createHeadingNode("h1", "Main Title", 1, [createHeadingNode("h2", "Subtitle", 2)]),
-];
-
-const browserRef = { current: document.createElement("div") } as React.RefObject<HTMLDivElement>;
-
-const defaultProps = {
-	isOpen: false,
-	browserRef: { current: null } as React.RefObject<HTMLDivElement>,
-	toggleModal: jest.fn(),
-	headingsFilter: "all" as const,
-	setHeadingsFilter: jest.fn(),
-};
-
-const renderComponent = (props = defaultProps) =>
-	render(
-		<ThemeProvider theme={parseTheme(globalTheme)}>
-			<HeadingsPreviewModal {...props} />
-		</ThemeProvider>,
-	);
-
-describe("HeadingsPreviewModal component rendering", () => {
-	it("should not render the headings content when closed", () => {
-		renderComponent();
-
-		expect(screen.queryByText("Show headings:")).toBeNull();
-		expect(screen.queryByTestId("wrapper")).toBeNull();
-	});
-
-	it("should render the empty state when open with no headings", () => {
-		renderComponent({ ...defaultProps, isOpen: true });
-
-		const floatingPanel = screen.getByTestId("floating-panel");
-		expect(floatingPanel).toBeTruthy();
-
-		const emptyState = screen.getByTestId("wrapper");
-		expect(emptyState).toBeTruthy();
-		expect(emptyState).toHaveTextContent("There are no headings available to display");
-	});
-
-	it("should render heading items when open with headings", () => {
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const floatingPanel = screen.getByTestId("floating-panel");
-		expect(floatingPanel).toBeTruthy();
-
-		const allButtons = screen.getAllByRole("button");
-		const headingItems = allButtons.filter((el) => el.hasAttribute("data-heading-id"));
-		expect(headingItems.length).toBeGreaterThan(0);
-	});
-
-	it("should render filter buttons when open with headings", () => {
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const filterText = screen.getByText("Show headings:");
-		expect(filterText).toBeTruthy();
-
-		const allFilter = screen.getByText("all");
-		expect(allFilter).toBeTruthy();
-
-		const h1Texts = screen.getAllByText("h1");
-		const h1FilterButton = h1Texts.find((el) => el.tagName === "BUTTON");
-		expect(h1FilterButton).toBeTruthy();
-
-		const h2Texts = screen.getAllByText("h2");
-		const h2FilterButton = h2Texts.find((el) => el.tagName === "BUTTON");
-		expect(h2FilterButton).toBeTruthy();
-	});
-
-	it("should render the errors banner when there are SEO errors", () => {
-		const headingsWithoutH1: HeadingNode[] = [createHeadingNode("h2", "Subtitle", 2)];
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(headingsWithoutH1);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const seoAlerts = screen.getByText("SEO Alerts");
-		expect(seoAlerts).toBeTruthy();
-	});
-
-	it("should not render the errors banner when there are no SEO errors", () => {
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const seoAlerts = screen.queryByText("SEO Alerts");
-		expect(seoAlerts).toBeNull();
-	});
-});
-
-describe("HeadingsPreviewModal component events", () => {
-	it("should call toggleModal when close button is clicked", () => {
-		const toggleModalMock = jest.fn();
-
-		renderComponent({ ...defaultProps, isOpen: true, toggleModal: toggleModalMock });
-
-		const closeButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(closeButton);
-		expect(toggleModalMock).toBeCalled();
-	});
-
-	it("should call setHeadingsFilter when a filter button is clicked", () => {
-		const setHeadingsFilterMock = jest.fn();
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef, setHeadingsFilter: setHeadingsFilterMock });
-
-		const h1Texts = screen.getAllByText("h1");
-		const h1FilterButton = h1Texts.find((el) => el.tagName === "BUTTON") as HTMLElement;
-		expect(h1FilterButton).toBeTruthy();
-		fireEvent.click(h1FilterButton);
-		expect(setHeadingsFilterMock).toBeCalledWith("h1");
-	});
-
-	it("should select a heading item when clicked", () => {
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const allButtons = screen.getAllByRole("button");
-		const headingItems = allButtons.filter((el) => el.hasAttribute("data-heading-id"));
-		expect(headingItems.length).toBeGreaterThan(0);
-
-		fireEvent.click(headingItems[0]);
-
-		expect(headingItems[0]).toBeTruthy();
-	});
-
-	it("should deselect a heading item when clicked again", () => {
-		(headingsUtils.parseHeadingsTree as jest.Mock).mockReturnValueOnce(mockHeadings);
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		const allButtons = screen.getAllByRole("button");
-		const headingItems = allButtons.filter((el) => el.hasAttribute("data-heading-id"));
-		expect(headingItems.length).toBeGreaterThan(0);
-
-		fireEvent.click(headingItems[0]);
-		fireEvent.click(headingItems[0]);
-
-		expect(headingItems[0]).toBeTruthy();
-	});
-});

package/src/__tests__/components/HeadingsPreviewModal/HeadingsPreviewModal.utils.test.tsx

@@ -1,150 +0,0 @@
-import type { HeadingNode } from "@ax/types";
-import {
-	analyzeHeadings,
-	extractUniqueHeadingTypes,
-	filterHeadings,
-	getHeadColor,
-} from "@ax/components/HeadingsPreviewModal/utils";
-
-const flatNode = (
-	tag: HeadingNode["tag"],
-	text: string,
-	level: HeadingNode["level"],
-	children: HeadingNode[] = [],
-): HeadingNode => ({ tag, text, level, isHidden: false, children });
-
-describe("analyzeHeadings", () => {
-	it("should return no errors for empty headings", () => {
-		expect(analyzeHeadings([])).toEqual([]);
-	});
-
-	it("should return no errors when H1 is present and structure is correct", () => {
-		const headings = [flatNode("h1", "Title", 1, [flatNode("h2", "Subtitle", 2)])];
-		expect(analyzeHeadings(headings)).toHaveLength(0);
-	});
-
-	it("should report missing H1 when not filtering", () => {
-		const headings = [flatNode("h2", "Subtitle", 2)];
-		const errors = analyzeHeadings(headings, false);
-		expect(errors.some((e) => e.message === "No H1 in this page")).toBe(true);
-	});
-
-	it("should not report missing H1 when filtering is active", () => {
-		const headings = [flatNode("h2", "Subtitle", 2)];
-		const errors = analyzeHeadings(headings, true);
-		expect(errors.some((e) => e.message === "No H1 in this page")).toBe(false);
-	});
-
-	it("should report nesting error when heading levels are skipped", () => {
-		const headings = [flatNode("h1", "Title", 1), flatNode("h3", "Sub-subtitle", 3)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Check heading structure for SEO compliance")).toBe(true);
-	});
-
-	it("should include the ID of the incorrectly nested heading", () => {
-		const headings = [flatNode("h1", "Title", 1), flatNode("h3", "Sub-subtitle", 3)];
-		const errors = analyzeHeadings(headings);
-		const nestingError = errors.find((e) => e.message === "Check heading structure for SEO compliance");
-		expect(nestingError?.headingIds.length).toBeGreaterThan(0);
-	});
-
-	it("should not report nesting error for sequential heading levels", () => {
-		const headings = [flatNode("h1", "Title", 1), flatNode("h2", "Subtitle", 2)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Check heading structure for SEO compliance")).toBe(false);
-	});
-
-	it("should report duplicate heading texts", () => {
-		const headings = [flatNode("h1", "Title", 1), flatNode("h2", "Same text", 2), flatNode("h2", "Same text", 2)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Avoid header repetitions for SEO")).toBe(true);
-	});
-
-	it("should not report duplicates when all headings are unique", () => {
-		const headings = [flatNode("h1", "Title", 1), flatNode("h2", "Subtitle A", 2), flatNode("h2", "Subtitle B", 2)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Avoid header repetitions for SEO")).toBe(false);
-	});
-
-	it("should report excessive heading length when text exceeds 70 characters", () => {
-		const longText = "A".repeat(71);
-		const headings = [flatNode("h1", longText, 1)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Some headings are too long")).toBe(true);
-	});
-
-	it("should not report excessive length for headings within 70 characters", () => {
-		const headings = [flatNode("h1", "A".repeat(70), 1)];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Some headings are too long")).toBe(false);
-	});
-
-	it("should detect errors in nested children", () => {
-		const headings = [flatNode("h1", "Title", 1, [flatNode("h2", "Same", 2), flatNode("h2", "Same", 2)])];
-		const errors = analyzeHeadings(headings);
-		expect(errors.some((e) => e.message === "Avoid header repetitions for SEO")).toBe(true);
-	});
-});
-
-describe("filterHeadings", () => {
-	const headings = [flatNode("h1", "Title", 1, [flatNode("h2", "Subtitle A", 2), flatNode("h2", "Subtitle B", 2)])];
-
-	it("should return all headings when filter is 'all'", () => {
-		const result = filterHeadings(headings, "all");
-		expect(result).toEqual(headings);
-	});
-
-	it("should return only h1 headings when filter is 'h1'", () => {
-		const result = filterHeadings(headings, "h1");
-		expect(result).toHaveLength(1);
-		expect(result[0].tag).toBe("h1");
-	});
-
-	it("should flatten and return only h2 headings when filter is 'h2'", () => {
-		const result = filterHeadings(headings, "h2");
-		expect(result).toHaveLength(2);
-		expect(result.every((h) => h.tag === "h2")).toBe(true);
-		expect(result.every((h) => h.children.length === 0)).toBe(true);
-	});
-
-	it("should return empty array when no headings match the filter", () => {
-		const result = filterHeadings(headings, "h3");
-		expect(result).toHaveLength(0);
-	});
-});
-
-describe("extractUniqueHeadingTypes", () => {
-	it("should return empty array for empty headings", () => {
-		expect(extractUniqueHeadingTypes([])).toEqual([]);
-	});
-
-	it("should return unique types sorted alphabetically", () => {
-		const headings = [flatNode("h3", "Sub-subtitle", 3), flatNode("h1", "Title", 1)];
-		expect(extractUniqueHeadingTypes(headings)).toEqual(["h1", "h3"]);
-	});
-
-	it("should include types from nested children", () => {
-		const headings = [flatNode("h1", "Title", 1, [flatNode("h2", "Subtitle", 2, [flatNode("h4", "Deep", 4)])])];
-		expect(extractUniqueHeadingTypes(headings)).toEqual(["h1", "h2", "h4"]);
-	});
-
-	it("should deduplicate repeated types", () => {
-		const headings = [flatNode("h2", "A", 2), flatNode("h2", "B", 2)];
-		expect(extractUniqueHeadingTypes(headings)).toEqual(["h2"]);
-	});
-});
-
-describe("getHeadColor", () => {
-	it("should return an rgb color string for a known heading tag", () => {
-		expect(getHeadColor("h1")).toBe("rgb(255, 240, 109)");
-		expect(getHeadColor("h2")).toBe("rgb(255, 184, 248)");
-	});
-
-	it("should return an rgba color string when opacity is provided", () => {
-		expect(getHeadColor("h1", 0.5)).toBe("rgba(255, 240, 109, 0.5)");
-	});
-
-	it("should return white for an unknown tag", () => {
-		expect(getHeadColor("unknown")).toBe("rgb(255, 255, 255)");
-	});
-});

package/src/__tests__/components/KeywordsPreviewModal/KeywordItem/KeywordItem.test.tsx

@@ -1,91 +0,0 @@
-import React from "react";
-
-import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
-import "@testing-library/jest-dom";
-
-import KeywordItem from "@ax/components/KeywordsPreviewModal/KeywordItem";
-import globalTheme from "@ax/themes/theme.json";
-
-afterEach(cleanup);
-
-const defaultProps = {
-	keyword: "seo",
-	count: 3,
-	isSelected: false,
-	onClick: jest.fn(),
-	deleteKeyword: jest.fn(),
-};
-
-const renderComponent = (props = defaultProps) =>
-	render(
-		<ThemeProvider theme={parseTheme(globalTheme)}>
-			<KeywordItem {...props} />
-		</ThemeProvider>,
-	);
-
-describe("KeywordItem component rendering", () => {
-	it("should render the keyword name", () => {
-		renderComponent();
-		expect(screen.getByText("seo")).toBeTruthy();
-	});
-
-	it("should render the keyword usage count", () => {
-		renderComponent();
-		expect(screen.getByText("3 used")).toBeTruthy();
-	});
-
-	it("should render zero usage count", () => {
-		renderComponent({ ...defaultProps, count: 0 });
-		expect(screen.getByText("0 used")).toBeTruthy();
-	});
-
-	it("should render the delete icon action", () => {
-		renderComponent();
-		expect(screen.getByTestId("icon-action-component")).toBeTruthy();
-	});
-});
-
-describe("KeywordItem component events", () => {
-	it("should call onClick when the keyword item is clicked", () => {
-		const onClickMock = jest.fn();
-		renderComponent({ ...defaultProps, onClick: onClickMock });
-
-		// The keyword item is a div with role="button"; the icon-action is a <button> inside it
-		const buttons = screen.getAllByRole("button");
-		const keywordItem = buttons.find((el) => el.tagName === "DIV");
-		expect(keywordItem).toBeTruthy();
-		fireEvent.click(keywordItem!);
-		expect(onClickMock).toBeCalled();
-	});
-
-	it("should call deleteKeyword directly when count is zero and delete is clicked", () => {
-		const deleteKeywordMock = jest.fn();
-		renderComponent({ ...defaultProps, count: 0, deleteKeyword: deleteKeywordMock });
-
-		const deleteButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(deleteButton);
-		expect(deleteKeywordMock).toBeCalledWith("seo");
-	});
-
-	it("should open the delete confirmation modal when count is greater than zero and delete is clicked", () => {
-		renderComponent({ ...defaultProps, count: 3 });
-
-		expect(screen.queryByTestId("modal-wrapper")).toBeNull();
-
-		const deleteButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(deleteButton);
-
-		expect(screen.getByTestId("modal-wrapper")).toBeTruthy();
-	});
-
-	it("should not call onClick when delete button is clicked (stopPropagation)", () => {
-		const onClickMock = jest.fn();
-		renderComponent({ ...defaultProps, count: 0, onClick: onClickMock });
-
-		const deleteButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(deleteButton);
-		expect(onClickMock).not.toBeCalled();
-	});
-});

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

@@ -1,122 +0,0 @@
-import React from "react";
-
-import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
-import "@testing-library/jest-dom";
-
-import KeywordsPreviewModal from "@ax/components/KeywordsPreviewModal";
-import * as keywordsUtils from "@ax/components/KeywordsPreviewModal/utils";
-import globalTheme from "@ax/themes/theme.json";
-
-jest.mock("@ax/components/KeywordsPreviewModal/utils", () => ({
-	...jest.requireActual("@ax/components/KeywordsPreviewModal/utils"),
-	countKeywords: jest.fn().mockReturnValue({}),
-}));
-
-afterEach(cleanup);
-
-const browserRef = { current: document.createElement("div") } as React.RefObject<HTMLDivElement>;
-
-const defaultProps = {
-	isOpen: false,
-	browserRef: { current: null } as React.RefObject<HTMLDivElement>,
-	toggleModal: jest.fn(),
-	keywords: ["seo", "react"],
-	keywordsFilter: [] as string[],
-	setKeywordsFilter: jest.fn(),
-	addKeywords: jest.fn(),
-	deleteKeyword: jest.fn(),
-};
-
-const renderComponent = (props = defaultProps) =>
-	render(
-		<ThemeProvider theme={parseTheme(globalTheme)}>
-			<KeywordsPreviewModal {...props} />
-		</ThemeProvider>,
-	);
-
-describe("KeywordsPreviewModal component rendering", () => {
-	it("should not render the keywords content when closed", () => {
-		renderComponent();
-
-		expect(screen.queryByText("Add new keyword")).toBeNull();
-		expect(screen.queryByText("Show keyword:")).toBeNull();
-	});
-
-	it("should render the Add new keyword button when open", () => {
-		renderComponent({ ...defaultProps, isOpen: true });
-
-		expect(screen.getByText("Add new keyword")).toBeTruthy();
-	});
-
-	it("should render keyword items when open with keywords", () => {
-		(keywordsUtils.countKeywords as jest.Mock).mockReturnValueOnce({ seo: 3, react: 1 });
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		expect(screen.getByText("seo")).toBeTruthy();
-		expect(screen.getByText("react")).toBeTruthy();
-	});
-
-	it("should render keyword count for each keyword item", () => {
-		(keywordsUtils.countKeywords as jest.Mock).mockReturnValueOnce({ seo: 3 });
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef });
-
-		expect(screen.getByText("3 used")).toBeTruthy();
-	});
-
-	it("should render the filter section when keywordsFilter is set", () => {
-		renderComponent({ ...defaultProps, isOpen: true, keywordsFilter: ["seo"] });
-
-		expect(screen.getByText("Show keyword:")).toBeTruthy();
-		expect(screen.getByText("seo")).toBeTruthy();
-	});
-
-	it("should not render the filter section when keywordsFilter is empty", () => {
-		renderComponent({ ...defaultProps, isOpen: true });
-
-		expect(screen.queryByText("Show keyword:")).toBeNull();
-	});
-});
-
-describe("KeywordsPreviewModal component events", () => {
-	it("should call toggleModal when close button is clicked", () => {
-		const toggleModalMock = jest.fn();
-
-		renderComponent({ ...defaultProps, isOpen: true, toggleModal: toggleModalMock });
-
-		const closeButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(closeButton);
-		expect(toggleModalMock).toBeCalled();
-	});
-
-	it("should call setKeywordsFilter with empty array when filter tag is deleted", () => {
-		const setKeywordsFilterMock = jest.fn();
-
-		renderComponent({
-			...defaultProps,
-			isOpen: true,
-			keywordsFilter: ["seo"],
-			setKeywordsFilter: setKeywordsFilterMock,
-		});
-
-		const deleteIconWrapper = screen.getByTestId("delete-icon-wrapper");
-		fireEvent.click(deleteIconWrapper);
-		expect(setKeywordsFilterMock).toBeCalledWith([]);
-	});
-
-	it("should call setKeywordsFilter with the clicked keyword when a keyword item is clicked", () => {
-		const setKeywordsFilterMock = jest.fn();
-		(keywordsUtils.countKeywords as jest.Mock).mockReturnValueOnce({ seo: 3 });
-
-		renderComponent({ ...defaultProps, isOpen: true, browserRef, setKeywordsFilter: setKeywordsFilterMock });
-
-		const keywordItems = screen.getAllByRole("button");
-		const seoItem = keywordItems.find((el) => el.textContent?.includes("seo") && el.getAttribute("tabindex") === "0");
-		expect(seoItem).toBeTruthy();
-		fireEvent.click(seoItem!);
-		expect(setKeywordsFilterMock).toBeCalledWith(["seo"]);
-	});
-});

package/src/__tests__/components/KeywordsPreviewModal/KeywordsPreviewModal.utils.test.ts

@@ -1,15 +0,0 @@
-import { countKeywords } from "@ax/components/KeywordsPreviewModal/utils";
-
-describe("countKeywords", () => {
-	it("should return empty object when div has no .frame-content iframe", () => {
-		const div = document.createElement("div");
-		const result = countKeywords(div, ["seo", "react"]);
-		expect(result).toEqual({});
-	});
-
-	it("should return empty object for empty keywords array", () => {
-		const div = document.createElement("div");
-		const result = countKeywords(div, []);
-		expect(result).toEqual({});
-	});
-});

package/src/__tests__/components/KeywordsPreviewModal/atoms.test.tsx

@@ -1,101 +0,0 @@
-import React from "react";
-
-import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
-import "@testing-library/jest-dom";
-
-import { AddKeywordsModal, DeleteKeywordsModal } from "@ax/components/KeywordsPreviewModal/atoms";
-import globalTheme from "@ax/themes/theme.json";
-
-afterEach(cleanup);
-
-const renderWithTheme = (ui: React.ReactElement) =>
-	render(<ThemeProvider theme={parseTheme(globalTheme)}>{ui}</ThemeProvider>);
-
-describe("AddKeywordsModal component rendering", () => {
-	it("should render the modal when isOpen is true", () => {
-		renderWithTheme(<AddKeywordsModal isOpen={true} toggleModal={jest.fn()} addNewKeyword={jest.fn()} />);
-
-		expect(screen.getByTestId("modal-wrapper")).toBeTruthy();
-	});
-
-	it("should not render the modal when isOpen is false", () => {
-		renderWithTheme(<AddKeywordsModal isOpen={false} toggleModal={jest.fn()} addNewKeyword={jest.fn()} />);
-
-		expect(screen.queryByTestId("modal-wrapper")).toBeNull();
-	});
-
-	it("should render the New keyword title", () => {
-		renderWithTheme(<AddKeywordsModal isOpen={true} toggleModal={jest.fn()} addNewKeyword={jest.fn()} />);
-
-		expect(screen.getByText("New keyword")).toBeTruthy();
-	});
-
-	it("should render the Create keyword button disabled when no keywords are entered", () => {
-		renderWithTheme(<AddKeywordsModal isOpen={true} toggleModal={jest.fn()} addNewKeyword={jest.fn()} />);
-
-		const createButton = screen.getByText("Create keyword").closest("button");
-		expect(createButton).toBeDisabled();
-	});
-});
-
-describe("AddKeywordsModal component events", () => {
-	it("should call toggleModal when Cancel button is clicked", () => {
-		const toggleModalMock = jest.fn();
-
-		renderWithTheme(<AddKeywordsModal isOpen={true} toggleModal={toggleModalMock} addNewKeyword={jest.fn()} />);
-
-		const cancelButton = screen.getByText("Cancel").closest("button");
-		expect(cancelButton).toBeTruthy();
-		cancelButton && fireEvent.click(cancelButton);
-		expect(toggleModalMock).toBeCalled();
-	});
-});
-
-describe("DeleteKeywordsModal component rendering", () => {
-	it("should render the modal when isOpen is true", () => {
-		renderWithTheme(<DeleteKeywordsModal isOpen={true} toggleModal={jest.fn()} deleteKeyword={jest.fn()} />);
-
-		expect(screen.getByTestId("modal-wrapper")).toBeTruthy();
-	});
-
-	it("should not render the modal when isOpen is false", () => {
-		renderWithTheme(<DeleteKeywordsModal isOpen={false} toggleModal={jest.fn()} deleteKeyword={jest.fn()} />);
-
-		expect(screen.queryByTestId("modal-wrapper")).toBeNull();
-	});
-
-	it("should render the Delete keyword title", () => {
-		renderWithTheme(<DeleteKeywordsModal isOpen={true} toggleModal={jest.fn()} deleteKeyword={jest.fn()} />);
-
-		expect(screen.getAllByText("Delete keyword").length).toBeGreaterThan(0);
-	});
-});
-
-describe("DeleteKeywordsModal component events", () => {
-	it("should call deleteKeyword when Delete keyword button is clicked", () => {
-		const deleteKeywordMock = jest.fn();
-
-		renderWithTheme(<DeleteKeywordsModal isOpen={true} toggleModal={jest.fn()} deleteKeyword={deleteKeywordMock} />);
-
-		const deleteButton = screen
-			.getAllByText("Delete keyword")
-			.map((el) => el.closest("button"))
-			.find(Boolean);
-		expect(deleteButton).toBeTruthy();
-		deleteButton && fireEvent.click(deleteButton);
-		expect(deleteKeywordMock).toBeCalled();
-	});
-
-	it("should call toggleModal when Cancel button is clicked", () => {
-		const toggleModalMock = jest.fn();
-
-		renderWithTheme(<DeleteKeywordsModal isOpen={true} toggleModal={toggleModalMock} deleteKeyword={jest.fn()} />);
-
-		const cancelButton = screen.getByText("Cancel").closest("button");
-		expect(cancelButton).toBeTruthy();
-		cancelButton && fireEvent.click(cancelButton);
-		expect(toggleModalMock).toBeCalled();
-	});
-});