From 896252b61ea43f134f7dbbb18deb63013358e3ce Mon Sep 17 00:00:00 2001
From: Suherdy Yacob <suherdy.yacob@mapan.co.id>
Date: Fri, 20 Mar 2026 08:34:32 +0700
Subject: [PATCH] feat: Add POS UI optimization module for low-RAM devices,
 implementing incremental loading and safely removing event listeners.

---
 .gitignore                                    |  6 +++++
 README.md                                     | 27 +++++++++++++++++++
 .../order_display/order_display_patch.js      |  5 +++-
 3 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 .gitignore
 create mode 100644 README.md

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..ddcb816
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,6 @@
+*.pyc
+*~
+__pycache__/
+.DS_Store
+.vscode/
+.idea/
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..4155701
--- /dev/null
+++ b/README.md
@@ -0,0 +1,27 @@
+# POS UI Optimization
+
+This Odoo 19 module optimizes the Point of Sale (POS) user interface for low-RAM devices (e.g., Android tablets with 2GB RAM).
+
+## Features
+
+- **Product List Incremental Loading**: Renders products in batches of 40 as you scroll, significantly reducing memory usage in categories with many products.
+- **Order Cart Incremental Loading**: Efficiently handles large orders by rendering order lines incrementally as you scroll through the cart.
+- **Improved Responsiveness**: Keeps the browser DOM light and prevents "white blank" screens caused by memory exhaustion.
+- **Legacy Browser Support**: Designed without modern ES2020 JavaScript syntax (like optional chaining `?.`) to ensure compatibility with older Android browser engines found on specific legacy POS hardware.
+
+## Installation
+
+1. Place the `pos_ui_optimization` folder in your Odoo custom addons directory.
+2. Restart your Odoo server.
+3. In Odoo, activate **Developer Mode**.
+4. Go to **Apps** -> **Update Apps List**.
+5. Search for `POS UI Optimization`.
+6. Click **Install**.
+
+## Technical Details
+
+This module uses Odoo's JavaScript patching mechanism (`patch` from `@web/core/utils/patch`) to extend the core POS components:
+- `ProductScreen`: Adds `displayedProductsCount` state via `owl`'s `useEffect` and an overridden `onScroll` hook to the product container.
+- `OrderDisplay`: Adds `displayedCount` state and a scroll listener to the combo sorted order lines container.
+
+No core Odoo files are modified.
diff --git a/static/src/app/components/order_display/order_display_patch.js b/static/src/app/components/order_display/order_display_patch.js
index 89e932c..72d758a 100644
--- a/static/src/app/components/order_display/order_display_patch.js
+++ b/static/src/app/components/order_display/order_display_patch.js
@@ -35,7 +35,10 @@ patch(OrderDisplay.prototype, {
         });
 
         onWillUnmount(() => {
-            this.scrollableRef.el?.removeEventListener("scroll", this.onScroll);
+            const el = this.scrollableRef.el;
+            if (el) {
+                el.removeEventListener("scroll", this.onScroll);
+            }
         });
     },