import { Grid } from "../../../../components/grid/Grid";
import { SPACING } from "../../../../data/spacing";
import { NavLink } from "../../../../components/nav-link/NavLink";
import { useLocation } from "react-router-dom";
import {
  ROUTE_GUILD_ROOM_ROUTE_GUILDS,
  ROUTE_GUILD_ROOM_ROUTE_GUILDS_REQUESTS,
  // ROUTE_GUILD_ROOM_ROUTE_GUILDS_SETTINGS,
  ROUTE_GUILD_ROOM_ROUTE_STEWARDS,
  // ROUTE_PROVINCE_ROUTE_GUILDS_SETTINGS,
  // ROUTE_PROVINCE_ROUTE_IN_PROVINCE_STEWARDS,
} from "../../../../routes/routes";
import LinkItem from "../../../../components/link-item/LinkItem";
import { MdCorporateFare } from "react-icons/md";
import { IoIosPeople } from "react-icons/io";

export const GuildRoomOperations = () => {
  const { pathname } = useLocation();

  return (
    <Grid
      container
      gap={SPACING.SMALL}
      p={SPACING.SMALL}
      direction={{ xs: "column", md: "row" }}
      justifyContent="center"
    >
      <NavLink to={ROUTE_GUILD_ROOM_ROUTE_GUILDS_REQUESTS}>
        <LinkItem
          icon={<MdCorporateFare size={30} color="#244CCC" />}
          title="درخواست های ثبت صنف"
        />
      </NavLink>
      <NavLink
        to={ROUTE_GUILD_ROOM_ROUTE_GUILDS}
        active={pathname === ROUTE_GUILD_ROOM_ROUTE_GUILDS ? "true" : null}
      >
        <LinkItem
          icon={<MdCorporateFare size={30} color="#244CCC" />}
          title="اصناف"
        />
      </NavLink>
      <NavLink
        to={ROUTE_GUILD_ROOM_ROUTE_STEWARDS}
        active={pathname === ROUTE_GUILD_ROOM_ROUTE_STEWARDS ? "true" : null}
      >
        <LinkItem
          icon={<IoIosPeople size={30} color="#244CCC" />}
          title="مباشرین"
        />
      </NavLink>
      {/* <NavLink
        to={ROUTE_GUILD_ROOM_ROUTE_GUILDS_SETTINGS}
        active={
          pathname === ROUTE_GUILD_ROOM_ROUTE_GUILDS_SETTINGS ? "true" : null
        }
      >
        <LinkItem
          icon={<IoIosPeople size={30} color="#244CCC" />}
          title="مدیریت فرآیند"
        />
      </NavLink> */}
    </Grid>
  );
};
