Skip to content
Snippets Groups Projects

show loading indicator while waiting for assignees first fetch

Merged Simon Knox requested to merge 32170-assignees-spinner into master
All threads resolved!

What does this MR do?

Fixes:

  • Assignees section tiny and empty when first loaded
  • "Assign to me" shown before Assignee loaded

Are there points in the code the reviewer needs to double check?

  • is there a preferred way to flag the initial "don't display yet" state? isFetching could be more accurately called isInitialized
  • should Time Tracking be updated to do this as well?

Screenshots (if relevant)

ssr

Does this MR meet the acceptance criteria?

What are the relevant issue numbers?

Closes #32170

Edited by Simon Knox

Merge request reports

Loading
Loading

Activity

Filter activity
  • Approvals
  • Assignees & reviewers
  • Comments (from bots)
  • Comments (from users)
  • Commits & branches
  • Edits
  • Labels
  • Lock status
  • Mentions
  • Merge request status
  • Tracking
    • Do we want to fully render the current Assignee if set? more useful than spinner but means duplicate markup

    I think we don't want to have duplicate markup, so I don't think we want to do that even though it would prevent the data to the user faster.

    • May need tests. Wasn't sure where/what should be tested. Either testing a setter, or that a setter has been called. Can add an expect to an existing spec but seemed over-the-top adding a new test to assert loader is visible

    Could probably create an integrated test using jasmine and karma. Have the test run on the generated fixtures and then make sure that the loading indicator is displayed before the api data is returned

    • do we want semi-server-render like this? I am trying to minimize content jumping around after DOMContentLoaded

    Addressed in comment above

    • image spinner jumps after vue component is mounted. I don't know what to do about this short of actual server rendering, or fading between the two elements

    Not sure what you mean by this. Could you elaborate?

  • Code seems fine but I'll defer to @filipa since it's vue related

  • Simon Knox added 1 commit

    added 1 commit

    • 435d64af - show loading indicator while waiting for assignees first fetch

    Compare with previous version

  • Author Maintainer

    @ClemMakesApps I updated to be more CSS dependent. Has min height but not server-rendered spinner

    updated description

    if this method is better, should I update time tracking as well?

    Edited by Simon Knox
  • Author Maintainer

    @ClemMakesApps

    Not sure what you mean by this. Could you elaborate?

    When I had the duplicate <i> tag in haml, the animation position changed when vue replaced the markup, shown here:

    spin

    Not an issue anymore since removing the spinner icon from haml

    Edited by Simon Knox
  • added regression label

  • Author Maintainer

    @filipa can you please let me know if this is an ok way to handle initial render, or if there's one you prefer

  • assigned to @filipa

  • Simon Knox changed the description

    changed the description

  • Thank you @psimyn!

    @iamphill can you take over this one since you did something similar in issue title and description?

  • Is it not better if we follow the same way that time tracking does this? :thinking: An empty box just popping in looks a bit weird to me :confused:

  • assigned to @psimyn

  • I am going to agree with @iamphill, let's go ahead and add a placeholder element in the haml so that it is there until vue takes over. That's what we are doing for time tracking

  • Simon Knox added 1 commit

    added 1 commit

    • 018b12a0 - add loading spinner to sidebar assignees

    Compare with previous version

  • Simon Knox changed the description

    changed the description

  • Author Maintainer

    thanks @iamphill and @ClemMakesApps! much simpler this way as well :laughing:

  • assigned to @iamphill

  • Change looks good to me

    @ClemMakesApps can you approve & merge?

  • Author Maintainer

    @ClemMakesApps I forgot to reassign to you :anguished:

    added and removed aria-hidden as needed

  • Simon Knox added 378 commits

    added 378 commits

    • 8c74e7c4...e07c7551 - 377 commits from branch master
    • 170052c5 - add loading spinner to sidebar assignees

    Compare with previous version

  • Simon Knox added 1 commit

    added 1 commit

    • 6b8fac9d - add loading spinner to sidebar assignees

    Compare with previous version

  • Simon Knox added 1 commit

    added 1 commit

    • 6b8fac9d - add loading spinner to sidebar assignees

    Compare with previous version

  • Simon Knox resolved all discussions

    resolved all discussions

  • Simon Knox changed the description

    changed the description

  • I think the failed rspec 7 20 is from master.

    This LGTM but since it's vue code, we should let a vue expert review it too.

  • username-removed-408677 approved this merge request

    approved this merge request

  • Phil Hughes enabled an automatic merge when the pipeline for 6b8fac9d succeeds

    enabled an automatic merge when the pipeline for 6b8fac9d succeeds

  • Phil Hughes canceled the automatic merge

    canceled the automatic merge

  • merged

  • Phil Hughes mentioned in commit 30462b88

    mentioned in commit 30462b88

  • Picked into 9-2-stable, will go into 9.2.2.

  • Phil Hughes mentioned in commit 19642f61

    mentioned in commit 19642f61

  • Please register or sign in to reply
    Loading