feat: implement held orders management with loading, cancel, and display functionality

src/app/modules/pos/store/index.ts

@@ -1,7 +1,7 @@
 import { Maybe } from '@/core';
 import { ICustomerResponse } from '@/modules/customers/models';
 import { computed, Inject, Injectable, InjectionToken, signal } from '@angular/core';
-import { map } from 'rxjs';
+import { map, of } from 'rxjs';
 import { IPosInfoResponse, IPosProductCategoriesResponse, IPosStockResponse } from '../models';
 import { IPosInOrderProduct } from '../models/types';
 import { PosService } from '../services/main.service';
@@ -66,7 +66,7 @@ export class POSStore {
       return this.state$().stock;
     }
     return this.state$().stock?.filter(
-      (s) => s.product.category.id === this.state$().activeProductCategory,
+      (s) => s.product.categoryId === this.state$().activeProductCategory,
     );
   });
 
@@ -258,6 +258,15 @@ export class POSStore {
         unitPrice: item.unitPrice,
       })),
     };
-    this.service.submitOrder(this.posId, orderPayload).subscribe();
+    return this.service.submitOrder(this.posId, orderPayload).subscribe({
+      next: (res) => {
+        this.resetInOrderProducts();
+        this.setSelectedCustomer(null);
+        return of(res);
+      },
+      error: (err) => {
+        return of(err);
+      },
+    });
   }
 }