Merge pull request #835 from fractal-analytics-platform/task-activities-all

Displayed all kinds of recent task activities in tasks management page

Author: zonia3000

CHANGELOG.md

@@ -1,5 +1,9 @@
 *Note: Numbers like (\#123) point to closed Pull Requests on the fractal-web repository.*
 
+# Unreleased
+
+* Displayed all kinds of recent task activities in tasks management page. (\#835);
+
 # 1.20.0
 
 * Added body request normalizer (\#825);

src/lib/components/v2/tasks/TaskCollectionTable.svelte renamed to src/lib/components/v2/tasks/TaskActivitiesTable.svelte

@@ -7,7 +7,7 @@
 	import TaskGroupActivityLogsModal from '$lib/components/v2/tasks/TaskGroupActivityLogsModal.svelte';
 	import { recentActivities } from '$lib/stores';
 
-	// This component automatically fecthes updates for task collections activities
+	// This component automatically fecthes updates for task recent activities
 	// in pending and ongoing status
 
 	/**
@@ -23,60 +23,60 @@
 	);
 
 	/** @type {number|null} */
-	let openedTaskCollectionLogId = null;
+	let openedTaskActivityLogId = null;
 
 	/** @type {TaskGroupActivityLogsModal|undefined} */
 	let taskGroupActivitiesLogsModal = $state();
 
 	/**
 	 * @param {import('fractal-components/types/api').TaskGroupActivityV2[]} activitiesToUpdate
 	 */
-	async function updateTaskCollectionsState(activitiesToUpdate) {
+	async function updateTaskActivitiesState(activitiesToUpdate) {
 		recentActivities.set(
 			$recentActivities.map((a) => {
 				const updatedActivity = activitiesToUpdate.find((u) => u.id === a.id);
 				return updatedActivity ?? a;
 			})
 		);
-		const openedTaskCollectionLogToUpdate = activitiesToUpdate.find(
-			(u) => u.id === openedTaskCollectionLogId
+		const openedTaskActivityLogToUpdate = activitiesToUpdate.find(
+			(u) => u.id === openedTaskActivityLogId
 		)?.log;
-		if (openedTaskCollectionLogToUpdate) {
-			await taskGroupActivitiesLogsModal?.updateLog(openedTaskCollectionLogToUpdate);
+		if (openedTaskActivityLogToUpdate) {
+			await taskGroupActivitiesLogsModal?.updateLog(openedTaskActivityLogToUpdate);
 		}
 	}
 
 	/**
 	 * @param {number} taskGroupActivityId
 	 */
 	async function openTaskGroupActivityLogsModal(taskGroupActivityId) {
-		openedTaskCollectionLogId = taskGroupActivityId;
+		openedTaskActivityLogId = taskGroupActivityId;
 		await taskGroupActivitiesLogsModal?.open(taskGroupActivityId);
 	}
 
-	async function updateTasksCollectionInBackground() {
+	async function updateTasksActivitiesInBackground() {
 		const activitiesToUpdate = await getTaskGroupActivitiesToUpdate($recentActivities, false);
 		if (activitiesToUpdate.length > 0) {
-			await updateTaskCollectionsState(activitiesToUpdate);
+			await updateTaskActivitiesState(activitiesToUpdate);
 			const newOkTasks = $recentActivities.filter(
 				(a) => activitiesToUpdate.map((u) => u.id).includes(a.id) && a.status === 'OK'
 			).length;
 			if (newOkTasks > 0) {
 				await reloadTaskGroupsList();
 			}
 		}
-		clearTimeout(updateTasksCollectionTimeout);
-		updateTasksCollectionTimeout = setTimeout(
-			updateTasksCollectionInBackground,
-			updateTasksCollectionInterval
+		clearTimeout(updateTasksActivitiesTimeout);
+		updateTasksActivitiesTimeout = setTimeout(
+			updateTasksActivitiesInBackground,
+			updateTasksActivitiesInterval
 		);
 	}
 
-	async function loadRecentTaskCollections() {
+	async function loadRecentTaskActivities() {
 		const date = new Date();
 		date.setTime(date.getTime() - 24 * 3600 * 1000); // yesterday
 		const response = await fetch(
-			`/api/v2/task-group/activity?timestamp_started_min=${date.toISOString()}&action=collect`,
+			`/api/v2/task-group/activity?timestamp_started_min=${date.toISOString()}`,
 			{
 				method: 'GET',
 				credentials: 'include'
@@ -86,25 +86,25 @@
 		if (response.ok) {
 			return result;
 		}
-		console.error('Unable to load recent task collections', result);
+		console.error('Unable to load recent task activities', result);
 		return [];
 	}
 
-	const updateTasksCollectionInterval = env.PUBLIC_UPDATE_JOBS_INTERVAL
+	const updateTasksActivitiesInterval = env.PUBLIC_UPDATE_JOBS_INTERVAL
 		? parseInt(env.PUBLIC_UPDATE_JOBS_INTERVAL)
 		: 3000;
-	let updateTasksCollectionTimeout = undefined;
+	let updateTasksActivitiesTimeout = undefined;
 
 	onMount(async () => {
-		recentActivities.set(await loadRecentTaskCollections());
-		updateTasksCollectionTimeout = setTimeout(
-			updateTasksCollectionInBackground,
-			updateTasksCollectionInterval
+		recentActivities.set(await loadRecentTaskActivities());
+		updateTasksActivitiesTimeout = setTimeout(
+			updateTasksActivitiesInBackground,
+			updateTasksActivitiesInterval
 		);
 	});
 
 	onDestroy(() => {
-		clearTimeout(updateTasksCollectionTimeout);
+		clearTimeout(updateTasksActivitiesTimeout);
 	});
 </script>
 
@@ -114,7 +114,7 @@
 		Show all activities
 	</a>
 {/if}
-<h4 class="fw-light mt-3">Task collections</h4>
+<h4 class="fw-light mt-3">Recent task activities</h4>
 {#if $recentActivities.length === 0}
 	<p class="mb-5">
 		No recent activities

src/routes/v2/tasks/management/+page.svelte

@@ -6,7 +6,7 @@
 	import CustomEnvTask from '$lib/components/v2/tasks/CustomEnvTask.svelte';
 	import TaskGroupsTable from '$lib/components/v2/tasks/TaskGroupsTable.svelte';
 	import PixiTask from '$lib/components/v2/tasks/PixiTask.svelte';
-	import TaskCollectionTable from '$lib/components/v2/tasks/TaskCollectionTable.svelte';
+	import TaskActivitiesTable from '$lib/components/v2/tasks/TaskActivitiesTable.svelte';
 
 	const user = $derived(page.data.user);
 
@@ -114,9 +114,7 @@
 		{/if}
 	</div>
 
-	{#if packageType === 'pypi' || packageType === 'local' || packageType === 'pixi'}
-		<TaskCollectionTable {reloadTaskGroupsList} />
-	{/if}
+	<TaskActivitiesTable {reloadTaskGroupsList} />
 
 	<div class="row mt-4">
 		<h3 class="fw-light">Task List</h3>

tests/v2/collect_mock_tasks.setup.js

@@ -48,15 +48,15 @@ test('Collect mock tasks [v2]', async ({ page, request }) => {
 
 		await page.getByRole('button', { name: 'Collect', exact: true }).click();
 
-		// Wait for Task collections table
+		// Wait for Task activities table
 		await page.waitForFunction(
 			(expectedCount) => document.querySelectorAll('table').length === expectedCount,
 			2
 		);
 		await expect(page.getByRole('row', { name: /pending|ongoing/ })).toBeVisible();
 	});
 
-	await test.step('Wait tasks collection', async () => {
+	await test.step('Wait tasks activities', async () => {
 		await expect(page.getByRole('row', { name: /pending|ongoing/ })).not.toBeVisible({
 			timeout: 30000
 		});

tests/v2/pixi.setup.js

@@ -58,15 +58,15 @@ test('Pixi task collection', async ({ page, request }) => {
 
 		await page.getByRole('button', { name: 'Collect', exact: true }).click();
 
-		// Wait for Task collections table
+		// Wait for Task activities table
 		await page.waitForFunction(
 			(expectedCount) => document.querySelectorAll('table').length === expectedCount,
 			2
 		);
 		await expect(page.getByRole('row', { name: /pending|ongoing/ })).toBeVisible();
 	});
 
-	await test.step('Wait tasks collection', async () => {
+	await test.step('Wait tasks activities', async () => {
 		await expect(page.getByRole('row', { name: /pending|ongoing/ })).not.toBeVisible({
 			timeout: 30000
 		});