mirror of
https://github.com/zotero/zotero.git
synced 2026-08-28 05:25:31 +00:00
Item/collection tree: Resize using ResizeObserver, not debounce (#5977)
This commit is contained in:
parent
9cffc1c7c2
commit
f3328b02ee
4 changed files with 6 additions and 32 deletions
|
|
@ -1102,9 +1102,8 @@ class VirtualizedTable extends React.Component {
|
|||
this._setXulTooltip();
|
||||
|
||||
this._topDiv.style.setProperty("--first-column-extra-width", `${this.firstColumnExtraWidth}px`);
|
||||
window.addEventListener("resize", () => {
|
||||
this._debouncedRerender();
|
||||
});
|
||||
this._resizeObserver = new ResizeObserver(() => this.rerender());
|
||||
this._resizeObserver.observe(this._jsWindow.targetElement);
|
||||
|
||||
if (this.props.stickySectionHeaders) {
|
||||
this._jsWindow.targetElement.addEventListener('scroll', this._updateStickySectionHeader, { passive: true });
|
||||
|
|
@ -1117,6 +1116,7 @@ class VirtualizedTable extends React.Component {
|
|||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this._resizeObserver?.disconnect();
|
||||
if (this.props.stickySectionHeaders && this._jsWindow) {
|
||||
this._jsWindow.targetElement.removeEventListener('scroll', this._updateStickySectionHeader);
|
||||
}
|
||||
|
|
@ -1589,8 +1589,6 @@ class VirtualizedTable extends React.Component {
|
|||
return parseFloat(height.split('px')[0]);
|
||||
}
|
||||
|
||||
_debouncedRerender = Zotero.Utilities.debounce(this.rerender, 200);
|
||||
|
||||
_updateWidth() {
|
||||
if (!this.props.showHeader) return;
|
||||
const jsWindow = document.querySelector(`#${this._jsWindowID} .windowed-list`);
|
||||
|
|
|
|||
|
|
@ -252,16 +252,6 @@ var LibraryTree = class LibraryTree extends React.Component {
|
|||
this.tree && this.tree.scrollToRow(index);
|
||||
}
|
||||
|
||||
updateHeight = () => {
|
||||
this.forceUpdate(() => {
|
||||
if (this.tree) {
|
||||
this.tree.rerender();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
updateHeightDebounced = Zotero.Utilities.debounce(this.updateHeight, 200);
|
||||
|
||||
updateFontSize() {
|
||||
this.tree.updateFontSize();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1675,9 +1675,6 @@ var ZoteroPane = new function () {
|
|||
}
|
||||
this.tagSelector.handleResize();
|
||||
}
|
||||
if (this.collectionsView) {
|
||||
this.collectionsView.updateHeightDebounced();
|
||||
}
|
||||
}, 100);
|
||||
|
||||
|
||||
|
|
@ -1949,12 +1946,8 @@ var ZoteroPane = new function () {
|
|||
|
||||
document.getElementById('zotero-tb-search').updateMode();
|
||||
let refreshPromise;
|
||||
if (state === 'open' && oldState === 'collapsed'
|
||||
|| state === 'collapsed' && oldState === 'open') {
|
||||
// State change only causes visual refresh - update the tree height
|
||||
this.itemsView.updateHeight();
|
||||
}
|
||||
else {
|
||||
if (!(state === 'open' && oldState === 'collapsed'
|
||||
|| state === 'collapsed' && oldState === 'open')) {
|
||||
// State change changes displayed items - refresh the tree
|
||||
refreshPromise = this._refreshAdvancedSearchPane();
|
||||
}
|
||||
|
|
@ -7199,11 +7192,6 @@ var ZoteroPane = new function () {
|
|||
}
|
||||
|
||||
this.updateLayoutConstraints();
|
||||
if (ZoteroPane.itemsView) {
|
||||
// Need to immediately rerender the items here without any debouncing
|
||||
// since tree height will have changed
|
||||
ZoteroPane.itemsView.updateHeight();
|
||||
}
|
||||
ZoteroContextPane.update();
|
||||
Zotero_Tabs.updateSidebarLayout();
|
||||
};
|
||||
|
|
@ -7387,9 +7375,6 @@ var ZoteroPane = new function () {
|
|||
|
||||
var collectionsPaneWidth = collectionsPane.getBoundingClientRect().width;
|
||||
tagSelector.style.maxWidth = collectionsPaneWidth + 'px';
|
||||
if (ZoteroPane.itemsView) {
|
||||
ZoteroPane.itemsView.updateHeightDebounced();
|
||||
}
|
||||
|
||||
this.handleTagSelectorResize();
|
||||
|
||||
|
|
|
|||
|
|
@ -131,6 +131,7 @@ function ZoteroLoader({
|
|||
clearInterval: win.clearInterval,
|
||||
requestAnimationFrame: win.requestAnimationFrame,
|
||||
cancelAnimationFrame: win.requestAnimationFrame,
|
||||
ResizeObserver: win.ResizeObserver,
|
||||
};
|
||||
for (const name in injectedGlobals) {
|
||||
this.loader.globals[name] = injectedGlobals[name];
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue