diff --git a/apps/field-populator/package.json b/apps/field-populator/package.json index 4697c61292..5740a72e5f 100644 --- a/apps/field-populator/package.json +++ b/apps/field-populator/package.json @@ -20,6 +20,7 @@ "start": "vite", "build": "tsc && vite build", "test": "vitest", + "test:ci": "vitest run", "create-app-definition": "contentful-app-scripts create-app-definition", "add-locations": "contentful-app-scripts add-locations", "upload": "contentful-app-scripts upload --bundle-dir ./build", diff --git a/apps/field-populator/src/locations/Dialog.tsx b/apps/field-populator/src/locations/Dialog.tsx index dfca997e56..435261efa3 100644 --- a/apps/field-populator/src/locations/Dialog.tsx +++ b/apps/field-populator/src/locations/Dialog.tsx @@ -28,9 +28,10 @@ const Dialog = () => { return; } - // todo : copy and paste logic to populate fields - - sdk.close(); + sdk.close({ + sourceLocale: selectedSourceLocale, + targetLocales: selectedTargetLocales.map((locale) => locale.code), + }); }; return ( diff --git a/apps/field-populator/src/locations/Sidebar.tsx b/apps/field-populator/src/locations/Sidebar.tsx index 257e30c35d..4ab6154e35 100644 --- a/apps/field-populator/src/locations/Sidebar.tsx +++ b/apps/field-populator/src/locations/Sidebar.tsx @@ -9,11 +9,28 @@ const Sidebar = () => { useAutoResizer(); const openDialog = async () => { - return sdk.dialogs.openCurrentApp({ + const result = await sdk.dialogs.openCurrentApp({ title: APP_NAME, width: 'large', minHeight: '340px', }); + if (!result) { + return; + } + const { sourceLocale, targetLocales } = result as { + sourceLocale: string; + targetLocales: string[]; + }; + updateFields(sourceLocale, targetLocales); + }; + + const updateFields = (sourceLocale: string, targetLocales: string[]) => { + for (const fieldId of Object.keys(sdk.entry.fields)) { + const newValue = sdk.entry.fields[fieldId].getValue(sourceLocale); + for (const targetLocale of targetLocales) { + sdk.entry.fields[fieldId].setValue(newValue, targetLocale); + } + } }; return ( diff --git a/apps/field-populator/test/Dialog.spec.tsx b/apps/field-populator/test/Dialog.spec.tsx index fa76c54585..b60dd0d584 100644 --- a/apps/field-populator/test/Dialog.spec.tsx +++ b/apps/field-populator/test/Dialog.spec.tsx @@ -1,12 +1,11 @@ import { act, render, screen, waitFor } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import { describe, expect, it, vi, beforeEach } from 'vitest'; -import { mockCma, mockSdk } from './mocks'; +import { mockSdk } from './mocks'; import Dialog from '../src/locations/Dialog'; vi.mock('@contentful/react-apps-toolkit', () => ({ useSDK: () => mockSdk, - useCMA: () => mockCma, useAutoResizer: () => {}, })); diff --git a/apps/field-populator/test/Sidebar.spec.tsx b/apps/field-populator/test/Sidebar.spec.tsx index 68fad160ab..85735f8b00 100644 --- a/apps/field-populator/test/Sidebar.spec.tsx +++ b/apps/field-populator/test/Sidebar.spec.tsx @@ -1,13 +1,12 @@ import { render, screen } from '@testing-library/react'; import { beforeEach, describe, expect, it, vi } from 'vitest'; -import { mockCma, mockSdk } from './mocks'; +import { mockSdk } from './mocks'; import Sidebar from '../src/locations/Sidebar'; import userEvent from '@testing-library/user-event'; import { APP_NAME } from '../src/utils/consts'; vi.mock('@contentful/react-apps-toolkit', () => ({ useSDK: () => mockSdk, - useCMA: () => mockCma, useAutoResizer: () => {}, })); @@ -33,4 +32,39 @@ describe('Sidebar component', () => { expect(mockSdk.dialogs.openCurrentApp).toHaveBeenCalledOnce(); }); + + it('should copy field values from source locale to target locales', async () => { + const user = userEvent.setup(); + const titleGetValue = vi.fn().mockReturnValue('Hello'); + const titleSetValue = vi.fn(); + const bodyGetValue = vi.fn().mockReturnValue('World'); + const bodySetValue = vi.fn(); + + mockSdk.entry = { + fields: { + title: { + getValue: titleGetValue, + setValue: titleSetValue, + }, + body: { + getValue: bodyGetValue, + setValue: bodySetValue, + }, + }, + }; + + mockSdk.dialogs.openCurrentApp.mockResolvedValue({ + sourceLocale: 'en-US', + targetLocales: ['de', 'fr'], + }); + + render(); + + await user.click(screen.getByRole('button', { name: APP_NAME })); + + expect(titleSetValue).toHaveBeenCalledWith('Hello', 'de'); + expect(titleSetValue).toHaveBeenCalledWith('Hello', 'fr'); + expect(bodySetValue).toHaveBeenCalledWith('World', 'de'); + expect(bodySetValue).toHaveBeenCalledWith('World', 'fr'); + }); });