From 105a1ebd19128954bbe22c2316deb276fd4f9934 Mon Sep 17 00:00:00 2001
From: gabriellsh <40830821+gabriellsh@users.noreply.github.com>
Date: Wed, 24 Apr 2024 16:40:59 -0300
Subject: [PATCH] fix: Engagement Dashboard and Device Management admin pages
 loading indefinitely (#32284)

---
 .changeset/yellow-lies-judge.md               |  5 +++
 .../DeviceManagementAdminRoute.tsx            |  3 +-
 .../EngagementDashboardRoute.tsx              |  3 +-
 apps/meteor/tests/e2e/administration.spec.ts  | 32 +++++++++++++++++++
 4 files changed, 41 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/yellow-lies-judge.md

diff --git a/.changeset/yellow-lies-judge.md b/.changeset/yellow-lies-judge.md
new file mode 100644
index 000000000000..15bc8e0819bd
--- /dev/null
+++ b/.changeset/yellow-lies-judge.md
@@ -0,0 +1,5 @@
+---
+"@rocket.chat/meteor": patch
+---
+
+fixed Engagement Dashboard and Device Management admin pages loading indefinitely
diff --git a/apps/meteor/ee/client/views/admin/deviceManagement/DeviceManagementAdminRoute.tsx b/apps/meteor/ee/client/views/admin/deviceManagement/DeviceManagementAdminRoute.tsx
index 83e3b4eac72c..c250728988ec 100644
--- a/apps/meteor/ee/client/views/admin/deviceManagement/DeviceManagementAdminRoute.tsx
+++ b/apps/meteor/ee/client/views/admin/deviceManagement/DeviceManagementAdminRoute.tsx
@@ -14,7 +14,7 @@ const DeviceManagementAdminRoute = (): ReactElement => {
 	const t = useTranslation();
 	const router = useRouter();
 	const setModal = useSetModal();
-	const isModalOpen = useCurrentModal() !== null;
+	const isModalOpen = !!useCurrentModal();
 
 	const hasDeviceManagement = useHasLicenseModule('device-management') as boolean;
 	const canViewDeviceManagement = usePermission('view-device-management');
@@ -25,6 +25,7 @@ const DeviceManagementAdminRoute = (): ReactElement => {
 		if (shouldShowUpsell) {
 			setModal(
 				<GenericUpsellModal
+					aria-label={t('Device_Management')}
 					title={t('Device_Management')}
 					img={getURL('images/device-management.png')}
 					subtitle={t('Ensure_secure_workspace_access')}
diff --git a/apps/meteor/ee/client/views/admin/engagementDashboard/EngagementDashboardRoute.tsx b/apps/meteor/ee/client/views/admin/engagementDashboard/EngagementDashboardRoute.tsx
index 78a1f1886c41..fd42d428824d 100644
--- a/apps/meteor/ee/client/views/admin/engagementDashboard/EngagementDashboardRoute.tsx
+++ b/apps/meteor/ee/client/views/admin/engagementDashboard/EngagementDashboardRoute.tsx
@@ -25,7 +25,7 @@ const EngagementDashboardRoute = (): ReactElement | null => {
 	const t = useTranslation();
 	const canViewEngagementDashboard = usePermission('view-engagement-dashboard');
 	const setModal = useSetModal();
-	const isModalOpen = useCurrentModal() !== null;
+	const isModalOpen = !!useCurrentModal();
 
 	const router = useRouter();
 	const tab = useRouteParameter('tab');
@@ -39,6 +39,7 @@ const EngagementDashboardRoute = (): ReactElement | null => {
 		if (shouldShowUpsell) {
 			setModal(
 				<GenericUpsellModal
+					aria-label={t('Engagement_Dashboard')}
 					title={t('Engagement_Dashboard')}
 					img={getURL('images/engagement.png')}
 					subtitle={t('Analyze_practical_usage')}
diff --git a/apps/meteor/tests/e2e/administration.spec.ts b/apps/meteor/tests/e2e/administration.spec.ts
index f46ae77d5ce4..fb9dc655b4c9 100644
--- a/apps/meteor/tests/e2e/administration.spec.ts
+++ b/apps/meteor/tests/e2e/administration.spec.ts
@@ -29,6 +29,38 @@ test.describe.parallel('administration', () => {
 		});
 	});
 
+	test.describe('Engagement dashboard', () => {
+		test('Should show upsell modal', async ({ page }) => {
+			test.skip(IS_EE);
+			await page.goto('/admin/engagement/users');
+
+			await expect(page.locator('role=dialog[name="Engagement dashboard"]')).toBeVisible();
+		});
+
+		test('Should show engagement dashboard', async ({ page }) => {
+			test.skip(!IS_EE);
+			await page.goto('/admin/engagement/users');
+
+			await expect(page.locator('h1 >> text="Engagement"')).toBeVisible();
+		});
+	});
+
+	test.describe('Device management', () => {
+		test('Should show upsell modal', async ({ page }) => {
+			test.skip(IS_EE);
+			await page.goto('/admin/device-management');
+
+			await expect(page.locator('role=dialog[name="Device management"]')).toBeVisible();
+		});
+
+		test('Should show device management page', async ({ page }) => {
+			test.skip(!IS_EE);
+			await page.goto('/admin/device-management');
+
+			await expect(page.locator('h1 >> text="Device management"')).toBeVisible();
+		});
+	});
+
 	test.describe('Users', () => {
 		test.beforeEach(async ({ page }) => {
 			await page.goto('/admin/users');