initial refactoring of roomAuthorization

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

@@ -1,11 +1,33 @@
 import { authModule } from "@/store";
 import { BoardPermissionChecks } from "@/types/board/Permissions";
 import { createSharedComposable } from "@vueuse/core";
+import { useSharedBoardPageInformation } from "./BoardPageInformation.composable";
+import { ref, watch } from "vue";
+import { useRoomDetailsStore } from "@data-room";
+import { BoardContextType } from "@/types/board/BoardContext";
+import { useRoomAuthorization } from "@feature-room";
 
 const boardPermissions = (): BoardPermissionChecks => {
 	const permissions = authModule?.getUserPermissions || [];
 	const userRoles = authModule?.getUserRoles || [];
 
+	const { contextType, roomId } = useSharedBoardPageInformation();
+	const canEditBoard = ref(true);
+
+	watch(
+		() => contextType.value,
+		async () => {
+			if (contextType.value === BoardContextType.Room && roomId.value) {
+				const { fetchRoom } = useRoomDetailsStore();
+				await fetchRoom(roomId?.value);
+				const { currentUserRole, canEditRoomBoard } = useRoomAuthorization();
+				console.log("canEditBoard :", canEditRoomBoard.value);
+				console.log("currentUserRole :", currentUserRole.value);
+				canEditBoard.value = canEditRoomBoard.value;
+			}
+		}
+	);
+
 	return {
 		hasMovePermission: permissions.includes("course_create"),
 		hasCreateCardPermission: permissions.includes("course_create"),
@@ -15,6 +37,7 @@ const boardPermissions = (): BoardPermissionChecks => {
 		hasDeletePermission: permissions.includes("course_remove"),
 		isTeacher: userRoles.includes("teacher"),
 		isStudent: userRoles.includes("student"),
+		canEditRoomBoard: canEditBoard,
 	};
 };
 

src/modules/feature/board/board/BoardHeader.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="d-flex align-items-center">
 		<InlineEditInteractionHandler
-			:isEditMode="isEditMode"
+			:isEditMode="isEditMode && canEditRoomBoard"
 			@start-edit-mode="onStartEditMode"
 			@end-edit-mode="onEndEditMode"
 			@keydown.enter="onStartEditMode"
@@ -15,7 +15,7 @@
 					scope="board"
 					:value="boardTitle"
 					data-testid="board-title"
-					:isEditMode="isEditMode"
+					:isEditMode="isEditMode && canEditRoomBoard"
 					:isFocused="isFocusedById"
 					:maxLength="100"
 					:style="{ width: `${fieldWidth}px` }"
@@ -29,7 +29,7 @@
 			<BoardDraftChip v-if="isDraft" />
 			<div class="mx-2">
 				<BoardMenu
-					v-if="hasEditPermission"
+					v-if="hasEditPermission && canEditRoomBoard"
 					:scope="BoardMenuScope.BOARD"
 					data-testid="board-menu-btn"
 				>
@@ -102,7 +102,7 @@ const { isEditMode, startEditMode, stopEditMode } = useCourseBoardEditMode(
 );
 const boardHeader = ref<HTMLDivElement | null>(null);
 const { isFocusedById } = useBoardFocusHandler(boardId.value, boardHeader);
-const { hasEditPermission } = useBoardPermissions();
+const { hasEditPermission, canEditRoomBoard } = useBoardPermissions();
 
 const inputWidthCalcSpan = ref<HTMLElement>();
 const fieldWidth = ref(0);

src/modules/feature/room/BoardGrid.vue

@@ -20,14 +20,10 @@
 <script setup lang="ts">
 import { RoomBoardItem } from "@/types/room/Room";
 import { PropType, toRef } from "vue";
-import { storeToRefs } from "pinia";
 import { useRoomAuthorization } from "@feature-room";
-import { useRoomDetailsStore } from "@data-room";
 import BoardTile from "./BoardTile.vue";
 
-const { room } = storeToRefs(useRoomDetailsStore());
-
-const { canEditRoom } = useRoomAuthorization(room);
+const { canEditRoom } = useRoomAuthorization();
 
 const props = defineProps({
 	boards: { type: Array as PropType<RoomBoardItem[]> },

src/modules/feature/room/RoomMenu.vue

@@ -39,8 +39,6 @@ import {
 	KebabMenuActionLeaveRoom,
 } from "@ui-kebab-menu";
 import { useRoomAuthorization } from "@feature-room";
-import { useRoomDetailsStore } from "@data-room";
-import { storeToRefs } from "pinia";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
@@ -54,7 +52,6 @@ const emit = defineEmits([
 defineProps({
 	roomName: { type: String, required: false },
 });
-const { room } = storeToRefs(useRoomDetailsStore());
 
 const onDeleteRoom = async (confirmation: Promise<boolean>) => {
 	const shouldDelete = await confirmation;
@@ -64,5 +61,5 @@ const onDeleteRoom = async (confirmation: Promise<boolean>) => {
 };
 
 const { canAddRoomMembers, canEditRoom, canDeleteRoom, canLeaveRoom } =
-	useRoomAuthorization(room);
+	useRoomAuthorization();
 </script>

src/modules/feature/room/roomAuthorization.composable.ts

@@ -1,17 +1,36 @@
 import {
 	Permission,
+	RoleName,
 	ImportUserResponseRoleNamesEnum as Roles,
 } from "@/serverApi/v3";
-import { RoomDetails } from "@/types/room/Room";
-import { AUTH_MODULE_KEY, injectStrict } from "@/utils/inject";
-import { ComputedRef, MaybeRefOrGetter, ref, toValue, watchEffect } from "vue";
+import { useRoomDetailsStore } from "@data-room";
+import { storeToRefs } from "pinia";
+import { authModule } from "@/store";
+import { computed, ref, toValue, watchEffect } from "vue";
 
-export const useRoomAuthorization = (
-	room:
-		| ComputedRef<RoomDetails | undefined>
-		| MaybeRefOrGetter<RoomDetails | undefined>
-) => {
-	const authModule = injectStrict(AUTH_MODULE_KEY);
+const detectRole = (permissions: Permission[]) => {
+	if (permissions.includes(Permission.RoomChangeOwner)) {
+		return RoleName.Roomowner;
+	}
+	if (
+		permissions.includes(Permission.RoomMembersChangeRole) &&
+		!permissions.includes(Permission.RoomDelete)
+	) {
+		return RoleName.Roomadmin;
+	}
+	if (
+		permissions.includes(Permission.RoomEdit) &&
+		permissions.includes(Permission.RoomView) &&
+		!permissions.includes(Permission.RoomMembersChangeRole)
+	) {
+		return RoleName.Roomeditor;
+	}
+
+	return RoleName.Roomviewer;
+};
+
+export const useRoomAuthorization = () => {
+	const { room } = storeToRefs(useRoomDetailsStore());
 
 	const canAddRoomMembers = ref(false);
 	const canRemoveRoomMembers = ref(false);
@@ -21,12 +40,16 @@ export const useRoomAuthorization = (
 	const canEditRoom = ref(false);
 	const canDeleteRoom = ref(false);
 	const canLeaveRoom = ref(false);
+	const canEditRoomBoard = ref(false);
+	const currentUserRole = ref<RoleName | unknown>();
 
 	watchEffect(() => {
 		const permissions = toValue(room)?.permissions ?? [];
 
+		currentUserRole.value = detectRole(permissions);
+
 		canCreateRoom.value =
-			authModule.getUserPermissions.includes(
+			authModule?.getUserPermissions.includes(
 				Permission.RoomCreate.toLowerCase()
 			) && authModule.getUserRoles.includes(Roles.Teacher);
 		canViewRoom.value = permissions.includes(Permission.RoomView);
@@ -38,6 +61,7 @@ export const useRoomAuthorization = (
 		);
 		canChangeOwner.value = permissions.includes(Permission.RoomChangeOwner);
 		canLeaveRoom.value = permissions.includes(Permission.RoomLeave);
+		canEditRoomBoard.value = permissions.includes(Permission.RoomChangeOwner); // TODO: Change this to the correct permission
 	});
 
 	return {
@@ -49,5 +73,7 @@ export const useRoomAuthorization = (
 		canDeleteRoom,
 		canLeaveRoom,
 		canRemoveRoomMembers,
+		currentUserRole,
+		canEditRoomBoard,
 	};
 };

src/modules/page/room/RoomDetails.page.vue

@@ -72,7 +72,7 @@ const pageTitle = computed(() =>
 useTitle(pageTitle);
 
 const { canCreateRoom, canEditRoom, canDeleteRoom, canLeaveRoom, canViewRoom } =
-	useRoomAuthorization(room);
+	useRoomAuthorization();
 
 const roomTitle = computed(() => {
 	return room.value ? room.value.name : t("pages.roomDetails.title");

src/modules/page/room/RoomDetailsSwitch.page.vue

@@ -29,10 +29,10 @@ const envConfigModule = injectStrict(ENV_CONFIG_MODULE_KEY);
 const route = useRoute();
 
 const roomDetailsStore = useRoomDetailsStore();
-const { isLoading, roomVariant, room } = storeToRefs(roomDetailsStore);
+const { isLoading, roomVariant } = storeToRefs(roomDetailsStore);
 const { deactivateRoom, fetchRoom, resetState } = roomDetailsStore;
 
-const { canCreateRoom } = useRoomAuthorization(room);
+const { canCreateRoom } = useRoomAuthorization();
 
 const canAccessRoom = computed(() => {
 	return envConfigModule.getEnv.FEATURE_ROOMS_ENABLED && canCreateRoom.value;

src/modules/page/room/RoomMembers.page.vue

@@ -154,7 +154,7 @@ const fixedHeaderOnMobile = ref({
 });
 const { y } = useElementBounding(wireframe);
 const { askConfirmation } = useConfirmationDialog();
-const { canLeaveRoom } = useRoomAuthorization(room);
+const { canLeaveRoom } = useRoomAuthorization();
 const { isVisibleAddMemberButton, isVisiblePageInfoText } =
 	useRoomMemberVisibilityOptions(currentUser);
 

src/types/board/Permissions.ts

@@ -1,3 +1,5 @@
+import { ref, Ref } from "vue";
+
 export type BoardPermissionChecks = {
 	hasMovePermission: boolean;
 	hasCreateCardPermission: boolean;
@@ -7,6 +9,7 @@ export type BoardPermissionChecks = {
 	hasDeletePermission: boolean;
 	isTeacher: boolean;
 	isStudent: boolean;
+	canEditRoomBoard: Ref<boolean>;
 };
 
 export const defaultPermissions: BoardPermissionChecks = {
@@ -18,4 +21,5 @@ export const defaultPermissions: BoardPermissionChecks = {
 	hasEditPermission: true,
 	isTeacher: true,
 	isStudent: false,
+	canEditRoomBoard: ref(true),
 };