🔧(frontend) theme from env var

We want to be able to brand our website (theme and logo)
at build time, we use the dsfr theme but
the german will use their own theme with their
own logo.
We will use a env var to set the theme,
depend the environment we will be able to
use different theme at build time.

src/frontend/apps/impress/.env

@@ -0,0 +1 @@
+NEXT_PUBLIC_THEME=dsfr

src/frontend/apps/impress/.env.test

@@ -1 +1,2 @@
 NEXT_PUBLIC_API_ORIGIN=http://test.jest
+NEXT_PUBLIC_THEME=test-theme

src/frontend/apps/impress/src/cunningham/__tests__/useCunninghamTheme.spec.tsx

@@ -0,0 +1,9 @@
+import useCunninghamTheme from '../useCunninghamTheme';
+
+describe('<useCunninghamTheme />', () => {
+  it('has the theme from NEXT_PUBLIC_THEME', () => {
+    const { theme } = useCunninghamTheme.getState();
+
+    expect(theme).toBe('test-theme');
+  });
+});

src/frontend/apps/impress/src/cunningham/useCunninghamTheme.tsx

@@ -20,7 +20,7 @@ const useCunninghamTheme = create<AuthStore>((set, get) => {
     merge(tokens.themes['default'], tokens.themes[get().theme]) as Tokens;
 
   return {
-    theme: 'dsfr',
+    theme: (process.env.NEXT_PUBLIC_THEME as Theme) || 'dsfr',
     colorsTokens: () => currentTheme().theme.colors,
     componentTokens: () => currentTheme().components,
     setTheme: (theme: Theme) => {

src/frontend/apps/impress/src/custom-next.d.ts

@@ -22,5 +22,6 @@ namespace NodeJS {
     NEXT_PUBLIC_API_ORIGIN?: string;
     NEXT_PUBLIC_SIGNALING_URL?: string;
     NEXT_PUBLIC_SW_DEACTIVATED?: string;
+    NEXT_PUBLIC_THEME?: string;
   }
 }