0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-10 23:36:14 -05:00

Updated site preview to handle theme settings

refs https://github.com/TryGhost/Team/issues/3354

- wires theme settings to site preview frame, dynamically updating the preview when theme settings change
This commit is contained in:
Rishabh 2023-06-09 20:05:58 +05:30
parent f7e2f82089
commit eaf5aaade2
2 changed files with 26 additions and 8 deletions

View file

@ -115,7 +115,8 @@ const DesignModal: React.FC = () => {
accentColor,
icon,
logo,
coverImage
coverImage,
themeSettings
}}
/>
}

View file

@ -1,12 +1,14 @@
import React, {useEffect, useRef} from 'react';
import useSettingGroup from '../../../../hooks/useSettingGroup';
import {CustomThemeSetting} from '../../../../types/api';
type BrandSettings = {
description: string,
accentColor: string,
icon: string,
logo: string,
coverImage: string
description: string;
accentColor: string;
icon: string;
logo: string;
coverImage: string;
themeSettings: Array<CustomThemeSetting & { dirty?: boolean }>;
}
interface ThemePreviewProps {
@ -29,14 +31,29 @@ function getPreviewData({
accentColor,
icon,
logo,
coverImage
}: BrandSettings): string {
coverImage,
themeSettings
}: {
description: string;
accentColor: string;
icon: string;
logo: string;
coverImage: string;
themeSettings: Array<CustomThemeSetting & { dirty?: boolean }>,
}): string {
const params = new URLSearchParams();
params.append('c', accentColor);
params.append('d', description);
params.append('icon', icon);
params.append('logo', logo);
params.append('cover', coverImage);
const themeSettingsObj: {
[key: string]: string;
} = {};
themeSettings.forEach((setting) => {
themeSettingsObj[setting.key] = setting.value as string;
});
params.append('custom', JSON.stringify(themeSettingsObj));
return params.toString();
}