fix: refresh bin counts after asset move

Dispatch df:bins-changed custom event from onBinDrop and
AssetContextMenu.moveToBin so the bin rail counts update
immediately after moving an asset into a bin.
This commit is contained in:
Zac Gaetano 2026-05-24 14:50:22 -04:00
parent a5ab57d144
commit f21157f3c7

View file

@ -7,21 +7,24 @@ function Library({ navigate, onOpenAsset, openProject, onClearProject }) {
// Re-fetch bins on mount + whenever the open project changes; surfaces // Re-fetch bins on mount + whenever the open project changes; surfaces
// every-project bins when the global view is on, project-scoped otherwise. // every-project bins when the global view is on, project-scoped otherwise.
React.useEffect(() => { var refreshBins = React.useCallback(function() {
const qs = openProject ? '?project_id=' + openProject.id : ''; var qs2 = openProject ? '?project_id=' + openProject.id : '';
window.ZAMPP_API.fetch('/bins' + qs) window.ZAMPP_API.fetch('/bins' + qs2)
.then(list => { .then(function(list) {
const normalized = (list || []).map(b => ({ var normalized = (list || []).map(function(b) { return { ...b, count: b.asset_count != null ? b.asset_count : (b.count || 0), icon: b.type || 'grid' }; });
...b,
count: b.asset_count != null ? b.asset_count : (b.count || 0),
icon: b.type || 'grid',
}));
if (!openProject) window.ZAMPP_DATA.BINS = normalized; if (!openProject) window.ZAMPP_DATA.BINS = normalized;
setBins(normalized); setBins(normalized);
}) })
.catch(() => {}); .catch(function() {});
}, [openProject]); }, [openProject]);
React.useEffect(function() {
refreshBins();
var onBinsChanged = function() { refreshBins(); };
window.addEventListener('df:bins-changed', onBinsChanged);
return function() { window.removeEventListener('df:bins-changed', onBinsChanged); };
}, [refreshBins]);
const createBin = () => { const createBin = () => {
if (!openProject) { window.alert('Open a project first (Projects → click a project), then create a bin inside it.'); return; } if (!openProject) { window.alert('Open a project first (Projects → click a project), then create a bin inside it.'); return; }
setNewBinName(''); setCreatingBin(true); setNewBinName(''); setCreatingBin(true);
@ -141,6 +144,7 @@ function Library({ navigate, onOpenAsset, openProject, onClearProject }) {
.then(function() { .then(function() {
setRecentlyMovedId(assetId); setRecentlyMovedId(assetId);
refreshAssets(); refreshAssets();
window.dispatchEvent(new Event('df:bins-changed'));
setTimeout(function() { setRecentlyMovedId(null); }, 2000); setTimeout(function() { setRecentlyMovedId(null); }, 2000);
}) })
.catch(function(e2) { alert('Move failed: ' + e2.message); }); .catch(function(e2) { alert('Move failed: ' + e2.message); });
@ -422,7 +426,7 @@ function AssetContextMenu({ asset, x, y, bins, onClose, onChanged, onOpen, onRen
const moveToBin = function(binId) { const moveToBin = function(binId) {
onClose(); onClose();
window.ZAMPP_API.fetch('/assets/' + asset.id, { method: 'PATCH', body: JSON.stringify({ bin_id: binId }) }) window.ZAMPP_API.fetch('/assets/' + asset.id, { method: 'PATCH', body: JSON.stringify({ bin_id: binId }) })
.then(onChanged) .then(function() { onChanged(); window.dispatchEvent(new Event('df:bins-changed')); })
.catch(function(e) { alert('Move failed: ' + e.message); }); .catch(function(e) { alert('Move failed: ' + e.message); });
}; };