fix: validation for text key (#14669)

Co-authored-by: JamalAlabdullah <[email protected]>
Altinn · Feb 18, 2025 · 64b8511 · 64b8511
1 parent 95c2718
commit 64b8511
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 15 deletions.
diff --git a/frontend/packages/text-editor/src/TextList.tsx b/frontend/packages/text-editor/src/TextList.tsx
@@ -29,10 +29,12 @@ export const TextList = ({
   const { t } = useTranslation();
   const { data: layoutNames, isPending: layoutNamesPending } = useLayoutNamesQuery(org, app);
 
-  const textIds = useMemo(() => resourceRows.map((row) => row.textKey), [resourceRows]);
-  const idExists = (newTextId: string): boolean =>
-    textIds.some((textId) => StringUtils.areCaseInsensitiveEqual(textId, newTextId));
   const getTableHeaderCellId = (language: string): string => `header-lang${language}`;
+  const textIds = useMemo(() => resourceRows.map((row) => row.textKey), [resourceRows]);
+  const idExists = (newTextId: string, oldTextId: string): boolean =>
+    textIds
+      .filter((textId: string) => textId.toLowerCase() !== oldTextId.toLowerCase())
+      .some((textId: string) => StringUtils.areCaseInsensitiveEqual(textId, newTextId));
 
   return (
     <Table className={classes.textListTable}>

diff --git a/frontend/packages/text-editor/src/TextRow.test.tsx b/frontend/packages/text-editor/src/TextRow.test.tsx
@@ -111,6 +111,24 @@ describe('TextRow', () => {
     expect(screen.getByText(illegalCharMsg)).toBeInTheDocument();
   });
 
+  it('should not stop a call to upsertEntry to update key when new text key is equal the original but with some uppercase', async () => {
+    const user = userEvent.setup();
+    const updateEntryId = jest.fn();
+    renderTextRow({ updateEntryId });
+    const toggleKeyEditButton = screen.getByRole('button', {
+      name: textMock('text_editor.toggle_edit_mode', { textKey }),
+    });
+    await user.click(toggleKeyEditButton);
+
+    const idInput = screen.getByRole('textbox', {
+      name: textMock('text_editor.key.edit', { textKey }),
+    });
+
+    await user.type(idInput, 'Value1');
+    await user.keyboard('{TAB}');
+    expect(updateEntryId).toHaveBeenCalledTimes(1);
+  });
+
   test('that the full row of languages is shown even if a translation is missing', async () => {
     renderTextRow({
       textRowEntries: [

diff --git a/frontend/packages/text-editor/src/TextRow.tsx b/frontend/packages/text-editor/src/TextRow.tsx
@@ -12,7 +12,7 @@ import { AltinnConfirmDialog } from 'app-shared/components';
 import { StudioButton } from '@studio/components';
 
 export interface TextRowProps {
-  idExists: (textResourceId: string) => boolean;
+  idExists: (newTextId: string, oldTextId: string) => boolean;
   removeEntry: ({ textId }) => void;
   textId: string;
   textRowEntries: TextTableRowEntry[];
@@ -50,17 +50,10 @@ export const TextRow = ({
     setTextIdValue(newTextId);
   };
 
-  const validateNewTextId = (newTextId: string): string | null => {
-    if (newTextId === textId) {
-      return null;
-    }
-
-    if (idExists(newTextId)) {
-      return t('text_editor.key.error_duplicate');
-    }
-    const textIdValidationResult = validateTextId(newTextId);
-    return textIdValidationResult ? t(textIdValidationResult) : null;
-  };
+  const validateNewTextId = (newTextId: string): string | undefined =>
+    idExists(newTextId, textId)
+      ? t('text_editor.key.error_duplicate')
+      : validateTextId(newTextId) && t(validateTextId(newTextId));
 
   const handleTextIdBlur = () => {
     updateEntryId({ oldId: textId, newId: textIdValue });