diff --git a/apps/admin-x-settings/src/components/settings/site/ThemeModal.tsx b/apps/admin-x-settings/src/components/settings/site/ThemeModal.tsx index 1af12ccf68..21aad85d7a 100644 --- a/apps/admin-x-settings/src/components/settings/site/ThemeModal.tsx +++ b/apps/admin-x-settings/src/components/settings/site/ThemeModal.tsx @@ -90,7 +90,22 @@ const ThemeToolbar: React.FC = ({ const onThemeUpload = async (file: File) => { const themeFileName = file?.name.replace(/\.zip$/, ''); const existingThemeNames = themes.map(t => t.name); - if (existingThemeNames.includes(themeFileName)) { + if (isDefaultOrLegacyTheme({name: themeFileName})) { + NiceModal.show(ConfirmationModal, { + title: 'Cannot overwrite theme', + cancelLabel: 'Cancel', + okLabel: '', + prompt: ( + <> +

Sorry, {themeFileName} is a default theme and cannot be overwritten.

+

Please rename your zip file and try again.

+ + ), + onOk: async (confirmModal) => { + confirmModal?.remove(); + } + }); + } else if (existingThemeNames.includes(themeFileName)) { NiceModal.show(ConfirmationModal, { title: 'Overwrite theme', prompt: ( diff --git a/apps/admin-x-settings/test/acceptance/site/theme.test.ts b/apps/admin-x-settings/test/acceptance/site/theme.test.ts index 386ed97945..6dbcbe44d1 100644 --- a/apps/admin-x-settings/test/acceptance/site/theme.test.ts +++ b/apps/admin-x-settings/test/acceptance/site/theme.test.ts @@ -207,4 +207,42 @@ test.describe('Theme settings', async () => { await expect(page.getByTestId('limit-modal')).toHaveText(/Upgrade to enable custom themes/); }); + + test('Prevents overwriting the default theme', async ({page}) => { + await mockApi({page, requests: { + ...globalDataRequests, + browseThemes: {method: 'GET', path: '/themes/', response: responseFixtures.themes}, + uploadTheme: {method: 'POST', path: '/themes/upload/', response: { + themes: [{ + name: 'mytheme', + package: {}, + active: false, + templates: [] + }] + }} + }}); + + await page.goto('/'); + + const designSection = page.getByTestId('design'); + + await designSection.getByRole('button', {name: 'Customize'}).click(); + + const designModal = page.getByTestId('design-modal'); + + await designModal.getByTestId('change-theme').click(); + + const modal = page.getByTestId('theme-modal'); + + await modal.getByRole('button', {name: 'Upload theme'}).click(); + + const fileChooserPromise = page.waitForEvent('filechooser'); + + await page.getByTestId('confirmation-modal').locator('label[for=theme-upload]').click(); + + const fileChooser = await fileChooserPromise; + await fileChooser.setFiles(`${__dirname}/../../utils/responses/source.zip`); + + await expect(page.getByTestId('confirmation-modal')).toHaveText(/Cannot overwrite theme/); + }); }); diff --git a/apps/admin-x-settings/test/utils/responses/source.zip b/apps/admin-x-settings/test/utils/responses/source.zip new file mode 100644 index 0000000000..8fde66b696 Binary files /dev/null and b/apps/admin-x-settings/test/utils/responses/source.zip differ