Use dynamic favicon in root sidebar

components/root/root-dashboard-shell.tsx

@@ -5,6 +5,7 @@ import {
   Globe2,
   ImageIcon,
   LayoutDashboard,
+  LogOut,
   PlusSquare,
   ShieldAlert,
   SwatchBook,
@@ -16,6 +17,7 @@ import { DashboardLayout } from "@/components/dashboard/dashboard-layout";
 import { MotionFade } from "@/components/motion-fade";
 import { ThemeToggle } from "@/components/theme-toggle";
 import { Button } from "@/components/ui/button";
+import { getSiteSettingsMediaBindings } from "@/lib/app-config";
 import { getLocalizedPath } from "@/lib/locale";
 import { getRootNavigation } from "@/lib/root-navigation";
 
@@ -44,7 +46,7 @@ type RootDashboardShellProps = {
   children: ReactNode;
 };
 
-export function RootDashboardShell({
+export async function RootDashboardShell({
   copy,
   active,
   portfolioChild,
@@ -55,6 +57,7 @@ export function RootDashboardShell({
   toolbar,
   children,
 }: RootDashboardShellProps) {
+  const mediaBindings = await getSiteSettingsMediaBindings();
   const sidebarItems = getRootNavigation(copy, active, portfolioChild).filter(
     (item) => item.href !== "/root/maintenance" && item.href !== "/root/ui-kit",
   );
@@ -86,6 +89,7 @@ export function RootDashboardShell({
       description={headerDescription}
       icon={headerIcon}
       items={sidebarItems}
+      sidebarIconSrc={mediaBindings.favicon?.url}
       sidebarTop={
         <Button asChild variant="outline" className="w-full justify-between">
           <Link href={getLocalizedPath("de")} target="_blank" rel="noreferrer">
@@ -119,6 +123,7 @@ export function RootDashboardShell({
           <form action={logoutAction}>
             <Button type="submit" variant="ghost" className="w-full justify-between text-destructive hover:bg-destructive/10 hover:text-destructive">
               {copy.logout}
+              <LogOut className="h-4 w-4" />
             </Button>
           </form>
         </>