matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: use adoptedStyleSheets and break a bunch of other stuff

Browse Source 
Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-06-29 19:27:54 +02:00
parent c85158f4ea
commit 8efed59d52
7 changed files with 93 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/pl-fe/src/pages/dashboard/pl-fe-config.tsx
View File

@ -22,6 +22,7 @@ import Toggle from 'pl-fe/components/ui/toggle';
import CryptoAddressInput from 'pl-fe/features/pl-fe-config/components/crypto-address-input';
import FooterLinkInput from 'pl-fe/features/pl-fe-config/components/footer-link-input';
import PromoPanelInput from 'pl-fe/features/pl-fe-config/components/promo-panel-input';
import SitePreview from 'pl-fe/features/pl-fe-config/components/site-preview';
import ThemeSelector from 'pl-fe/features/ui/components/theme-selector';
import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
import { useAppSelector } from 'pl-fe/hooks/use-app-selector';
@ -179,7 +180,7 @@ const PlFeConfigEditor: React.FC = () => {
<Column label={intl.formatMessage(messages.heading)}>
<Form onSubmit={handleSubmit}>
<fieldset className='space-y-6' disabled={isLoading}>
{/* <SitePreview plFe={plFe} /> */}
<SitePreview plFe={plFe} />
<CardHeader>
<CardTitle title={<FormattedMessage id='plfe_config.headings.theme' defaultMessage='Theme' />} />

12
packages/pl-fe/src/pages/dashboard/theme-editor.tsx
View File

@ -55,6 +55,7 @@ const ThemeEditorPage: React.FC<IThemeEditor> = () => {
const rawConfig = useAppSelector(state => state.plfe);
const [colors, setColors] = useState(normalizeColors(plFeConfig));
const [isDefault, setIsDefault] = useState(false);
const [submitting, setSubmitting] = useState(false);
const [resetKey, setResetKey] = useState(crypto.randomUUID());
@ -63,6 +64,7 @@ const ThemeEditorPage: React.FC<IThemeEditor> = () => {
const updateColors = (key: string) => (newColors: ColorGroup) => {
if (typeof colors[key] === 'string') return;
setIsDefault(false);
setColors({
...colors,
[key]: {
@ -73,6 +75,7 @@ const ThemeEditorPage: React.FC<IThemeEditor> = () => {
};
const updateColor = (key: string) => (hex: string) => {
setIsDefault(false);
setColors({
...colors,
[key]: hex,
@ -81,6 +84,7 @@ const ThemeEditorPage: React.FC<IThemeEditor> = () => {
const setTheme = (theme: any) => {
setResetKey(crypto.randomUUID());
setIsDefault(false);
setTimeout(() => setColors(theme));
};
@ -89,13 +93,19 @@ const ThemeEditorPage: React.FC<IThemeEditor> = () => {
};
const updateTheme = async () => {
const params = { ...rawConfig, colors };
let params;
if (isDefault) {
params = { ...rawConfig, colors: undefined, brandColor: undefined, accentColor: undefined };
} else {
params = { ...rawConfig, colors };
}
await dispatch(updatePlFeConfig(params));
};
const restoreDefaultTheme = () => {
const config = v.parse(plFeConfigSchema, { brandColor: '#d80482' });
setTheme(normalizeColors(config));
setIsDefault(true);
};
const exportTheme = () => {