Project

General

Profile

Actions

Bug #18972

closed

"All processes" view reloading flicker

Added by Peter Amstutz 3 months ago. Updated about 1 month ago.

Status:
Resolved
Priority:
Normal
Assigned To:
Category:
Workbench2
Target version:
Start date:
04/08/2022
Due date:
% Done:

100%

Estimated time:
(Total: 0.00 h)
Story points:
-
Release relationship:
Auto

Description

When processes are being updated, it triggers an automatic refresh of the "all processes" view. Unfortunately because it clears the content when it starts a reload, it is rapidly flickering back and forth between the content and "Loading data please wait" which makes it almost unusable.

"All processes" should not show "loading data please wait" when auto-refresh is triggered, it should just replace the contents.


Files

Flickering fix.mov (9.78 MB) Flickering fix.mov Lucas Di Pentima, 04/08/2022 08:01 PM

Subtasks 1 (0 open1 closed)

Task #18982: Review 18972-all-procs-flickering-fixResolvedPeter Amstutz04/08/2022

Actions

Related issues

Related to Arvados - Bug #18207: Workbench2 is not clearing the project content when switchingResolvedDaniel KutyƂa11/04/2021

Actions
Actions #1

Updated by Peter Amstutz 3 months ago

  • Description updated (diff)
Actions #2

Updated by Lucas Di Pentima 3 months ago

  • Related to Bug #18207: Workbench2 is not clearing the project content when switching added
Actions #3

Updated by Lucas Di Pentima 3 months ago

  • Target version changed from 2022-04-27 Sprint to 2022-04-13 Sprint
  • Assigned To set to Lucas Di Pentima
  • Status changed from New to In Progress
Actions #4

Updated by Lucas Di Pentima 3 months ago

Updates at arvados-workbench2|20acf4ed - branch 18972-all-procs-flickering-fix

  • Avoids the DataTable component to show a "loading" indication when the route didn't change. Attached video for easier confirmation.
  • The loading indication should be still visible when navigating through a project hierarchy, for example.
Actions #5

Updated by Peter Amstutz 3 months ago

Lucas Di Pentima wrote:

Updates at arvados-workbench2|20acf4ed - branch 18972-all-procs-flickering-fix

  • Avoids the DataTable component to show a "loading" indication when the route didn't change. Attached video for easier confirmation.
  • The loading indication should be still visible when navigating through a project hierarchy, for example.

This re-introduces a previous issue where you could hit the refresh button, but then because there isn't clear feedback that the refresh has completed, you go to try and click on something in the list, but the list contents changes underneath your mouse pointer, and you click on the wrong thing.

Could we make it so that when you hit the refresh button explicitly, it still clears the data table?

Actions #6

Updated by Lucas Di Pentima 3 months ago

Peter Amstutz wrote:

This re-introduces a previous issue where you could hit the refresh button, but then because there isn't clear feedback that the refresh has completed, you go to try and click on something in the list, but the list contents changes underneath your mouse pointer, and you click on the wrong thing.
Could we make it so that when you hit the refresh button explicitly, it still clears the data table?

I didn't addressed the Refresh button case because I understood that the issue was when the user navigates through projects.

Updates at arvados-workbench2|f8033266 now make the Refresh button record its latest click timestamp on the localStorage so that any interested party could check if it changed from the last render and act upon it as necessary.

Actions #7

Updated by Peter Amstutz 3 months ago

Lucas Di Pentima wrote:

Peter Amstutz wrote:

This re-introduces a previous issue where you could hit the refresh button, but then because there isn't clear feedback that the refresh has completed, you go to try and click on something in the list, but the list contents changes underneath your mouse pointer, and you click on the wrong thing.
Could we make it so that when you hit the refresh button explicitly, it still clears the data table?

I didn't addressed the Refresh button case because I understood that the issue was when the user navigates through projects.

It actually even came up in cypress testing, there was a test that used the refresh button, then immediately tried to click on something in the list and the list contents would get replaced underneath it and cause the click to open on the wrong list item.

Updates at arvados-workbench2|f8033266 now make the Refresh button record its latest click timestamp on the localStorage so that any interested party could check if it changed from the last render and act upon it as necessary.

Using global variables in data-explorer.tsx feels a little dodgy, should this be done through redux? Looks like Danny introduced the globals in 18207.

Actions #8

Updated by Peter Amstutz 3 months ago

  • Target version changed from 2022-04-13 Sprint to 2022-04-27 Sprint
Actions #9

Updated by Lucas Di Pentima 3 months ago

Rebased updates at arvados-workbench2|9858ad74 - developer-tests-workbench2: #666

Reimplements the "loading..." indicator behavior by using local state at the DataExplorer component. External dependencies (on Router & RefreshButton) are kept in the view component and passed down as optional props.

Actions #10

Updated by Peter Amstutz 3 months ago

Lucas Di Pentima wrote:

Rebased updates at arvados-workbench2|9858ad74 - developer-tests-workbench2: #666

Reimplements the "loading..." indicator behavior by using local state at the DataExplorer component. External dependencies (on Router & RefreshButton) are kept in the view component and passed down as optional props.

I agree, keeping it as part of the data table state is much cleaner.

This LGTM!

Actions #11

Updated by Lucas Di Pentima 3 months ago

  • Status changed from In Progress to Resolved
Actions #12

Updated by Peter Amstutz about 1 month ago

  • Release set to 51
Actions

Also available in: Atom PDF