mirror of
https://github.com/fsecada01/Pygentic-AI.git
synced 2026-05-13 12:44:59 +00:00
fix: stop container flashing and halt polling when complete
Remove double wrapping and add DOM-based polling stop condition to
prevent container flashing and endless polling.
Problems:
1. Status/results containers flash during updates
2. Polling continues forever even after results load
3. Double wrapping: home.html box + backend template section
Root Cause:
- home.html wrapped backend templates in <div class="box">
- Backend templates return complete <section> elements with styling
- No condition to stop polling after results appear
Solution:
- Remove class="box" wrapper from home.html (backend handles styling)
- Add DOM check to stop polling: [!document.querySelector('#result-container')]
- Polling stops once #result-container appears in DOM
Changes:
- Removed class="box" from status div
- Removed class="box" from results div
- Added polling stop condition to both divs
- HTMX checks DOM every second, stops when results exist
Result:
- No more flashing containers (single wrapper)
- Smooth content updates without re-rendering parent
- Polling stops automatically when analysis complete
- Better performance (no unnecessary requests)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@ -105,10 +105,9 @@
|
||||
<!-- Status Updates -->
|
||||
<div x-show="analyzing && !hasResults"
|
||||
x-transition
|
||||
class="box"
|
||||
id="status"
|
||||
hx-get={{ url_for('get_status') }}
|
||||
hx-trigger="every 1s"
|
||||
hx-trigger="every 1s[!document.querySelector('#result-container')]"
|
||||
hx-swap="innerHTML"
|
||||
@htmx:after-request="
|
||||
const response = $event.detail.xhr.response.trim();
|
||||
@ -121,10 +120,9 @@
|
||||
<!-- Results -->
|
||||
<div x-show="hasResults"
|
||||
x-transition
|
||||
class="box"
|
||||
id="result"
|
||||
hx-get={{ url_for('get_result') }}
|
||||
hx-trigger="every 1s"
|
||||
hx-trigger="every 1s[!document.querySelector('#result-container')]"
|
||||
hx-swap="innerHTML"
|
||||
@htmx:after-request="
|
||||
const response = $event.detail.xhr.response.trim();
|
||||
|
||||
Reference in New Issue
Block a user