import type { ComponentType } from "react";
import { ChampionDetailPage } from "../pages/ChampionDetailPage";
import { ChampionsPage } from "../pages/ChampionsPage";
import { HomePage } from "../pages/HomePage";
import { PlayPage } from "../pages/PlayPage";
import { ProfilePage } from "../pages/ProfilePage";
import { SettingsPage } from "../pages/SettingsPage";
import type { AppRoute } from "../types/navigation";

type RouteComponent = ComponentType;

export const appRoutes: Array<AppRoute & { component: RouteComponent }> = [
  {
    id: "home",
    title: "Home",
    path: "/",
    component: HomePage
  },
  {
    id: "play",
    title: "Play",
    path: "/play",
    component: PlayPage
  },
  {
    id: "champions",
    title: "Champions",
    path: "/champions",
    component: ChampionsPage
  },
  {
    id: "champion-detail",
    title: "Champion Detail",
    path: "/champions/:championId",
    component: ChampionDetailPage
  },
  {
    id: "profile",
    title: "Profile",
    path: "/profile",
    component: ProfilePage
  },
  {
    id: "settings",
    title: "Settings",
    path: "/settings",
    component: SettingsPage
  }
];