import { IoMdLogIn, IoMdOptions } from "react-icons/io";
import { RiHome3Fill } from "react-icons/ri";
import { HOME, LOGIN, PAGE_NOT_FOUND, SETTINGS, USERS } from "../consts";
import HomePage from "../pages/HomePage";
import LoginPage from "../pages/LoginPage";
import { RoutingTree } from "../types/routesTypes";
import { capitalizeFirstLetter } from "../utils/StringTransformationUtils";

// ----- ROUTES CONFIGURATION -----
// Configuration of the application's route structure
// This includes both parent routes and nested routes within them
export const routesTree: RoutingTree = [
	{
		name: capitalizeFirstLetter(HOME),
		path: "/",
		component: HomePage,
		icon: RiHome3Fill,
	},
	{
		name: capitalizeFirstLetter(USERS),
		path: "users",
		nest: [
			{
				name: "User",
				path: "/",
				component: () => <>User HP</>,
			},
			{
				name: "UserName",
				path: ":username",
				component: (username) => <>User: {username}</>,
			},
			{
				name: "UserNotFound",
				component: () => <>User not found</>,
			},
		],
	},
	{
		name: capitalizeFirstLetter(SETTINGS),
		path: SETTINGS,
		component: () => <>Settings</>,
		icon: IoMdOptions,
	},
	{
		name: capitalizeFirstLetter(LOGIN),
		path: LOGIN,
		component: LoginPage,
		icon: IoMdLogIn,
	},
	{
		name: capitalizeFirstLetter(PAGE_NOT_FOUND),
		component: () => <>💥404💥</>,
	},
];
export default routesTree;
