admin.suherdy/pos_ui_optimization
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: replace lifecycle hooks with useEffect and improve state initialization in OrderDisplay to prevent patch conflicts

Browse Source
This commit is contained in:
Suherdy Yacob 2026-05-11 17:26:57 +07:00
parent c79145faa3
commit 43e908ce7d
1 changed files with 33 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
static/src/app/components/order_display/order_display_patch.js
View File

@ -2,44 +2,47 @@
import { OrderDisplay } from "@point_of_sale/app/components/order_display/order_display";
import { patch } from "@web/core/utils/patch";
import { useState, onMounted, onWillUnmount } from "@odoo/owl";
import { useState, useEffect } from "@odoo/owl";
patch(OrderDisplay.prototype, {
setup() {
super.setup();
this.state = useState({ displayedCount: 20 });
// Use Object.assign to avoid overwriting state from other patches (e.g. pos_urban_piper)
if (this.state) {
Object.assign(this.state, { displayedCount: 20 });
} else {
this.state = useState({ displayedCount: 20 });
}
onMounted(() => {
const scrollable = this.scrollableRef.el;
if (!scrollable) {
return;
}
this.onScroll = () => {
if (
scrollable.scrollTop + scrollable.clientHeight >=
scrollable.scrollHeight - 100
) {
if (this.state.displayedCount < this.comboSortedLines.length) {
this.state.displayedCount += 20;
}
// Use useEffect to handle dynamic mounting of the scrollable element
useEffect(
(scrollable) => {
if (!scrollable) {
return;
}
};
scrollable.addEventListener("scroll", this.onScroll);
// Ensure selected line is visible by expanding displayedCount if needed
const selectedLineIndex = this.comboSortedLines.findIndex(l => l.selected);
if (selectedLineIndex >= this.state.displayedCount) {
this.state.displayedCount = selectedLineIndex + 1;
}
});
const onScroll = () => {
if (
scrollable.scrollTop + scrollable.clientHeight >=
scrollable.scrollHeight - 100
) {
if (this.state.displayedCount < this.comboSortedLines.length) {
this.state.displayedCount += 20;
}
}
};
scrollable.addEventListener("scroll", onScroll);
// Ensure selected line is visible by expanding displayedCount if needed
const selectedLineIndex = this.comboSortedLines.findIndex(l => l.selected);
if (selectedLineIndex >= this.state.displayedCount) {
this.state.displayedCount = selectedLineIndex + 1;
}
onWillUnmount(() => {
const el = this.scrollableRef.el;
if (el) {
el.removeEventListener("scroll", this.onScroll);
}
});
return () => scrollable.removeEventListener("scroll", onScroll);
},
() => [this.scrollableRef?.el]
);
},
get linesToDisplay() {