Skip to content

fix: avoid manager flicker during instance polling#14

Open
TBDevMaster wants to merge 2 commits intoEvolutionAPI:mainfrom
TBDevMaster:ui-flicker-fix
Open

fix: avoid manager flicker during instance polling#14
TBDevMaster wants to merge 2 commits intoEvolutionAPI:mainfrom
TBDevMaster:ui-flicker-fix

Conversation

@TBDevMaster
Copy link
Copy Markdown

Summary

This fixes the manager UI flicker reported when the instances page refreshes every 5 seconds.

The issue happens because the instances polling path sets isLoading: true on every fetchInstances() call. The manager page uses that flag to swap the whole list for skeleton cards, so each polling cycle causes a visible full-page flash.

What changed

  • added a hasLoaded flag to the instances store
  • keep the skeleton/loading state only for the first load
  • allow subsequent polling refreshes to update data in the background without replacing the whole page UI

Why this fixes the flicker

Before:

  • initial load -> isLoading = true
  • each 5s polling refresh -> isLoading = true again
  • instances page re-renders skeletons every cycle

After:

  • initial load -> isLoading = true
  • after first successful load -> hasLoaded = true
  • polling refreshes no longer set full-page loading
  • list updates in place without visible flashing

Notes

This repository currently includes the built manager bundle, so the change is applied in manager/dist/assets/index-LD46dRLh.js.

Closes #11.

Copy link
Copy Markdown

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry @TBDevMaster, your pull request is larger than the review limit of 150000 diff characters

@TBDevMaster
Copy link
Copy Markdown
Author

Sourcery skipped this PR because the repository stores the manager as a built/minified bundle, so a very small functional change in manager/dist/assets/index-LD46dRLh.js appears as a very large diff to automated reviewers.

The actual logic change is small:

Before:

  • fetchInstances() set isLoading = true on every polling refresh

After:

  • added hasLoaded
  • full-page loading is only shown on the first load
  • subsequent 5s polling refreshes update data without replacing the list with skeletons

In other words, the functional change is:

// before
t({ isLoading: true, error: null })

// after
t((state) => ({ isLoading: !state.hasLoaded, error: null }))and successful/failed fetches now also set:

hasLoaded: true
This fixes the flicker reported in #11 while keeping the initial loading state intact.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] Interface (UI) fica piscando a cada 5 segundos, coincidindo com o polling do endpoint /instance/all

1 participant