diff --git a/src/api/models/themes.js b/src/api/models/themes.js index 4052d1cc3..d8d9260f5 100644 --- a/src/api/models/themes.js +++ b/src/api/models/themes.js @@ -92,6 +92,7 @@ export const getAvailableThemes = () => { value, name: theme.name, description: theme.description, + defaultVariables: theme.customTemplateVariables, }); }); return toReturn; diff --git a/src/app/js/admin/configTenant/ConfigTenantForm.js b/src/app/js/admin/configTenant/ConfigTenantForm.js index a72bd4135..61270cd81 100644 --- a/src/app/js/admin/configTenant/ConfigTenantForm.js +++ b/src/app/js/admin/configTenant/ConfigTenantForm.js @@ -28,6 +28,7 @@ import CancelButton from '../../lib/components/CancelButton'; import { toast } from '../../../../common/tools/toast'; import { loadConfigTenant } from '.'; import { SaveAs } from '@mui/icons-material'; +import _ from 'lodash'; const shake = keyframes` 10%, 90% { @@ -61,6 +62,7 @@ export const ConfigTenantForm = ({ const [theme, setTheme] = useState('default'); const [themes, setThemes] = useState([ { + defaultVariables: {}, name: { fr: 'Classique', en: 'Classic', @@ -132,6 +134,27 @@ export const ConfigTenantForm = ({ setConfigTenant(newConfigTenant); }; + const handleThemeChange = (event) => { + setIsFormModified(true); + setTheme(event.target.value); + + try { + const themeValue = themes.find( + (value) => value.value === event.target.value, + ); + + const clonedConfig = _.cloneDeep(JSON.parse(configTenant)); + + if (clonedConfig.front) { + clonedConfig.front.theme = themeValue.defaultVariables; + } + + setConfigTenant(JSON.stringify(clonedConfig, null, 2)); + } catch (_) { + /* empty */ + } + }; + return (

{polyglot.t('config_tenant')}

@@ -213,10 +236,7 @@ export const ConfigTenantForm = ({ width: 'min(505px, 100%)', }} sx={{ mb: 2 }} - onChange={(event) => { - setIsFormModified(true); - setTheme(event.target.value); - }} + onChange={handleThemeChange} > {themes.map((t) => (