Skip to content

Commit b29d981

Browse files
garronejgarronej
committed
Only require to provide default color scheme where it's strictly nessesary
1 parent 5d912eb commit b29d981

File tree

10 files changed

+83
-40
lines changed

10 files changed

+83
-40
lines changed

‎src/next-appdir/DsfrHead.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
import React from "react";
22
import { objectKeys } from "tsafe/objectKeys";
3-
import type { ColorScheme } from "../useIsDark";
43
import { getAssetUrl } from "../tools/getAssetUrl";
54
import AppleTouchIcon from "../dsfr/favicon/apple-touch-icon.png";
65
import FaviconSvg from "../dsfr/favicon/favicon.svg";
76
import FaviconIco from "../dsfr/favicon/favicon.ico";
87
import { getScriptToRunAsap } from "../useIsDark/scriptToRunAsap";
9-
import { fontUrlByFileBasename } from "./fontUrlByFileBasename";
8+
import { fontUrlByFileBasename } from "./zz_internal/fontUrlByFileBasename";
9+
import { getDefaultColorSchemeServerSide } from "./zz_internal/defaultColorScheme";
1010
//NOTE: As of now there is no way to enforce ordering in Next Appdir
1111
//See: https://github.com/vercel/next.js/issues/16630
1212
// @import url(...) doesn't work. Using Sass and @use is our last resort.
1313
import "../assets/dsfr_plus_icons.scss";
1414

