Skip to content

Commit 010587e

Browse files
committed
WIP: themes list
1 parent f6cfc64 commit 010587e

File tree

59 files changed

+1099
-572
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+1099
-572
lines changed

apps/web/app/(with-contexts)/layout.tsx

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -43,18 +43,22 @@ export default async function Layout({
4343
lemonsqueezySubscriptionMonthlyVariantId,
4444
lemonsqueezySubscriptionYearlyVariantId,
4545
},
46-
theme {
47-
colors,
48-
typography,
49-
interactives,
50-
structure
51-
},
5246
typefaces {
5347
section,
5448
typeface,
5549
fontWeights
5650
},
5751
}
52+
theme: getTheme {
53+
themeId
54+
name
55+
theme {
56+
colors
57+
typography
58+
interactives
59+
structure
60+
}
61+
}
5862
}
5963
`;
6064
const siteInfoFetch = new FetchBuilder()
@@ -73,7 +77,7 @@ export default async function Layout({
7377
address={address}
7478
siteinfo={formatSiteInfo(siteInfoResponse.site.settings)}
7579
typefaces={siteInfoResponse.site.typefaces}
76-
theme={siteInfoResponse.site.theme}
80+
theme={siteInfoResponse.theme}
7781
config={config}
7882
session={session}
7983
>

apps/web/app/layout.tsx

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ export async function generateMetadata(): Promise<Metadata> {
1818
host: headersList.get("host"),
1919
});
2020
const siteInfoQuery = `
21-
{ site: getSiteInfo {
21+
{
22+
site: getSiteInfo {
2223
name,
2324
settings {
2425
title,
@@ -40,17 +41,6 @@ export async function generateMetadata(): Promise<Metadata> {
4041
lemonsqueezySubscriptionMonthlyVariantId,
4142
lemonsqueezySubscriptionYearlyVariantId,
4243
},
43-
theme {
44-
colors,
45-
typography,
46-
interactives,
47-
structure
48-
},
49-
typefaces {
50-
section,
51-
typeface,
52-
fontWeights
53-
},
5444
}
5545
}
5646
`;

apps/web/components/admin/page-editor/fonts-list.tsx renamed to apps/web/components/admin/page-editor/fonts-list.tsx.notused

File renamed without changes.

apps/web/components/admin/page-editor/index.tsx

Lines changed: 59 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,15 @@ import {
55
Typeface,
66
WidgetInstance,
77
} from "@courselit/common-models";
8-
import type { Address, Media, Profile, Theme } from "@courselit/common-models";
8+
import type {
9+
Address,
10+
Media,
11+
Profile,
12+
UITheme,
13+
} from "@courselit/common-models";
914
import type { AppDispatch, AppState } from "@courselit/state-management";
1015
import { networkAction } from "@courselit/state-management/dist/action-creators";
11-
import {
12-
debounce,
13-
FetchBuilder,
14-
generateUniqueId,
15-
getGraphQLQueryStringFromObject,
16-
} from "@courselit/utils";
16+
import { debounce, FetchBuilder, generateUniqueId } from "@courselit/utils";
1717
import {
1818
EDIT_PAGE_BUTTON_DONE,
1919
EDIT_PAGE_BUTTON_UPDATE,
@@ -59,7 +59,7 @@ import {
5959

6060
const EditWidget = dynamic(() => import("./edit-widget"));
6161
const AddWidget = dynamic(() => import("./add-widget"));
62-
const FontsList = dynamic(() => import("./fonts-list"));
62+
// const FontsList = dynamic(() => import("./fonts-list"));
6363
const ThemeEditor = dynamic(() => import("./theme-editor/index"));
6464

6565
const DEBOUNCE_TIME = 500;
@@ -110,7 +110,7 @@ export default function PageEditor({
110110
const [primaryFontFamily, setPrimaryFontFamily] =
111111
useState("Roboto, sans-serif");
112112
const [loading, setLoading] = useState(false);
113-
const [draftTheme, setDraftTheme] = useState<Theme>(state.theme);
113+
const [draftTheme, setDraftTheme] = useState<UITheme>(state.theme);
114114
// const [theme, setTheme] = useState<Theme>(state.theme);
115115
const { toast } = useToast();
116116
const [pages, setPages] = useState<Page[]>([]);
@@ -287,13 +287,6 @@ export default function PageEditor({
287287
letterSpacing,
288288
case
289289
},
290-
draftTheme {
291-
name
292-
colors
293-
typography
294-
interactives
295-
structure
296-
}
297290
}
298291
}
299292
`;
@@ -308,9 +301,6 @@ export default function PageEditor({
308301
if (response.site.draftTypefaces) {
309302
setDraftTypefaces(response.site.draftTypefaces);
310303
}
311-
if (response.site.draftTheme) {
312-
setDraftTheme(response.site.draftTheme);
313-
}
314304
} catch (err: any) {
315305
toast({
316306
title: TOAST_TITLE_ERROR,
@@ -528,51 +518,51 @@ export default function PageEditor({
528518
[selectedWidget],
529519
);
530520

531-
const saveDraftTypefaces = async (fontName: string) => {
532-
const newTypefaces: Typeface[] = structuredClone(draftTypefaces);
533-
const defaultSection = newTypefaces.filter(
534-
(x) => x.section === "default",
535-
)[0];
536-
defaultSection.typeface = fontName;
537-
538-
const query = `
539-
mutation {
540-
site: updateDraftTypefaces(
541-
typefaces: ${getGraphQLQueryStringFromObject(newTypefaces)}
542-
) {
543-
draftTypefaces {
544-
section,
545-
typeface,
546-
fontWeights,
547-
fontSize,
548-
lineHeight,
549-
letterSpacing,
550-
case
551-
},
552-
}
553-
}
554-
`;
555-
const fetch = new FetchBuilder()
556-
.setUrl(`${address.backend}/api/graph`)
557-
.setPayload(query)
558-
.setIsGraphQLEndpoint(true)
559-
.build();
560-
try {
561-
dispatch && dispatch(networkAction(true));
562-
const response = await fetch.exec();
563-
if (response.site) {
564-
setDraftTypefaces(response.site.draftTypefaces);
565-
}
566-
} catch (err: any) {
567-
toast({
568-
title: TOAST_TITLE_ERROR,
569-
description: err.message,
570-
variant: "destructive",
571-
});
572-
} finally {
573-
dispatch && dispatch(networkAction(false));
574-
}
575-
};
521+
// const saveDraftTypefaces = async (fontName: string) => {
522+
// const newTypefaces: Typeface[] = structuredClone(draftTypefaces);
523+
// const defaultSection = newTypefaces.filter(
524+
// (x) => x.section === "default",
525+
// )[0];
526+
// defaultSection.typeface = fontName;
527+
528+
// const query = `
529+
// mutation {
530+
// site: updateDraftTypefaces(
531+
// typefaces: ${getGraphQLQueryStringFromObject(newTypefaces)}
532+
// ) {
533+
// draftTypefaces {
534+
// section,
535+
// typeface,
536+
// fontWeights,
537+
// fontSize,
538+
// lineHeight,
539+
// letterSpacing,
540+
// case
541+
// },
542+
// }
543+
// }
544+
// `;
545+
// const fetch = new FetchBuilder()
546+
// .setUrl(`${address.backend}/api/graph`)
547+
// .setPayload(query)
548+
// .setIsGraphQLEndpoint(true)
549+
// .build();
550+
// try {
551+
// dispatch && dispatch(networkAction(true));
552+
// const response = await fetch.exec();
553+
// if (response.site) {
554+
// setDraftTypefaces(response.site.draftTypefaces);
555+
// }
556+
// } catch (err: any) {
557+
// toast({
558+
// title: TOAST_TITLE_ERROR,
559+
// description: err.message,
560+
// variant: "destructive",
561+
// });
562+
// } finally {
563+
// dispatch && dispatch(networkAction(false));
564+
// }
565+
// };
576566

577567
const onAddWidgetBelow = (index: number) => {
578568
setSelectedWidgetIndex(index);
@@ -595,18 +585,18 @@ export default function PageEditor({
595585
/>
596586
)}
597587
{leftPaneContent === "editor" && editWidget}
598-
{leftPaneContent === "fonts" && (
588+
{/* {leftPaneContent === "fonts" && (
599589
<FontsList
600590
draftTypefaces={draftTypefaces}
601591
onClose={onClose}
602592
saveDraftTypefaces={saveDraftTypefaces}
603593
/>
604-
)}
594+
)} */}
605595
{leftPaneContent === "theme" && (
606596
<ThemeEditor
607-
draftTheme={draftTheme}
608-
onClose={onClose}
609-
onSave={(theme) => setDraftTheme(theme)}
597+
// draftTheme={draftTheme}
598+
// onClose={onClose}
599+
// onSave={(theme) => setDraftTheme(theme)}
610600
/>
611601
)}
612602
{leftPaneContent === "seo" && (

0 commit comments

Comments
 (0)