From 4f58b487400aa7bd3bc6d00ed7896e21047a4082 Mon Sep 17 00:00:00 2001 From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com> Date: Wed, 17 Jul 2024 07:43:09 +0200 Subject: [PATCH 1/4] fix(theme): fix theme file of voscouleur --- .../themes/voscouleurs/lodex-theme.json | 72 +++++++++---------- 1 file changed, 36 insertions(+), 36 deletions(-) diff --git a/src/app/custom/themes/voscouleurs/lodex-theme.json b/src/app/custom/themes/voscouleurs/lodex-theme.json index 6832fdae7..7af7c0142 100644 --- a/src/app/custom/themes/voscouleurs/lodex-theme.json +++ b/src/app/custom/themes/voscouleurs/lodex-theme.json @@ -2,50 +2,50 @@ "version": "6", "licence": "CeCILL", "name": { - "fr": "voscouleurs", - "en": "yourcolors" + "fr": "Vos Couleurs", + "en": "Your Colors" }, "description": { - "fr": "Theme personnalisable", - "en": "customizable Theme" + "fr": "Thème personnalisable", + "en": "Customizable theme" }, "configuration": { "files": { "index": "index.ejs", "palette": "" - } - }, - "variables": { - "siteTitle": "titre du site", - "summary": "promesse du site", - "logo": { - "file": "path vers le fichier du logo", - "alt": "nom de l'organisme", - "url": "url de l'organisme", - "size": "100" - }, - "font": { - "family": "", - "title": "" }, - "color": { - "themePrimary": "", - "themeSecondary": "", - "themeRGBA": "", - "bgBody": "#fff", - "bgHeader": "", - "headerTitle": "", - "bgContent": "", - "bgFacet": "", - "titles": "", - "titleGraph": "", - "text": "", - "icon": "", - "iconHover": "", - "button": "", - "buttonHover": "", - "textContrast": "", - "bgContrast": "" + "variables": { + "siteTitle": "titre du site", + "summary": "promesse du site", + "logo": { + "file": "path vers le fichier du logo", + "alt": "nom de l'organisme", + "url": "url de l'organisme", + "size": "100" + }, + "font": { + "family": "", + "title": "" + }, + "color": { + "themePrimary": "", + "themeSecondary": "", + "themeRGBA": "", + "bgBody": "#fff", + "bgHeader": "", + "headerTitle": "", + "bgContent": "", + "bgFacet": "", + "titles": "", + "titleGraph": "", + "text": "", + "icon": "", + "iconHover": "", + "button": "", + "buttonHover": "", + "textContrast": "", + "bgContrast": "" + } } } } From 2039c3e9107214cd3ae36935a546ec07e01bf5ef Mon Sep 17 00:00:00 2001 From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com> Date: Wed, 17 Jul 2024 07:43:55 +0200 Subject: [PATCH 2/4] feat(theme): autocomplete the config with the default theme values --- src/api/models/themes.js | 1 + .../js/admin/configTenant/ConfigTenantForm.js | 28 ++++++++++++++++--- 2 files changed, 25 insertions(+), 4 deletions(-) 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) => ( From 0fe6fe65a2da6987593a0ed55ba77bcb72b43282 Mon Sep 17 00:00:00 2001 From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com> Date: Wed, 17 Jul 2024 11:25:58 +0200 Subject: [PATCH 3/4] fix(theme): update theme name --- src/app/custom/themes/voscouleurs/lodex-theme.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/custom/themes/voscouleurs/lodex-theme.json b/src/app/custom/themes/voscouleurs/lodex-theme.json index 7af7c0142..330812fef 100644 --- a/src/app/custom/themes/voscouleurs/lodex-theme.json +++ b/src/app/custom/themes/voscouleurs/lodex-theme.json @@ -2,8 +2,8 @@ "version": "6", "licence": "CeCILL", "name": { - "fr": "Vos Couleurs", - "en": "Your Colors" + "fr": "Voscouleurs", + "en": "Voscouleurs" }, "description": { "fr": "Thème personnalisable", From 068760c511032fc8253d220aa92d97a5003f6943 Mon Sep 17 00:00:00 2001 From: AlasDiablo <25723276+AlasDiablo@users.noreply.github.com> Date: Thu, 18 Jul 2024 09:20:54 +0200 Subject: [PATCH 4/4] fix: remove the usage of lodash --- .../js/admin/configTenant/ConfigTenantForm.js | 25 ++++++++++++++----- 1 file changed, 19 insertions(+), 6 deletions(-) diff --git a/src/app/js/admin/configTenant/ConfigTenantForm.js b/src/app/js/admin/configTenant/ConfigTenantForm.js index 61270cd81..6d37a6952 100644 --- a/src/app/js/admin/configTenant/ConfigTenantForm.js +++ b/src/app/js/admin/configTenant/ConfigTenantForm.js @@ -28,7 +28,6 @@ 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% { @@ -53,6 +52,7 @@ export const ConfigTenantForm = ({ history, onLoadConfigTenant, }) => { + const [initialConfig, setInitialConfig] = useState(''); const [configTenant, setConfigTenant] = useState(''); const [enableAutoPublication, setEnableAutoPublication] = useState(false); const [userAuth, setUserAuth] = useState({}); @@ -90,6 +90,7 @@ export const ConfigTenantForm = ({ delete response.theme; const stringified = JSON.stringify(response, null, 2); + setInitialConfig(stringified); setConfigTenant(stringified); const themesResponse = await getConfigTenantAvailableTheme(); @@ -143,13 +144,25 @@ export const ConfigTenantForm = ({ (value) => value.value === event.target.value, ); - const clonedConfig = _.cloneDeep(JSON.parse(configTenant)); + try { + const parsedConfig = JSON.parse(configTenant); - if (clonedConfig.front) { - clonedConfig.front.theme = themeValue.defaultVariables; - } + if (parsedConfig.front) { + parsedConfig.front.theme = themeValue.defaultVariables; + } + + setConfigTenant(JSON.stringify(parsedConfig, null, 2)); + } catch (_) { + // If we can't parse the actual config fallback to the initial + + const parsedConfig = JSON.parse(initialConfig); - setConfigTenant(JSON.stringify(clonedConfig, null, 2)); + if (parsedConfig.front) { + parsedConfig.front.theme = themeValue.defaultVariables; + } + + setConfigTenant(JSON.stringify(parsedConfig, null, 2)); + } } catch (_) { /* empty */ }