1515
export type DsfrHeadProps = {
16-
defaultColorScheme: ColorScheme | "system";
1716
/** If not provided no fonts are preloaded.
1817
* Preloading of fonts is only enabled in production.
1918
*/
@@ -23,7 +22,9 @@ export type DsfrHeadProps = {
2322
const isProduction = process.env.NODE_ENV !== "development";
2423

2524
export function DsfrHead(props: DsfrHeadProps) {
26-
const { defaultColorScheme, preloadFonts = [] } = props;
25+
const { preloadFonts = [] } = props;
26+
27+
const defaultColorScheme = getDefaultColorSchemeServerSide();
2728

2829
return (
2930
<>

‎src/next-appdir/DsfrProvider.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,17 @@
33
import React, { useEffect } from "react";
44
import type { ReactNode } from "react";
55
import { isBrowser } from "../tools/isBrowser";
6-
import type { ColorScheme } from "../useIsDark";
76
import { SsrIsDarkProvider } from "../useIsDark/server";
87
import { dsfrEffect } from "./start";
98
import { GdprStoreProvider } from "../gdpr/GdprStore";
9+
import { getDefaultColorSchemeClientSide } from "./zz_internal/defaultColorScheme";
1010

1111
export type DsfrProviderProps = {
12-
defaultColorScheme: ColorScheme | "system";
1312
children: ReactNode;
1413
};
1514

1615
export function DsfrProvider(props: DsfrProviderProps) {
17-
const { defaultColorScheme, children } = props;
16+
const { children } = props;
1817

1918
useEffect(() => {
2019
dsfrEffect();
@@ -24,6 +23,8 @@ export function DsfrProvider(props: DsfrProviderProps) {
2423
return <GdprStoreProvider>{children}</GdprStoreProvider>;
2524
}
2625

26+
const defaultColorScheme = getDefaultColorSchemeClientSide();
27+
2728
const isDark = defaultColorScheme === "dark" ? true : false;
2829

2930
return <SsrIsDarkProvider value={isDark}>{children}</SsrIsDarkProvider>;

‎src/next-appdir/fontUrlByFileBasename.ts‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎src/next-appdir/getColorSchemeHtmlAttributes.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,21 @@
11
import { data_fr_scheme, data_fr_theme } from "../useIsDark/constants";
22
import type { ColorScheme } from "../useIsDark";
3+
import { type DefaultColorScheme, setDefaultColorSchemeServerSide } from "./zz_internal/defaultColorScheme";
34

45
const suppressHydrationWarning = true;
56

67
//export function getColorSchemeHtmlAttributes(params: { defaultColorScheme: "system"; }): { suppressHydrationWarning: true; };
78
//export function getColorSchemeHtmlAttributes(params: { defaultColorScheme: ColorScheme; }): { suppressHydrationWarning: true; } & Record<typeof data_fr_scheme | typeof data_fr_theme, ColorScheme>;
89
export function getColorSchemeHtmlAttributes(params: {
9-
defaultColorScheme: ColorScheme | "system";
10+
defaultColorScheme: DefaultColorScheme;
1011
}): { suppressHydrationWarning: true } & (
1112
| Record<typeof data_fr_scheme | typeof data_fr_theme, ColorScheme>
1213
| {}
1314
) {
1415
const { defaultColorScheme } = params;
1516

17+
setDefaultColorSchemeServerSide({ defaultColorScheme });
18+
1619
if (defaultColorScheme === "system") {
1720
return { suppressHydrationWarning };
1821
}

‎src/next-appdir/index.ts‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
11
export type { RegisterLink, RegisteredLinkProps } from "../link";
2-
import type { ColorScheme } from "../useIsDark";
3-
4-
export type DefaultColorScheme = ColorScheme | "system";
5-
2+
export type { DefaultColorScheme } from "./zz_internal/defaultColorScheme";
63
export { startReactDsfr } from "./start";

‎src/next-appdir/start.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { start } from "../start";
33
import type { RegisterLink, RegisteredLinkProps } from "../link";
44
import { setLink } from "../link";
55
import { setUseLang } from "../i18n";
6-
import type { ColorScheme } from "../useIsDark";
6+
import { type DefaultColorScheme, setDefaultColorSchemeClientSide } from "./zz_internal/defaultColorScheme";
77
import { isBrowser } from "../tools/isBrowser";
88

99
export type { RegisterLink, RegisteredLinkProps };
@@ -12,7 +12,7 @@ let isAfterFirstEffect = false;
1212
const actions: (() => void)[] = [];
1313

1414
export function startReactDsfr(params: {
15-
defaultColorScheme: ColorScheme | "system";
15+
defaultColorScheme: DefaultColorScheme;
1616
/** Default: false */
1717
verbose?: boolean;
1818
/** Default: <a /> */
@@ -22,6 +22,8 @@ export function startReactDsfr(params: {
2222
}) {
2323
const { defaultColorScheme, verbose = false, Link, useLang } = params;
2424

25+
setDefaultColorSchemeClientSide({ defaultColorScheme });
26+
2527
if (Link !== undefined) {
2628
setLink({ Link });
2729
}

‎src/next-appdir/zz_internal/defaultColorScheme.ts‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import { assert } from "tsafe/assert";
2+
3+
import type { ColorScheme } from "../../useIsDark";
4+
5+
export type DefaultColorScheme = ColorScheme | "system";
6+
7+
let defaultColorSchemeServerSide: DefaultColorScheme | undefined = undefined;
8+
9+
export function getDefaultColorSchemeServerSide(): DefaultColorScheme {
10+
assert(defaultColorSchemeServerSide !== undefined);
11+
return defaultColorSchemeServerSide;
12+
}
13+
14+
export function setDefaultColorSchemeServerSide(
15+
params: { defaultColorScheme: DefaultColorScheme }
16+
): void {
17+
18+
const { defaultColorScheme } = params;
19+
20+
defaultColorSchemeServerSide = defaultColorScheme;
21+
}
22+
23+
let defaultColorSchemeClientSide: DefaultColorScheme | undefined = undefined;
24+
25+
export function getDefaultColorSchemeClientSide(): DefaultColorScheme {
26+
assert(defaultColorSchemeClientSide !== undefined);
27+
return defaultColorSchemeClientSide;
28+
}
29+
30+
export function setDefaultColorSchemeClientSide(
31+
params: { defaultColorScheme: DefaultColorScheme }
32+
): void {
33+
34+
const { defaultColorScheme } = params;
35+
36+
defaultColorSchemeClientSide = defaultColorScheme;
37+
}
38+
39+
40+

‎src/next-appdir/zz_internal/fontUrlByFileBasename.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import marianneLightWoff2Url from "../../dsfr/fonts/Marianne-Light.woff2";
2+
import marianneItalicWoff2Url from "../../dsfr/fonts/Marianne-Light_Italic.woff2";
3+
import marianneRegularWoff2Url from "../../dsfr/fonts/Marianne-Regular.woff2";
4+
import marianneRegularItalicWoff2Url from "../../dsfr/fonts/Marianne-Regular_Italic.woff2";
5+
import marianneMediumWoff2Url from "../../dsfr/fonts/Marianne-Medium.woff2";
6+
import marianneMediumItalicWoff2Url from "../../dsfr/fonts/Marianne-Medium_Italic.woff2";
7+
import marianneBoldWoff2Url from "../../dsfr/fonts/Marianne-Bold.woff2";
8+
import marianneBoldItalicWoff2Url from "../../dsfr/fonts/Marianne-Bold_Italic.woff2";
9+
import spectralRegularWoff2Url from "../../dsfr/fonts/Spectral-Regular.woff2";
10+
import spectralExtraBoldWoff2Url from "../../dsfr/fonts/Spectral-ExtraBold.woff2";
11+
12+
export const fontUrlByFileBasename = {
13+
"Marianne-Light": marianneLightWoff2Url,
14+
"Marianne-Light_Italic": marianneItalicWoff2Url,
15+
"Marianne-Regular": marianneRegularWoff2Url,
16+
"Marianne-Regular_Italic": marianneRegularItalicWoff2Url,
17+
"Marianne-Medium": marianneMediumWoff2Url,
18+
"Marianne-Medium_Italic": marianneMediumItalicWoff2Url,
19+
"Marianne-Bold": marianneBoldWoff2Url,
20+
"Marianne-Bold_Italic": marianneBoldItalicWoff2Url,
21+
"Spectral-Regular": spectralRegularWoff2Url,
22+
"Spectral-ExtraBold": spectralExtraBoldWoff2Url
23+
} as const;

‎src/next-pagesdir.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { SsrIsDarkProvider } from "./useIsDark/server";
1010
import type { ColorScheme } from "./useIsDark";
1111
import { isBrowser } from "./tools/isBrowser";
1212
import { objectKeys } from "tsafe/objectKeys";
13-
import { fontUrlByFileBasename } from "./next-appdir/fontUrlByFileBasename";
13+
import { fontUrlByFileBasename } from "./next-appdir/zz_internal/fontUrlByFileBasename";
1414
import AppleTouchIcon from "./dsfr/favicon/apple-touch-icon.png";
1515
import FaviconSvg from "./dsfr/favicon/favicon.svg";
1616
import FaviconIco from "./dsfr/favicon/favicon.ico";

‎test/integration/next-appdir/app/layout.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,6 @@ export default function RootLayout({ children }: { children: JSX.Element; }) {
3737
<title>Next 13 AppDir Demo DSFR setup</title>
3838
<StartDsfr />
3939
<DsfrHead
40-
defaultColorScheme={defaultColorScheme}
4140
preloadFonts={[
4241
//"Marianne-Light",
4342
//"Marianne-Light_Italic",
@@ -59,7 +58,7 @@ export default function RootLayout({ children }: { children: JSX.Element; }) {
5958
"flexDirection": "column"
6059
}}
6160
>
62-
<DsfrProvider defaultColorScheme={defaultColorScheme}>
61+
<DsfrProvider>
6362
<ConsentBanner gdprLinkProps={{ href: "/mui" }} siteName='Next Test App' services={[
6463
{
6564
name: "matomo",

0 commit comments

Comments
 (0)