Merge branch 'main' into N21-2159-review-11

src/layouts/LoggedIn.unit.ts

@@ -19,6 +19,8 @@ import { h, nextTick } from "vue";
 import { VApp } from "vuetify/lib/components/index.mjs";
 import LoggedInLayout from "./LoggedIn.layout.vue";
 import { Topbar } from "@ui-layout";
+import { createTestingPinia } from "@pinia/testing";
+import setupStores from "@@/tests/test-utils/setupStores";
 
 jest.mock("vue-router", () => ({
 	useRoute: () => ({ path: "rooms/courses-list" }),
@@ -43,12 +45,20 @@ const setup = () => {
 		},
 	});
 
+	setupStores({
+		envConfigModule: EnvConfigModule,
+	});
+
 	const wrapper = mount(VApp, {
 		slots: {
 			default: h(LoggedInLayout),
 		},
 		global: {
-			plugins: [createTestingVuetify(), createTestingI18n()],
+			plugins: [
+				createTestingVuetify(),
+				createTestingI18n(),
+				createTestingPinia(),
+			],
 			provide: {
 				[AUTH_MODULE_KEY.valueOf()]: authModule,
 				[ENV_CONFIG_MODULE_KEY.valueOf()]: envConfigModule,

src/locales/de.ts

@@ -25,6 +25,7 @@ export default {
 	"common.actions.shareCopy": "Kopie teilen",
 	"common.actions.update": "Aktualisieren",
 	"common.ariaLabel.newTab": "öffnet in einem neuen Tab",
+	"common.ariaLabel.sameTab": "öffnet im selben Tab",
 	"common.labels.admin": "Admin(s)",
 	"common.labels.birthdate": "Geburtsdatum",
 	"common.labels.birthday": "Geburtsdatum",
@@ -97,6 +98,7 @@ export default {
 	"common.medium.chip.deactivated": "Deaktiviert",
 	"common.medium.chip.notLicensed": "Nicht freigeschaltet",
 	"common.medium.chip.incomplete": "Konfiguration unvollständig",
+	"common.medium.chip.noLongerAvailable": "Nicht mehr verfügbar",
 	"common.medium.information.admin": "Bitte Einstellungen überprüfen.",
 	"common.medium.information.student": "Bitte an eine Lehrkraft wenden.",
 	"common.medium.information.teacher": "Bitte an Schuladministrator:in wenden.",

src/locales/en.ts

@@ -25,6 +25,7 @@ export default {
 	"common.actions.shareCopy": "Share copy",
 	"common.actions.update": "Update",
 	"common.ariaLabel.newTab": "opens in a new tab",
+	"common.ariaLabel.sameTab": "opens in the same tab",
 	"common.labels.admin": "",
 	"common.labels.birthdate": "Date of birth",
 	"common.labels.birthday": "Date of Birth",
@@ -97,6 +98,7 @@ export default {
 	"common.medium.chip.deactivated": "Disabled",
 	"common.medium.chip.notLicensed": "Not activated",
 	"common.medium.chip.incomplete": "Configuration incomplete",
+	"common.medium.chip.noLongerAvailable": "No longer available",
 	"common.medium.information.admin": "Please check settings.",
 	"common.medium.information.student": "Please contact a teacher.",
 	"common.medium.information.teacher":

src/locales/es.ts

@@ -25,6 +25,7 @@ export default {
 	"common.actions.shareCopy": "Compartir copia",
 	"common.actions.update": "Actualizar",
 	"common.ariaLabel.newTab": "se abre en una nueva pestaña",
+	"common.ariaLabel.sameTab": "se abre en la misma pestaña",
 	"common.labels.admin": "Admin(s)",
 	"common.labels.birthdate": "Fecha de nacimiento",
 	"common.labels.birthday": "Fecha de nacimiento",
@@ -97,6 +98,7 @@ export default {
 	"common.medium.chip.deactivated": "Desactivado",
 	"common.medium.chip.notLicensed": "No esta activado",
 	"common.medium.chip.incomplete": "Configuración incompleta",
+	"common.medium.chip.noLongerAvailable": "Ya no está disponible",
 	"common.medium.information.admin": "Por favor verifique la configuración.",
 	"common.medium.information.student": "Por favor contacte a un maestro.",
 	"common.medium.information.teacher":

src/locales/uk.ts

@@ -25,6 +25,7 @@ export default {
 	"common.actions.shareCopy": "Поділитися копією",
 	"common.actions.update": "Оновити",
 	"common.ariaLabel.newTab": "відкривається в новій вкладці",
+	"common.ariaLabel.sameTab": "відкривається в тій же вкладці",
 	"common.labels.admin": "адміністратор(и)",
 	"common.labels.birthdate": "Дата народження",
 	"common.labels.birthday": "Дата народження",
@@ -97,6 +98,7 @@ export default {
 	"common.medium.chip.deactivated": "Вимкнено",
 	"common.medium.chip.notLicensed": "Не активовано",
 	"common.medium.chip.incomplete": "Конфігурація не завершена",
+	"common.medium.chip.noLongerAvailable": "Більше не доступний",
 	"common.medium.information.admin": "Перевірте налаштування.",
 	"common.medium.information.student": "Будь ласка, зверніться до вчителя.",
 	"common.medium.information.teacher":

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

@@ -17,6 +17,7 @@ import {
 	CourseRoomsApiFactory,
 	SubmissionContainerElementContentBody,
 } from "@/serverApi/v3";
+import { BoardContextType } from "@/types/board/BoardContext";
 import { AnyContentElement } from "@/types/board/ContentElement";
 import { $axios, mapAxiosErrorToResponseError } from "@/utils/api";
 import { createApplicationError } from "@/utils/create-application-error.factory";
@@ -185,7 +186,7 @@ export const useBoardApi = () => {
 		});
 	};
 
-	type ContextInfo = { id: string; name: string };
+	type ContextInfo = { id: string; type: BoardContextType; name: string };
 
 	const getContextInfo = async (
 		boardId: string
@@ -205,6 +206,7 @@ export const useBoardApi = () => {
 		}
 		return {
 			id: roomResponse.data.roomId,
+			type: context.type,
 			name: roomResponse.data.title,
 		};
 	};

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

@@ -4,6 +4,7 @@ import { createSharedComposable } from "@vueuse/core";
 import { ref, Ref } from "vue";
 import { useI18n } from "vue-i18n";
 import { useBoardApi } from "./BoardApi.composable";
+import { BoardContextType } from "@/types/board/BoardContext";
 
 const useBoardPageInformation = () => {
 	const { t } = useI18n();
@@ -20,6 +21,7 @@ const useBoardPageInformation = () => {
 	const pageTitle: Ref<string> = ref(getPageTitle());
 	const roomId: Ref<string | undefined> = ref(undefined);
 	const breadcrumbs: Ref<Breadcrumb[]> = ref([]);
+	const contextType: Ref<BoardContextType | undefined> = ref();
 
 	function getBreadcrumbs(
 		contextInfo: { id: string; name: string } | undefined
@@ -44,12 +46,14 @@ const useBoardPageInformation = () => {
 		const contextInfo = await getContextInfo(id);
 		pageTitle.value = getPageTitle(contextInfo?.name);
 		breadcrumbs.value = getBreadcrumbs(contextInfo);
+		contextType.value = contextInfo?.type;
 		roomId.value = contextInfo?.id;
 	};
 
 	return {
 		createPageInformation,
 		breadcrumbs,
+		contextType,
 		pageTitle,
 		roomId,
 	};

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

@@ -2,6 +2,7 @@ import { mountComposable } from "@@/tests/test-utils/mountComposable";
 import { createMock, DeepMocked } from "@golevelup/ts-jest";
 import { useBoardApi } from "./BoardApi.composable";
 import { useSharedBoardPageInformation } from "./BoardPageInformation.composable";
+import { BoardContextType } from "@/types/board/BoardContext";
 
 jest.mock("./BoardApi.composable");
 const mockedUseBoardApi = jest.mocked(useBoardApi);
@@ -36,13 +37,25 @@ describe("BoardPageInformation.composable", () => {
 		const setup = () => {
 			mockedBoardApiCalls.getContextInfo.mockResolvedValue({
 				id: "courseId",
+				type: BoardContextType.Course,
 				name: "Course #1",
 			});
 
-			const { createPageInformation, breadcrumbs, pageTitle, roomId } =
-				mountComposable(() => useSharedBoardPageInformation());
-
-			return { createPageInformation, breadcrumbs, pageTitle, roomId };
+			const {
+				createPageInformation,
+				breadcrumbs,
+				contextType,
+				pageTitle,
+				roomId,
+			} = mountComposable(() => useSharedBoardPageInformation());
+
+			return {
+				createPageInformation,
+				breadcrumbs,
+				contextType,
+				pageTitle,
+				roomId,
+			};
 		};
 
 		it("should return two breadcrumbs: 1. course page and and 2. course-overview page", async () => {
@@ -74,6 +87,16 @@ describe("BoardPageInformation.composable", () => {
 
 			expect(roomId.value).toEqual("courseId");
 		});
+
+		it("should set context type", async () => {
+			const { createPageInformation, contextType } = setup();
+
+			const fakeId = "abc123-2";
+
+			await createPageInformation(fakeId);
+
+			expect(contextType.value).toEqual(BoardContextType.Course);
+		});
 	});
 
 	describe("when board context does not exist", () => {

src/modules/data/room/RoomDetails.store.ts

@@ -0,0 +1,44 @@
+import { Room } from "@/types/room/Room";
+import { delay } from "@/utils/helpers";
+import { ref } from "vue";
+import { roomsData } from "./rooms-mock-data";
+import { defineStore } from "pinia";
+
+export enum RoomVariant {
+	ROOM = "room",
+	COURSE_ROOM = "courseRoom",
+}
+
+export const useRoomDetailsStore = defineStore("roomDetailsStore", () => {
+	const isLoading = ref(true);
+	const room = ref<Room>();
+	const roomVariant = ref<RoomVariant>();
+
+	const fetchRoom = async (id: string) => {
+		await delay(100);
+		// TODO call API
+		room.value = roomsData.find((r) => r.id === id);
+		roomVariant.value =
+			room.value != null ? RoomVariant.ROOM : RoomVariant.COURSE_ROOM;
+		isLoading.value = false;
+	};
+
+	const resetState = () => {
+		isLoading.value = true;
+		room.value = undefined;
+	};
+
+	const deactivateRoom = () => {
+		resetState();
+		isLoading.value = false;
+	};
+
+	return {
+		deactivateRoom,
+		fetchRoom,
+		isLoading,
+		resetState,
+		room,
+		roomVariant,
+	};
+});

src/modules/data/room/index.ts

@@ -1,5 +1,5 @@
 export { useCourseApi } from "./courseApi.composable";
 export { useRoomsState } from "./Rooms.state";
-export { useRoomDetailsState } from "./RoomDetails.state";
+export { useRoomDetailsStore, RoomVariant } from "./RoomDetails.store";
 export { useCourseInfoApi } from "./courseInfoApi.composable";
 export { useCourseList } from "./courseList.composable";

src/modules/feature/board-deleted-element/DeletedElement.unit.ts

@@ -1,5 +1,4 @@
-import { ContentElementType, DeletedElementResponse } from "@/serverApi/v3";
-import { timestampsResponseFactory } from "@@/tests/test-utils";
+import { deletedElementResponseFactory } from "@@/tests/test-utils";
 import {
 	createTestingI18n,
 	createTestingVuetify,
@@ -15,16 +14,6 @@ import DeletedElementMenu from "./DeletedElementMenu.vue";
 
 jest.mock("@data-board");
 
-const DELETED_ELEMENT: DeletedElementResponse = {
-	id: "deleted-element-id",
-	content: {
-		deletedElementType: ContentElementType.ExternalTool,
-		title: "Deleted Tool",
-	},
-	type: ContentElementType.Deleted,
-	timestamps: timestampsResponseFactory.build(),
-};
-
 describe("DeletedElement", () => {
 	let useBoardFocusHandlerMock: DeepMocked<
 		ReturnType<typeof useBoardFocusHandler>
@@ -50,7 +39,7 @@ describe("DeletedElement", () => {
 
 	const getWrapper = (
 		props: ComponentProps<typeof DeletedElement> = {
-			element: DELETED_ELEMENT,
+			element: deletedElementResponseFactory.build(),
 			isEditMode: false,
 		}
 	) => {
@@ -75,7 +64,7 @@ describe("DeletedElement", () => {
 			useBoardPermissionsMock.isTeacher = false;
 
 			const { wrapper } = getWrapper({
-				element: DELETED_ELEMENT,
+				element: deletedElementResponseFactory.build(),
 				isEditMode: true,
 			});
 
@@ -97,7 +86,7 @@ describe("DeletedElement", () => {
 		describe("when in edit mode", () => {
 			const setup = () => {
 				const { wrapper } = getWrapper({
-					element: DELETED_ELEMENT,
+					element: deletedElementResponseFactory.build(),
 					isEditMode: true,
 				});
 
@@ -118,7 +107,7 @@ describe("DeletedElement", () => {
 		describe("when not in edit mode", () => {
 			const setup = () => {
 				const { wrapper } = getWrapper({
-					element: DELETED_ELEMENT,
+					element: deletedElementResponseFactory.build(),
 					isEditMode: false,
 				});
 
@@ -138,24 +127,26 @@ describe("DeletedElement", () => {
 
 		describe("when deleting the element", () => {
 			const setup = () => {
+				const deletedElement = deletedElementResponseFactory.build();
 				const { wrapper } = getWrapper({
-					element: DELETED_ELEMENT,
+					element: deletedElement,
 					isEditMode: true,
 				});
 
 				return {
 					wrapper,
+					deletedElement,
 				};
 			};
 
 			it("should emit an event", async () => {
-				const { wrapper } = setup();
+				const { wrapper, deletedElement } = setup();
 
 				wrapper.findComponent(DeletedElementMenu).vm.$emit("delete:element");
 				await nextTick();
 
 				expect(wrapper.emitted("delete:element")).toEqual([
-					[DELETED_ELEMENT.id],
+					[deletedElement.id],
 				]);
 			});
 		});
@@ -165,7 +156,7 @@ describe("DeletedElement", () => {
 		describe("when the deleted element was an external tool element", () => {
 			const setup = () => {
 				const { wrapper } = getWrapper({
-					element: DELETED_ELEMENT,
+					element: deletedElementResponseFactory.build(),
 					isEditMode: true,
 				});