import React from "react";
import { useLocation } from "react-router-dom";
import LoginedHeader from "./loginedHeader";
import NotLoginHeader from "./notLoginHeader";
import { isLoginPaths } from "./utils";

interface HeaderProps {
  userName?: string;
  //   userRole: string; ログインユーザーのロールに応じてタブの活性非活性に使用する想定
}
// ヘッダー切り替え用のcomponent
const Header: React.FC<HeaderProps> = (props) => {
  const { userName } = props;
  const location = useLocation();
  return getHeader(location.pathname, userName);
};

export default Header;

const getHeader = (path: string, userName?: string) => {
  if (isLoginPaths(path) && userName) {
    return <LoginedHeader name={userName} activePath={path} />;
  }
  return <NotLoginHeader isMobile={path === "/"} />;
};