Hi, I am trying to create a dashboard using next.js and i ran into a problem
The topbar isnt rendering, everything else works perfectly fine but i am just having difficulty rendering the topbar

import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "../scss/DashboardPage.scss";

const inter = Inter({ subsets: ["latin"] });
export default function RootLayout({
  children,
  CategoryDashboard,
  TopBar,
}: Readonly<{
  children: React.ReactNode;
  CategoryDashboard: React.ReactNode;
  TopBar: React.ReactNode;
}>) {
  return (
    <div style={{ display: "flex" }}>
      <div>{children}</div>
      <div style={{ width: "calc(100% - 300px)", marginLeft: "300px" }}>
        {TopBar}
        {CategoryDashboard}
      </div>
    </div>
  );
}