From fbe52346fb34283a2a66257085c55ac9eedbfafc Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:31:36 +0200 Subject: [PATCH 1/9] wc Update fetch jobs method in job-monitor #TASK-7039 --- src/webcomponents/job/job-monitor.js | 53 ++++++++++++++++------------ 1 file changed, 31 insertions(+), 22 deletions(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 54a247f48..3c522ec9a 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -59,8 +59,9 @@ export class JobMonitor extends LitElement { }, }; this._interval = -1; - this._jobs = []; - this._addedJobs= new Set(); // Used for displaying the NEW label in each new job + this._jobs = null; + this._latestJobs = []; // To store the latest updated jobs + this._updatedJobs= new Set(); // Used for displaying the NEW label in each new job this._updatedJobsCount = 0; // To store the number of changes (new jobs, state changes) this._visibleJobsType = "ALL"; // Current visible jobs types (one of JOB_TYPES) this._config = this.getDefaultConfig(); @@ -74,9 +75,9 @@ export class JobMonitor extends LitElement { update(changedProperties) { if (changedProperties.has("opencgaSession")) { - this._jobs = []; - this._updatedJobsCount = 0; - this._addedJobs = new Set(); + this._jobs = null; + this._latestJobs = []; + this._updatedJobs = new Set(); this._visibleJobsType = "ALL"; } if (changedProperties.has("config")) { @@ -111,22 +112,28 @@ export class JobMonitor extends LitElement { } fetchLastJobs() { - this.opencgaSession.opencgaClient.jobs() - .search({ - study: this.opencgaSession.study.fqn, - internalStatus: "PENDING,QUEUED,RUNNING,DONE,ERROR,ABORTED", - limit: this._config.limit || 10, - sort: "creationDate", - include: "id,internal.status,tool,creationDate", - order: -1, - }) - .then(response => { - const newJobsList = response?.responses?.[0]?.results || []; + // generate the list of job types to fetch. Note that if the visible jobs type is "ALL", + // we will prevent requesting for the same job types multiple times + const jobsTypesToFetch = Array.from(new Set(["ALL", this._visibleJobsType])); + const jobsPromises = jobsTypesToFetch.map(jobType => { + return this.opencgaSession.opencgaClient.jobs() + .search({ + study: this.opencgaSession.study.fqn, + internalStatus: this.JOBS_TYPES[jobType].jobsTypes.join(","), + limit: this._config.limit || 10, + sort: "creationDate", + include: "id,internal.status,tool,creationDate", + order: -1, + }); + }); + Promise.all(jobsPromises) + .then(responses => { + const newJobsList = responses[0]?.responses?.[0]?.results || []; // 1. Process the list of new jobs returned by OpenCGA // Note: we check if the previous list of jobs is not empty, to prevent marking all jobs as new jobs - if (this._jobs.length > 0) { + if (this._latestJobs?.length > 0) { newJobsList.forEach(job => { - const oldJob = this._jobs.find(j => j.id === job.id); + const oldJob = this._latestJobs.find(j => j.id === job.id); if (oldJob) { const statusId = job?.internal?.status?.id || "-"; const oldStatusId = oldJob?.internal?.status?.id || "-"; @@ -135,20 +142,20 @@ export class JobMonitor extends LitElement { NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_INFO, { message: `The job ${job?.id} has now status ${statusId}.`, }); - this._updatedJobsCount = this._updatedJobsCount + 1; } } else { // This is a new job, so we display an info notification to the user NotificationUtils.dispatch(this, NotificationUtils.NOTIFY_INFO, { message: `The job ${job?.id} has been added.`, }); - this._updatedJobsCount = this._updatedJobsCount + 1; - this._addedJobs.add(job.id); + this._updatedJobs.add(job.id); } }); } // 2. Save the new jobs list - this._jobs = newJobsList; + this._latestJobs = newJobsList; + // 3. save the visible jobs list + this._jobs = responses[1]?.responses?.[0]?.results || newJobsList; this.requestUpdate(); }) .catch(response => { @@ -167,7 +174,9 @@ export class JobMonitor extends LitElement { onJobTypeChange(event, newJobType) { event.stopPropagation(); + this._jobs = null; this._visibleJobsType = newJobType; + this.fetchLastJobs(); this.requestUpdate(); } From 77da4165a22c4945ad99df01454227e5305fbf68 Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:32:43 +0200 Subject: [PATCH 2/9] wc: Fix displaying jobs in selected category #TASK-7039 --- src/webcomponents/job/job-monitor.js | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 3c522ec9a..3d725d205 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -189,12 +189,9 @@ export class JobMonitor extends LitElement { } renderVisibleJobsList() { - // Get the list of visible jobs with the selected type - const visibleJobs = this._jobs.filter(job => { - return this._visibleJobsType === "ALL" || this.JOBS_TYPES[this._visibleJobsType].jobsTypes.includes(job?.internal?.status?.id); - }); - if (visibleJobs.length > 0) { - return visibleJobs.map(job => html` + // Display jobs list + if (this._jobs && this._jobs.length > 0) { + return this._jobs.map(job => html`
  • From bd58ba3a5c4d498dc83a6c8fc01d8efcde95d270 Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:33:30 +0200 Subject: [PATCH 3/9] wc: Fix displaying number of updated jobs #TASK-7039 --- src/webcomponents/job/job-monitor.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 3d725d205..763d5acf8 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -237,9 +237,9 @@ export class JobMonitor extends LitElement {
    - ${this._updatedJobsCount > 0 ? html` + ${this._updatedJobs.size > 0 ? html` - ${this._updatedJobsCount} + ${this._updatedJobs.size} ` : nothing}     From a2b6b05cf2fa00f827ea83de0e6be83ad0c483ad Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:34:10 +0200 Subject: [PATCH 4/9] wc: Change jobs types for the category ALL in job-monitor #TASK-7039 --- src/webcomponents/job/job-monitor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 763d5acf8..6bb3544a2 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -47,7 +47,7 @@ export class JobMonitor extends LitElement { this.JOBS_TYPES = { ALL: { title: "All", - jobsTypes: [], + jobsTypes: ["PENDING", "QUEUED", "RUNNING", "DONE", "ERROR", "ABORTED"], }, RUNNING: { title: "Running", From 013d8176618783c44c4e31094c0d334875a862e2 Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:35:30 +0200 Subject: [PATCH 5/9] wc: Display a loading spinner when fetching jobs of selected category #TASK-7039 --- src/webcomponents/job/job-monitor.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 6bb3544a2..0ebf014f7 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -218,6 +218,15 @@ export class JobMonitor extends LitElement {
    • `); + } else if (this._jobs && this._jobs.length === 0) { + return html` +
  • +
    + +
    No jobs on this category
    +
    +
    • + `; } else { return html`
  • From e6ad65e9e665e1b3e65a7c1a1cfbf2a4ec8a6fcf Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:36:41 +0200 Subject: [PATCH 6/9] wc: Fix displaying loading spinner in job monitor #TASK-7039 --- src/webcomponents/job/job-monitor.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 0ebf014f7..709cb339d 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -230,8 +230,9 @@ export class JobMonitor extends LitElement { } else { return html`
  • -
    - No jobs on this category. +
    + +
    Loading jobs...
    • `; From 2c614f7606c44b36b5f511593584a4868d5d784a Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:37:28 +0200 Subject: [PATCH 7/9] wc: Rename All category to Latest in job-monitor #TASK-7039 --- src/webcomponents/job/job-monitor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 709cb339d..383c3a3d8 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -46,7 +46,7 @@ export class JobMonitor extends LitElement { #init() { this.JOBS_TYPES = { ALL: { - title: "All", + title: "Latest", jobsTypes: ["PENDING", "QUEUED", "RUNNING", "DONE", "ERROR", "ABORTED"], }, RUNNING: { From 5c69fac8ef1658542c7b3dc03a99bafd6ca21300 Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:38:02 +0200 Subject: [PATCH 8/9] wc: Remove unused variable used to save the updated jobs count #TASK-7039 --- src/webcomponents/job/job-monitor.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 383c3a3d8..733248ec3 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -62,7 +62,6 @@ export class JobMonitor extends LitElement { this._jobs = null; this._latestJobs = []; // To store the latest updated jobs this._updatedJobs= new Set(); // Used for displaying the NEW label in each new job - this._updatedJobsCount = 0; // To store the number of changes (new jobs, state changes) this._visibleJobsType = "ALL"; // Current visible jobs types (one of JOB_TYPES) this._config = this.getDefaultConfig(); } From 98b8ac8801690b4c9a23f1379135d07143606a35 Mon Sep 17 00:00:00 2001 From: Josemi Date: Tue, 15 Oct 2024 18:40:16 +0200 Subject: [PATCH 9/9] wc: Minor final fixes in job-monitor #TASK-7039 --- src/webcomponents/job/job-monitor.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/webcomponents/job/job-monitor.js b/src/webcomponents/job/job-monitor.js index 733248ec3..0cfcf0f58 100644 --- a/src/webcomponents/job/job-monitor.js +++ b/src/webcomponents/job/job-monitor.js @@ -168,7 +168,9 @@ export class JobMonitor extends LitElement { onRefresh(event) { event.stopPropagation(); + this._jobs = null; this.fetchLastJobs(); + this.requestUpdate(); } onJobTypeChange(event, newJobType) { @@ -198,7 +200,7 @@ export class JobMonitor extends LitElement {
    - ${this._addedJobs.has(job?.id) ? html` + ${this._updatedJobs.has(job?.id) ? html` NEW ` : nothing}