fix: Favoriting room through rooms page (#31554)

Co-authored-by: Henrique Guimarães Ribeiro <[email protected]>
RocketChat · Feb 5, 2024 · 5c29cec · 5c29cec
1 parent ef68359
commit 5c29cec
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 10 deletions.
diff --git a/.changeset/serious-cows-compete.md b/.changeset/serious-cows-compete.md
@@ -0,0 +1,5 @@
+---
+"@rocket.chat/meteor": patch
+---
+
+Fixed a bug on the rooms page's "Favorite" setting, which previously failed to designate selected rooms as favorites by default.
diff --git a/apps/meteor/client/views/admin/rooms/EditRoom.tsx b/apps/meteor/client/views/admin/rooms/EditRoom.tsx
@@ -13,7 +13,7 @@ import {
 	TextAreaInput,
 	FieldError,
 } from '@rocket.chat/fuselage';
-import { useMutableCallback, useUniqueId } from '@rocket.chat/fuselage-hooks';
+import { useEffectEvent, useUniqueId } from '@rocket.chat/fuselage-hooks';
 import { useEndpoint, useRouter, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts';
 import React from 'react';
 import { useForm, Controller } from 'react-hook-form';
@@ -96,9 +96,10 @@ const EditRoom = ({ room, onChange, onDelete }: EditRoomProps) => {
 
 	const handleArchive = useArchiveRoom(room);
 
-	const handleUpdateRoomData = useMutableCallback(async ({ isDefault, roomName, favorite, ...formData }) => {
+	const handleUpdateRoomData = useEffectEvent(async ({ isDefault, roomName, favorite, ...formData }) => {
 		const data = getDirtyFields(formData, dirtyFields);
 		delete data.archived;
+		delete data.favorite;
 
 		try {
 			await saveAction({
@@ -117,9 +118,9 @@ const EditRoom = ({ room, onChange, onDelete }: EditRoomProps) => {
 		}
 	});
 
-	const handleSave = useMutableCallback(async (data) => {
-		await Promise.all([isDirty && handleUpdateRoomData(data), changeArchiving && handleArchive()].filter(Boolean));
-	});
+	const handleSave = useEffectEvent((data) =>
+		Promise.all([isDirty && handleUpdateRoomData(data), changeArchiving && handleArchive()].filter(Boolean)),
+	);
 
 	const formId = useUniqueId();
 	const roomNameField = useUniqueId();

diff --git a/apps/meteor/client/views/room/contextualBar/Info/EditRoomInfo/EditRoomInfo.tsx b/apps/meteor/client/views/room/contextualBar/Info/EditRoomInfo/EditRoomInfo.tsx
@@ -20,7 +20,7 @@ import {
 	Box,
 	TextAreaInput,
 } from '@rocket.chat/fuselage';
-import { useMutableCallback, useUniqueId } from '@rocket.chat/fuselage-hooks';
+import { useEffectEvent, useUniqueId } from '@rocket.chat/fuselage-hooks';
 import type { TranslationKey } from '@rocket.chat/ui-contexts';
 import { useSetting, useTranslation, useToastMessageDispatch, useEndpoint } from '@rocket.chat/ui-contexts';
 import React, { useMemo } from 'react';
@@ -98,7 +98,7 @@ const EditRoomInfo = ({ room, onClickClose, onClickBack }: EditRoomInfoProps) =>
 
 	const handleArchive = useArchiveRoom(room);
 
-	const handleUpdateRoomData = useMutableCallback(async ({ hideSysMes, joinCodeRequired, ...formData }) => {
+	const handleUpdateRoomData = useEffectEvent(async ({ hideSysMes, joinCodeRequired, ...formData }) => {
 		const data = getDirtyFields(formData, dirtyFields);
 		delete data.archived;
 
@@ -119,9 +119,9 @@ const EditRoomInfo = ({ room, onClickClose, onClickBack }: EditRoomInfoProps) =>
 		}
 	});
 
-	const handleSave = useMutableCallback(async (data) => {
-		await Promise.all([isDirty && handleUpdateRoomData(data), changeArchiving && handleArchive()].filter(Boolean));
-	});
+	const handleSave = useEffectEvent((data) =>
+		Promise.all([isDirty && handleUpdateRoomData(data), changeArchiving && handleArchive()].filter(Boolean)),
+	);
 
 	const formId = useUniqueId();
 	const roomNameField = useUniqueId();

diff --git a/apps/meteor/tests/e2e/administration.spec.ts b/apps/meteor/tests/e2e/administration.spec.ts
@@ -87,6 +87,28 @@ test.describe.parallel('administration', () => {
 			await poAdmin.getRoomRow(targetChannel).click();
 			await expect(poAdmin.archivedInput).toBeChecked();
 		});
+
+		test.describe.serial('Default rooms', () => {
+			test('expect target channell to be default', async () => {
+				await poAdmin.inputSearchRooms.type(targetChannel);
+				await poAdmin.getRoomRow(targetChannel).click();
+				await poAdmin.defaultLabel.click();
+				await poAdmin.btnSave.click();
+
+				await poAdmin.getRoomRow(targetChannel).click();
+				await expect(poAdmin.defaultInput).toBeChecked();
+			});
+
+			test('should mark target default channel as "favorite by default"', async () => {
+				await poAdmin.inputSearchRooms.type(targetChannel);
+				await poAdmin.getRoomRow(targetChannel).click();
+				await poAdmin.favoriteLabel.click();
+				await poAdmin.btnSave.click();
+
+				await poAdmin.getRoomRow(targetChannel).click();
+				await expect(poAdmin.favoriteInput).toBeChecked();
+			});
+		});
 	});
 
 	test.describe('Permissions', () => {

diff --git a/apps/meteor/tests/e2e/page-objects/admin.ts b/apps/meteor/tests/e2e/page-objects/admin.ts
@@ -36,6 +36,22 @@ export class Admin {
 		return this.page.locator('input[name="archived"]');
 	}
 
+	get favoriteLabel(): Locator {
+		return this.page.locator('label >> text=Favorite');
+	}
+
+	get favoriteInput(): Locator {
+		return this.page.locator('input[name="favorite"]');
+	}
+
+	get defaultLabel(): Locator {
+		return this.page.locator('label >> text=Default');
+	}
+
+	get defaultInput(): Locator {
+		return this.page.locator('input[name="isDefault"]');
+	}
+
 	get inputSearchUsers(): Locator {
 		return this.page.locator('input[placeholder="Search Users"]');
 	}