import React from "react";
import { auth } from "@/server/auth";

import { hasPermission, Role } from "@/lib/validation/permissions";

import { ModeToggle } from "../mode-switch";
import EditorDropdown from "../editor-dropdown";
import { SidebarTrigger } from "./app-sidebar/sidebar-trigger";

async function Navbar() {
  const session = await auth();
  const isEditor = session?.user
    ? hasPermission(session.user.role, Role.EDITOR)
    : false;

  return (
    <div className="flex h-14 items-center justify-between gap-4 border-b bg-sidebar px-4">
      <SidebarTrigger />
      <div className="flex items-center gap-4">
        {isEditor && <EditorDropdown />}

        <ModeToggle />
      </div>
    </div>
  );
}

export default Navbar;
