import React, { ReactComponentElement } from "react";
import { MainPage } from "@/pages/main";
import { RouteProps } from "react-router-dom";
import { InternshipProposalFormPage, InternshipProposalPreviewPage } from "@/pages/internship/proposal";
import { NotFoundPage } from "@/pages/errors/not-found";
import SubmitPlanPage from "@/pages/internship/plan";

type Route = {
    name?: string;
    content: () => ReactComponentElement<any>,
} & RouteProps;

export const routes: Route[] = [
    { name: "home", path: "/", exact: true, content: () => <MainPage/> },

    { name: "internship_proposal", path: "/internship/proposal", exact: true, content: () => <InternshipProposalFormPage/> },
    { name: "internship_proposal_preview", path: "/internship/preview/proposal", exact: true, content: () => <InternshipProposalPreviewPage/> },
    { name: "internship_plan", path: "/internship/plan", exact: true, content: () => <SubmitPlanPage/> },

    // fallback route for 404 pages
    { name: "fallback", path: "*", content: () => <NotFoundPage/> }
]

const routeNameMap = new Map(routes.filter(({ name }) => !!name).map(({ name, path }) => [name, path instanceof Array ? path[0] : path])) as Map<string, string>

export function route(name: string, params: { [param: string]: string } = {}) {
    const url = routeNameMap.get(name) || "";

    return Object.entries(params).reduce((url, [name, value]) => url.replace(`:${ name }`, value), url);
}