origin/apps/web/src/routes/index.tsx

import {
	createBrowserRouter,
	IndexRouteObject,
	Link,
	NonIndexRouteObject,
} from "react-router-dom";
import ErrorPage from "../app/error";
import WithAuth from "../components/utils/with-auth";
import LoginPage from "../app/login";
import StudentCoursesPage from "../app/main/courses/student/page";
import InstructorCoursesPage from "../app/main/courses/instructor/page";
import HomePage from "../app/main/home/page";
import { CourseDetailPage } from "../app/main/course/detail/page";
import { CourseBasicForm } from "../components/models/course/editor/form/CourseBasicForm";
import CourseContentForm from "../components/models/course/editor/form/CourseContentForm/CourseContentForm";
import { CourseGoalForm } from "../components/models/course/editor/form/CourseGoalForm";
import CourseSettingForm from "../components/models/course/editor/form/CourseSettingForm";
import CourseEditorLayout from "../components/models/course/editor/layout/CourseEditorLayout";
import { MainLayout } from "../app/main/layout/MainLayout";
import CoursesPage from "../app/main/courses/page";
import PathsPage from "../app/main/paths/page";
import { adminRoute } from "./admin-route";
interface CustomIndexRouteObject extends IndexRouteObject {
	name?: string;
	breadcrumb?: string;
}
interface CustomIndexRouteObject extends IndexRouteObject {
	name?: string;
	breadcrumb?: string;
}

export interface CustomNonIndexRouteObject extends NonIndexRouteObject {
	name?: string;
	children?: CustomRouteObject[];
	breadcrumb?: string;
	handle?: {
		crumb: (data?: any) => void;
	};
}
export type CustomRouteObject =
	| CustomIndexRouteObject
	| CustomNonIndexRouteObject;
export const routes: CustomRouteObject[] = [
	{
		path: "/",
		errorElement: <ErrorPage />,
		handle: {
			crumb() {
				return <Link to={"/"}>主页</Link>;
			},
		},
		children: [
			{
				element: <MainLayout></MainLayout>,
				children: [
					{
						index: true,
						element: <HomePage />,

					},
					{
						path: "paths",
						element: <PathsPage></PathsPage>
					},
					{
						path: "courses",
						element: <CoursesPage></CoursesPage>,
					},
					{
						path: "my-courses",
					},
					{
						path: "profiles",
					},
					{
						path: "courses",
						children: [
							{
								path: "student",
								element: (
									<WithAuth>
										<StudentCoursesPage />
									</WithAuth>
								),
							},
							{
								path: "instructor",
								element: (
									<WithAuth>
										<InstructorCoursesPage />
									</WithAuth>
								),
							},
						],
					},
				],
			},
			{
				path: "course",
				children: [
					{
						path: ":id?/editor",
						element: <CourseEditorLayout></CourseEditorLayout>,
						children: [
							{
								index: true,
								element: <CourseBasicForm></CourseBasicForm>,
							},
							{
								path: "goal",
								element: <CourseGoalForm></CourseGoalForm>,
							},
							{
								path: "content",
								element: (
									<CourseContentForm></CourseContentForm>
								),
							},
							{
								path: "setting",
								element: (
									<CourseSettingForm></CourseSettingForm>
								),
							},
						],
					},
					{
						path: ":id?/detail", // 使用 ? 表示 id 参数是可选的
						element: <CourseDetailPage />,
					},
				],
			},
			adminRoute,
		],
	},
	{
		path: "/login",
		breadcrumb: "登录",
		element: <LoginPage></LoginPage>,
	},
];

export const router = createBrowserRouter(routes);