update routes

src/components/atoms/vCustomBreadcrumbs.unit.ts

@@ -12,7 +12,9 @@ describe("@/components/atoms/vCustomBreadcrumbs", () => {
 				plugins: [createTestingVuetify(), createTestingI18n()],
 			},
 			props: {
-				breadcrumbs: [{ title: "Cursos actuales", to: "/rooms-overview" }],
+				breadcrumbs: [
+					{ title: "Cursos actuales", to: "/rooms/courses-overview" },
+				],
 			},
 		});
 
@@ -26,7 +28,7 @@ describe("@/components/atoms/vCustomBreadcrumbs", () => {
 			name: "v-breadcrumbs-item",
 		});
 
-		expect(breadcrumbsItem.props().to).toStrictEqual("/rooms-overview");
+		expect(breadcrumbsItem.props().to).toStrictEqual("/rooms/courses-overview");
 		expect(breadcrumbsItem.element.innerHTML).toContain("Cursos actuales");
 	});
 });

src/layouts/LoggedIn.unit.ts

@@ -20,7 +20,7 @@ import { VApp } from "vuetify/lib/components/index.mjs";
 import NewLoggedIn from "./LoggedIn.layout.vue";
 
 jest.mock("vue-router", () => ({
-	useRoute: () => ({ path: "rooms-list" }),
+	useRoute: () => ({ path: "rooms/courses-list" }),
 }));
 
 const setup = () => {

src/modules/data/board/BoardPageInformation.composable.ts

@@ -28,7 +28,7 @@ const useBoardPageInformation = () => {
 			? [
 					{
 						title: t("common.words.courses"),
-						to: "/rooms-overview",
+						to: "/rooms/courses-overview",
 						disabled: false,
 					},
 					{

src/modules/ui/layout/sidebar/Sidebar.unit.ts

@@ -20,7 +20,7 @@ import { SchulcloudTheme } from "@/serverApi/v3";
 import { envsFactory } from "@@/tests/test-utils";
 
 jest.mock("vue-router", () => ({
-	useRoute: () => ({ path: "rooms-list" }),
+	useRoute: () => ({ path: "rooms/courses-list" }),
 }));
 
 const setup = (permissions?: string[]) => {

src/modules/ui/layout/sidebar/SidebarCategoryItem.unit.ts

@@ -30,7 +30,7 @@ const groupItem: SidebarGroupItem = {
 };
 
 jest.mock("vue-router", () => ({
-	useRoute: () => ({ path: "rooms-list" }),
+	useRoute: () => ({ path: "rooms/courses-list" }),
 }));
 
 describe("@ui-layout/SidebarCategoryItem", () => {

src/modules/ui/layout/sidebar/SidebarItem.unit.ts

@@ -20,7 +20,7 @@ const childItem: SidebarSingleItem = {
 };
 
 jest.mock("vue-router", () => ({
-	useRoute: () => ({ path: "rooms-list" }),
+	useRoute: () => ({ path: "rooms/courses-list" }),
 }));
 
 describe("@ui-layout/SidebarItem", () => {
@@ -56,7 +56,7 @@ describe("@ui-layout/SidebarItem", () => {
 			icon: "mdiOpen",
 			title: "title",
 			testId: "testId",
-			to: "/rooms-overview",
+			to: "/rooms/courses-overview",
 		});
 
 		expect(wrapper.classes()).toContain("v-list-item--active");

src/modules/ui/layout/sidebar/SidebarItem.vue

@@ -35,7 +35,7 @@ const route = useRoute();
 
 const isActive = computed(() => {
 	const anyCoursePageIsActive =
-		route.path.includes("room") && props.item.to === "/rooms-overview";
+		route.path.includes("room") && props.item.to === "/rooms/courses-overview";
 
 	if (anyCoursePageIsActive) {
 		return true;

src/modules/ui/layout/sidebar/SidebarItems.composable.ts

@@ -23,7 +23,7 @@ export const useSidebarItems = () => {
 		},
 		{
 			title: "global.sidebar.item.courses",
-			to: "/rooms-overview",
+			to: "/rooms/courses-overview",
 			icon: "$mdiSchoolOutline",
 			testId: "Course-Overview",
 		},

src/pages/context-external-tool/CourseContextExternalToolConfigurator.page.vue

@@ -51,7 +51,9 @@ const { t } = useI18n();
 const contextRoute = computed(() => `/rooms/${props.contextId}`);
 
 const breadcrumbs: ComputedRef<Breadcrumb[]> = computed(() => {
-	const crumbs = [{ title: t("common.words.courses"), to: "/rooms-overview/" }];
+	const crumbs = [
+		{ title: t("common.words.courses"), to: "/rooms/courses-overview/" },
+	];
 
 	if (courseTitle.value) {
 		crumbs.push({ title: courseTitle.value, to: contextRoute });

src/pages/rooms/CourseRoomDetails.page.vue

@@ -197,7 +197,7 @@ export default defineComponent({
 			breadcrumbs: [
 				{
 					title: this.$t("common.words.courses"),
-					to: "/rooms-overview",
+					to: "/rooms/courses-overview",
 					disabled: false,
 				},
 			],
@@ -525,7 +525,7 @@ export default defineComponent({
 					"/rooms/" + copyResult.id.replace(/[^a-z\d]/g, "")
 				);
 			} else {
-				await this.$router.push("/rooms-overview");
+				await this.$router.push("/rooms/courses-overview");
 			}
 		},
 		async onCopyBoardElement(payload) {

src/pages/rooms/CourseRoomList.page.vue

@@ -8,7 +8,7 @@
 				<v-btn
 					variant="outlined"
 					size="small"
-					to="/rooms-overview"
+					to="/rooms/courses-overview"
 					data-testid="go-to-active-courses"
 				>
 					{{ $t("pages.rooms.index.courses.active") }}

src/pages/rooms/CourseRoomOverview.page.vue

@@ -8,7 +8,7 @@
 				<v-btn
 					variant="outlined"
 					size="small"
-					to="/rooms-list"
+					to="/rooms/courses-list"
 					data-testid="go-to-all-courses"
 				>
 					{{ $t("pages.rooms.index.courses.all") }}
@@ -390,7 +390,7 @@ export default defineComponent({
 			if (id) {
 				this.$router.replace({ name: "rooms-id", params: { id } });
 			} else {
-				this.$router.replace({ name: "rooms-overview" });
+				this.$router.replace({ name: "course-room-overview" });
 				courseRoomListModule.fetch();
 			}
 		},

src/router/routes.ts

@@ -231,33 +231,47 @@ export const routes: Readonly<RouteRecordRaw[]> = [
 		beforeEnter: createPermissionGuard(["news_edit"]),
 	},
 	{
-		path: `/rooms/:id(${REGEX_ID})`,
-		component: () => import("@/pages/rooms/CourseRoomDetails.page.vue"),
-		name: "rooms-id",
-	},
-	{
+		// TODO BC-7822, BC-7823 target this route at new rooms page
 		path: `/rooms`,
-		redirect: { name: "rooms-overview" },
+		redirect: { name: "course-room-overview" },
 		name: "rooms",
 	},
+	// TODO Is this redirect really necessary? How likely is it that there are bookmarks?
 	{
-		path: `/rooms/:id(${REGEX_ID})/board`,
-		component: async () => (await import("@page-board")).ColumnBoardPage,
-		name: "rooms-board",
-		props: (route: RouteLocationNormalized) => ({
-			boardId: route.params.id,
-		}),
+		path: "/rooms-list",
+		redirect: { name: "course-room-list" },
+		name: "rooms-list",
 	},
 	{
-		path: "/rooms-list",
+		path: "/rooms/courses-list",
 		component: () => import("@/pages/rooms/CourseRoomList.page.vue"),
-		name: "rooms-list",
+		name: "course-room-list",
 	},
 	{
 		path: "/rooms-overview",
-		component: () => import("@/pages/rooms/CourseRoomOverview.page.vue"),
+		redirect: { name: "course-room-overview" },
 		name: "rooms-overview",
 	},
+	{
+		path: "/rooms/courses-overview",
+		component: () => import("@/pages/rooms/CourseRoomOverview.page.vue"),
+		name: "course-room-overview",
+	},
+	{
+		// TODO BC-7822, BC-7823 target this route at new room details page
+		// and decide on that page which sub-component (page) has to be rendered
+		path: `/rooms/:id(${REGEX_ID})`,
+		component: () => import("@/pages/rooms/CourseRoomDetails.page.vue"),
+		name: "rooms-id",
+	},
+	{
+		path: `/rooms/:id(${REGEX_ID})/board`,
+		component: async () => (await import("@page-board")).ColumnBoardPage,
+		name: "rooms-board",
+		props: (route: RouteLocationNormalized) => ({
+			boardId: route.params.id,
+		}),
+	},
 	{
 		path: "/tasks",
 		component: () => import("@/pages/tasks/TaskOverview.page.vue"),

src/router/vue-client-route.js

@@ -34,13 +34,15 @@ const vueRoutes = [
 	`^/news/new/?$`,
 	`^/news/${mongoId}/edit/?$`,
 	`^/poc-files/?$`,
-	`^/rooms-overview/?$`,
-	`^/rooms-list/?$`,
 	`^/h5p/player/${h5pId}/?$`,
 	`^/h5p/editor/?$`,
 	`^/h5p/editor/${h5pId}/?$`,
-	`^/rooms/${mongoId}/?$`,
 	`^/rooms/?$`,
+	`^/rooms/rooms-list/?$`,
+	`^/rooms/courses-list/?$`,
+	`^/rooms/courses-overview/?$`,
+	`^/rooms-overview/?$`,
+	`^/rooms/${mongoId}/?$`,
 	`^/rooms/${mongoId}/board?$`,
 	`^/tasks/?$`,
 	`^/error/?$`,

src/store/share.ts

@@ -53,7 +53,7 @@ export default class ShareModule extends VuexModule {
 					shareTokenPayload
 				);
 			if (!shareTokenResult) return undefined;
-			const shareUrl = `${window.location.origin}/rooms-overview?import=${shareTokenResult.data.token}`;
+			const shareUrl = `${window.location.origin}/rooms/courses-overview?import=${shareTokenResult.data.token}`;
 			this.setShareUrl(shareUrl);
 			return shareTokenResult.data;
 		} catch {

src/store/share.unit.ts

@@ -69,7 +69,7 @@ describe("share module", () => {
 					await shareModule.createShareUrl(sharePayload);
 					const result = setShareUrlMock.mock.calls[0][0];
 
-					expect(result).toContain("rooms-overview?import=sampleToken");
+					expect(result).toContain("rooms/courses-overview?import=sampleToken");
 				});
 
 				it("should return undefined on error", async () => {

src/utils/sidebar-base-items.ts

@@ -42,14 +42,10 @@ const getSidebarItems = (): SidebarItemList => [
 	},
 	{
 		title: "global.sidebar.item.courses",
-		to: "/rooms-overview",
+		to: "/rooms/courses-overview",
 		icon: "$mdiSchoolOutline",
 		testId: "Course-Overview",
-		activeForUrls: [
-			"^/rooms-overview($|/.*)",
-			"^/rooms($|/.*)",
-			"^/rooms-list($|/.*)",
-		],
+		activeForUrls: ["^/rooms($|/.*)"],
 	},
 	{
 		title: "global.sidebar.item.teams",