@griddo/ax 11.14.1 → 11.14.2-rc.0

package/package.json

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

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

@@ -71,7 +71,8 @@ describe("KeywordsPreviewModal component rendering", () => {
 		renderComponent({ ...defaultProps, isOpen: true, keywordsFilter: ["seo"] });
 
 		expect(screen.getByText("Show keyword:")).toBeTruthy();
-		expect(screen.getByText("seo")).toBeTruthy();
+		const seoElements = screen.getAllByText("seo");
+		expect(seoElements.length).toBeGreaterThan(0);
 	});
 
 	it("should not render the filter section when keywordsFilter is empty", () => {
@@ -87,8 +88,8 @@ describe("KeywordsPreviewModal component events", () => {
 
 		renderComponent({ ...defaultProps, isOpen: true, toggleModal: toggleModalMock });
 
-		const closeButton = screen.getByTestId("icon-action-component");
-		fireEvent.click(closeButton);
+		const closeButtons = screen.getAllByTestId("icon-action-component");
+		fireEvent.click(closeButtons[0]);
 		expect(toggleModalMock).toBeCalled();
 	});
 

package/src/components/KeywordsPreviewModal/atoms.tsx

@@ -1,7 +1,7 @@
 import { useState } from "react";
 
+import { FieldsBehavior, Modal } from "@ax/components";
 import type { IModal } from "@ax/types";
-import { Modal, FieldsBehavior } from "@ax/components";
 
 import * as S from "./style";
 
@@ -39,7 +39,7 @@ const AddKeywordsModal = (props: IAddKeywordsModal) => {
 			secondaryAction={secondaryModalAction}
 			mainAction={mainModalAction}
 			size="S"
-			height={282}
+			height={288}
 		>
 			<S.ModalContent>
 				<FieldsBehavior

package/src/components/KeywordsPreviewModal/index.tsx

@@ -69,16 +69,16 @@ const KeywordsPreviewModal = (props: IKeywordsPreviewProps) => {
 						)}
 						<S.KeywordsListWrapper>
 							{keywords.length === 0 && <S.StyledSummaryButton />}
-							{Object.keys(keywordCounts).map((key, index) => {
-								const isSelected = keywordsFilter.includes(key);
+							{keywords.map((keyword, index) => {
+								const isSelected = keywordsFilter.includes(keyword);
 								return (
 									<KeywordItem
-										keyword={key}
-										count={keywordCounts[key]}
+										keyword={keyword}
+										count={keywordCounts[keyword] ?? 0}
 										isSelected={isSelected}
-										onClick={handleAddTag(key)}
+										onClick={handleAddTag(keyword)}
 										deleteKeyword={handleDeleteKeyword}
-										key={`${key}-${index}`}
+										key={`${keyword}-${index}`}
 									/>
 								);
 							})}

package/src/components/KeywordsPreviewModal/utils.tsx

@@ -6,11 +6,11 @@ const countKeywords = (html: HTMLDivElement, keywords: string[]) => {
 		return {};
 	}
 
-	const htmlContent = frameContent.innerText.toLowerCase();
+	const htmlContent = frameContent.innerText.toLowerCase().normalize("NFC");
 	const keywordCounts: Record<string, number> = {};
 
 	keywords.forEach((keyword) => {
-		const lowerKeyword = keyword.toLowerCase();
+		const lowerKeyword = keyword.toLowerCase().normalize("NFC");
 		const regex = new RegExp(lowerKeyword.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "gi");
 		const matches = htmlContent.match(regex);
 		keywordCounts[keyword] = matches ? matches.length : 0;