diff --git a/addons/pos_self_order/models/pos_config.py b/addons/pos_self_order/models/pos_config.py
index a25ae4db605..ce936d34c9f 100644
--- a/addons/pos_self_order/models/pos_config.py
+++ b/addons/pos_self_order/models/pos_config.py
@@ -169,6 +169,7 @@ class PosConfig(models.Model):
             "show_prices_with_tax_included": self.iface_tax_included == "total",
             "custom_links": self._get_self_order_custom_links(),
             "products": self._get_available_products()._get_self_order_data(self),
+            "pos_category": self.env['pos.category'].sudo().search_read(fields=["name", "sequence"], order="sequence"),
             "has_active_session": self.has_active_session,
         }
 
diff --git a/addons/pos_self_order/static/src/pages/product_list/product_list.xml b/addons/pos_self_order/static/src/pages/product_list/product_list.xml
index 3d186bcaec0..34eb4a3b464 100644
--- a/addons/pos_self_order/static/src/pages/product_list/product_list.xml
+++ b/addons/pos_self_order/static/src/pages/product_list/product_list.xml
@@ -3,6 +3,7 @@
 
     <t t-name="pos_self_order.ProductList" owl="1">
         <div class="d-flex flex-column dvh-100">
+            <t t-set="categories" t-value="Array.from(selfOrder.categoryList)" />
             <header class="bg-white shadow-sm">
                 <NavBar class="shouldNavbarBeShown() ? '' : 'o_self_order_navbar_hide' " />
                 <div class="o_self_order_searchbar_filter d-flex justify-content-start align-items-center p-0 m-0 border-bottom">
@@ -20,7 +21,7 @@
                     </div>
                     <t t-else="">
                         <ul t-ref="categoryList" class="nav nav-pills flex-nowrap flex-grow-1 px-2 border-end overflow-auto">
-                            <t t-foreach="Array.from(selfOrder.categoryList)" t-as="category" t-key="category">
+                            <t t-foreach="categories" t-as="category" t-key="category">
                                 <li class="nav-item mx-1 py-2"
                                     t-on-click="() => this.categoryOnClick(category)">
                                     <span
@@ -48,11 +49,10 @@
                     </t>
                 </t>
                 <t t-else="">
-                    <t t-set="categories" t-value="Object.keys(selfOrder.productsGroupedByCategory)" />
                     <p t-if="!categories?.length" class="mx-auto mt-3 text-center">No products found</p>
                     <t t-foreach="categories" t-as="category" t-key="category">
-                        <section t-if="selfOrder.productsGroupedByCategory[category].length" t-ref="productsWithCategory_{{category}}" class="w-100 d-flex flex-wrap">
-                             <h4 class="w-100 m-0 mt-n1 pb-2 pt-3 px-3 bg-secondary" t-esc="category" />
+                        <section t-ref="productsWithCategory_{{category}}" class="w-100 d-flex flex-wrap">
+                            <h4 class="w-100 m-0 mt-n1 pb-2 pt-3 px-3 bg-secondary" t-esc="category" />
                             <t t-foreach="selfOrder.productsGroupedByCategory[category]" t-as="product" t-key="product.id">
                                 <!-- If this is the product that we last visited, we use currentProductCard to
                                 get a reference to it -->
diff --git a/addons/pos_self_order/static/src/self_order_service.js b/addons/pos_self_order/static/src/self_order_service.js
index 6f5ab7abd72..96cd306d86d 100644
--- a/addons/pos_self_order/static/src/self_order_service.js
+++ b/addons/pos_self_order/static/src/self_order_service.js
@@ -23,7 +23,6 @@ export class SelfOrder {
         this.router = router;
         this.rpc = rpc;
         this.orders = [];
-        this.categoryList = new Set();
         this.editedOrder = null;
         this.productByIds = {};
         this.priceLoading = false;
@@ -32,6 +31,12 @@ export class SelfOrder {
         this.productsGroupedByCategory = {};
         this.notification = notification;
         this.initData();
+        this.categoryList = new Set(
+            this.pos_category
+                .sort((a, b) => a.sequence - b.sequence)
+                .map((c) => c.name)
+                .filter((c) => this.productsGroupedByCategory[c])
+        );
 
         if (this.self_order_mode !== "qr_code") {
             effect((state) => this.saveOrderToLocalStorage(state.orders), [this]);
@@ -50,10 +55,7 @@ export class SelfOrder {
     initData() {
         this.products = this.products.map((p) => {
             const product = new Product(p, this.show_prices_with_tax_included);
-
-            this.categoryList.add(...product.pos_categ_ids);
             this.productByIds[product.id] = product;
-
             return product;
         });