feat: add server settings for default board, default color scheme and default locale (#1373)

* feat: add server settings for default board, default color scheme and default locale

* chore: address pull request feedback

* test: adjust unit tests to match requirements

* fix: deepsource issue

* chore: add deepsource as dependency to translation library

* refactor: restructure language-combobox, adjust default locale for next-intl

* chore: change cookie keys prefix from homarr- to homarr.

apps/nextjs/src/app/[locale]/layout.tsx

@@ -6,7 +6,6 @@ import "@homarr/spotlight/styles.css";
 import "@homarr/ui/styles.css";
 import "~/styles/scroll-area.scss";
 
-import { cookies } from "next/headers";
 import { notFound } from "next/navigation";
 import { NextIntlClientProvider } from "next-intl";
 
@@ -19,6 +18,7 @@ import { getI18nMessages, getScopedI18n } from "@homarr/translation/server";
 
 import { Analytics } from "~/components/layout/analytics";
 import { SearchEngineOptimization } from "~/components/layout/search-engine-optimization";
+import { getCurrentColorSchemeAsync } from "~/theme/color-scheme";
 import { JotaiProvider } from "./_client-providers/jotai";
 import { CustomMantineProvider } from "./_client-providers/mantine";
 import { AuthProvider } from "./_client-providers/session";
@@ -30,7 +30,8 @@ const fontSans = Inter({
   variable: "--font-sans",
 });
 
-export const generateMetadata = (): Metadata => ({
+// eslint-disable-next-line no-restricted-syntax
+export const generateMetadata = async (): Promise<Metadata> => ({
   title: "Homarr",
   description:
     "Simplify the management of your server with Homarr - a sleek, modern dashboard that puts all of your apps and services at your fingertips.",
@@ -49,7 +50,7 @@ export const generateMetadata = (): Metadata => ({
     title: "Homarr",
     capable: true,
     startupImage: { url: "/logo/logo.png" },
-    statusBarStyle: getColorScheme() === "dark" ? "black-translucent" : "default",
+    statusBarStyle: (await getCurrentColorSchemeAsync()) === "dark" ? "black-translucent" : "default",
   },
 });
 
@@ -66,7 +67,7 @@ export default async function Layout(props: { children: React.ReactNode; params:
   }
 
   const session = await auth();
-  const colorScheme = getColorScheme();
+  const colorScheme = await getCurrentColorSchemeAsync();
   const tCommon = await getScopedI18n("common");
   const direction = tCommon("direction");
   const i18nMessages = await getI18nMessages();
@@ -78,7 +79,7 @@ export default async function Layout(props: { children: React.ReactNode; params:
     (innerProps) => <JotaiProvider {...innerProps} />,
     (innerProps) => <TRPCReactProvider {...innerProps} />,
     (innerProps) => <NextIntlClientProvider {...innerProps} messages={i18nMessages} />,
-    (innerProps) => <CustomMantineProvider {...innerProps} />,
+    (innerProps) => <CustomMantineProvider {...innerProps} defaultColorScheme={colorScheme} />,
     (innerProps) => <ModalProvider {...innerProps} />,
   ]);
 
@@ -106,7 +107,3 @@ export default async function Layout(props: { children: React.ReactNode; params:
     </html>
   );
 }
-
-const getColorScheme = () => {
-  return cookies().get("homarr-color-scheme")?.value ?? "dark";
-};