import React from "react";
import { useMemo } from "react";
import { useSelector } from "react-redux";

import { selectAuth } from "@redux/outstaffingSlice";

import { DeveloperPage } from "@pages/roles/DeveloperPage";
import { GuestPage } from "@pages/roles/GuestPage";
import { PartnerPage } from "@pages/roles/PartnerPage";

export const MainPage = () => {
  const roleId = localStorage.getItem("role_status");
  const isAuth = useSelector(selectAuth);
  const user_roles = {
    developer: 4,
    partner: 18
  };

  const CurrentRolePage = useMemo(() => getRolePage(Number(roleId)), [isAuth]);

  function getRolePage(roleId) {
    switch (roleId) {
      case user_roles.developer:
        return DeveloperPage;
      case user_roles.partner:
        return PartnerPage;
      default:
        return GuestPage;
    }
  }

  return <CurrentRolePage />;
};