giorgio/read.markets
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

portfolio-edit: fix rogue Edit/Done/Add visibility

Browse source 
Two interlocking bugs surfaced after the design pass:

1. CSS `display: inline-flex` on .pf-edit-btn/.pf-done-btn overrode the
   UA's `[hidden] { display: none }`, so the JS toggling `editBtn.hidden`
   had no visual effect — both buttons rendered side by side.
2. portfolio.js's empty-state path sets `form.hidden = false` but the
   populated-portfolio render path only removed the `pf-empty` class; it
   never reset `form.hidden = true`. So once a user went through the
   empty state, the add form stuck around — leaving the Add button
   visible on a populated dashboard.

Fixes are surgical: add an explicit `[hidden]` rule for the two
header pills, and re-hide the form in `renderPanel` unless edit mode
is currently active (so we don't yank the form out from under an
edit-in-progress).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Giorgio Gilestro 2026-05-27 15:09:34 +02:00
parent bb41ee38f7
commit 3de43f55a6
2 changed files with 10 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

7
app/static/js/portfolio.js
View file

@ -272,6 +272,13 @@
function renderPanel(mount, pie, enriched, agg) {
var panel = document.getElementById('portfolio-panel');
if (panel) panel.classList.remove('pf-empty');
// The empty-state path forces the add form visible. When we move
// back to a populated view we re-hide it — unless edit mode is on,
// in which case the form stays visible for ongoing edits.
var form = document.getElementById('pf-add-form');
if (form && panel && !panel.classList.contains('pf-editing')) {
form.hidden = true;
}
const ccyPills = Object.keys(agg.by_currency)
.sort((a, b) => agg.by_currency[b] - agg.by_currency[a])