Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2026-02-27 00:40:58 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: issue with color scheme in layout (#1168)

Browse Source 
* fix: issue with color scheme in layout

* test: add and adjust unit tests for sign-in-callback
This commit is contained in:
Meier Lukas
2024-09-26 19:02:45 +02:00
committed by GitHub
parent a30be7bc1e
commit 8f7ed056c4
6 changed files with 127 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/nextjs/src/app/[locale]/_client-providers/mantine.tsx
View File

@@ -1,12 +1,14 @@
"use client";
import { useState } from "react";
import type { PropsWithChildren } from "react";
import { useState } from "react";
import type { MantineColorScheme, MantineColorSchemeManager } from "@mantine/core";
import { createTheme, isMantineColorScheme, MantineProvider } from "@mantine/core";
import dayjs from "dayjs";
import { clientApi } from "@homarr/api/client";
import { useSession } from "@homarr/auth/client";
import { parseCookies, setClientCookie } from "@homarr/common";
export const CustomMantineProvider = ({ children }: PropsWithChildren) => {
const manager = useColorSchemeManager();
@@ -50,7 +52,8 @@ function useColorSchemeManager(): MantineColorSchemeManager {
}
try {
return (window.localStorage.getItem(key) as MantineColorScheme | undefined) ?? defaultValue;
const cookies = parseCookies(document.cookie);
return (cookies[key] as MantineColorScheme | undefined) ?? defaultValue;
} catch {
return defaultValue;
}
@@ -61,6 +64,7 @@ function useColorSchemeManager(): MantineColorSchemeManager {
if (session) {
mutateColorScheme({ colorScheme: value });
}
setClientCookie(key, value, { expires: dayjs().add(1, "year").toDate() });
window.localStorage.setItem(key, value);
} catch (error) {
console.warn("[@mantine/core] Local storage color scheme manager was unable to save color scheme.", error);

4
apps/nextjs/src/app/[locale]/layout.tsx
View File

@@ -6,6 +6,8 @@ import "@homarr/spotlight/styles.css";
import "@homarr/ui/styles.css";
import "~/styles/scroll-area.scss";
import { cookies } from "next/headers";
import { env } from "@homarr/auth/env.mjs";
import { auth } from "@homarr/auth/next";
import { ModalProvider } from "@homarr/modals";
@@ -53,7 +55,7 @@ export const viewport: Viewport = {
export default async function Layout(props: { children: React.ReactNode; params: { locale: string } }) {
const session = await auth();
const colorScheme = session?.user.colorScheme;
const colorScheme = cookies().get("homarr-color-scheme")?.value ?? "light";
const StackedProvider = composeWrappers([
(innerProps) => {