title: “Cart & Checkout” description: “Keranjang belanja multi-seller, checkout, payment gateway, POS mirror, voucher & diskon, dan order splitting di SNISHOP ERP.”
Cart & Checkout

Ringkasan Eksekutif
Cart.jsx (837 baris) merupakan pusat sistem keranjang belanja dan checkout SNISHOP ERP yang mendukung arsitektur multi-seller — item dari seller berbeda di-group secara otomatis dan diproses sebagai order terpisah. Sistem ini menangani 4 metode pembayaran utama, membuat POS mirror records, broadcast ke order queue via BroadcastChannel, dan menghitung commission secara server-side untuk menjamin integritas data finansial.
Checkout flow dirancang untuk menangani kompleksitas marketplace: ketika customer checkout item dari beberapa seller sekaligus, sistem otomatis split menjadi beberapa order (ProductOrder untuk item official, MarketplaceOrder untuk third-party sellers) dengan perhitungan commission yang akurat dan audit trail yang lengkap.
Sistem ini juga mengimplementasikan security policy yang ketat: browser-side code tidak pernah menggunakan asServiceRole, tidak pernah memanggil Company.list(), dan commission rate selalu di-fetch via server function.
Kapabilitas Utama
Arsitektur Komponen
Diagram Alur Data End-to-End
Entity & Model
MarketplaceCart
ProductOrder (Official Items)
MarketplaceOrder (Third-Party Items)
CompanyPOSTransaction (POS Mirror)
Fitur Utama
1. Multi-Seller Checkout
Checkout flow menangani item dari multiple sellers dalam satu transaksi:2. Order Splitting Logic
Financial Breakdown (MarketplaceOrder):
3. Payment Methods
Payment Routing:
4. Company Context Filtering
Cart items di-filter berdasarkan company context menggunakanfilterCartItemsForContext():
Security: Mencegah cross-company cart leakage dalam multi-tenant environment.
5. POS Mirror & Broadcast
Setiap order yang dibuat di-cart juga di-mirror ke POS system: BroadcastChannel API: Komunikasi real-time antar browser tabs — POS di tab lain bisa langsung receive update tanpa perlu polling.6. Commission Calculation
Commission rate selalu di-fetch dari server function untuk security: Security Policy: Browser-side code tidak pernah menghitung commission secara lokal — selalu via server function untuk mencegah manipulation.7. Voucher & Diskon System
Sistem checkout mendukung beberapa mekanisme diskon yang dapat dikombinasikan:
Flow Voucher Application:
Reseller Discount Tiers (dari
ShopSettings.reseller_discounts):
Pricing Calculation Formula:
8. Cart Management
9. Order Status Tracking
10. Quota-Based Products
Sistem mendukung produk berbasis kuota yang memungkinkan satu order digunakan berulang kali hingga kuota habis:
Use Case: Produk digital seperti jasa desain yang bisa direvisi beberapa kali — customer beli 1 order dengan kuota 5 revisi.
Security Policies
Browser-Side Restrictions
Cart mengimplementasikan 3 security policy yang di-enforce via test files:
Rationale: Mencegah privilege escalation dan data leakage dalam multi-tenant environment.
Kebijakan Keamanan RLS (Row-Level Security)
CompanyPOSTransaction memiliki RLS paling ketat di antara semua entity cart/order:- Staff POS hanya bisa mengakses transaksi dalam company yang sedang aktif
- User bisa mengakses transaksi yang mereka buat sendiri
- Admin memiliki akses penuh tanpa batasan company
- Mencegah cross-tenant data leakage dalam environment multi-company
filterCartItemsForContext() di browser-side untuk filtering berdasarkan company context.
Commission Rate tidak pernah diekspos ke browser — selalu di-fetch via server function getMarketplaceCommissionRate() untuk mencegah manipulasi nilai komisi dari client-side.
MyOrders (Order History)
MyOrders.jsx (345 baris) menampilkan unified order history dari 2 sumber:
Fitur:
Flow MyOrders Polling:
Cara Akses
Dari sidebar, klik menu Shop > Cart. URL publik:/checkout
Flow Penggunaan
Customer
- Browse produk dari Shop atau Marketplace
- Klik “Add to Cart” untuk menambahkan produk
- Buka halaman Cart (
/checkout) - Review item di keranjang
- Update quantity atau hapus item jika perlu
- Select items yang ingin di-checkout
- Klik “Checkout”
- Pilih metode pembayaran (Saldo / Manual / Mayar / SNISHOP Pay)
- Isi alamat pengiriman (jika fisik)
- Selesaikan pembayaran
- Lihat order status di halaman MyOrders (
/pesanan-saya)
Admin
- Monitor order masuk dari MarketplaceOrdersTab
- Untuk Manual Transfer: konfirmasi pembayaran dan update status
- Process order: update status dari pending → processing → completed
- Upload result files untuk order digital yang selesai
- Track commission yang masuk dari marketplace orders
Integrasi Cross-Module
Tips
- Test multi-seller checkout dengan item dari official dan third-party seller — pastikan order splitting bekerja dengan benar
- Monitor BroadcastChannel sync — POS di tab lain harus receive update real-time
- Untuk Manual Transfer, set ekspektasi ke customer bahwa order baru diproses setelah pembayaran dikonfirmasi admin
- Commission rate di-fetch via server function untuk security — jangan pernah hardcode atau calculate di browser
- Gunakan company context filtering untuk mencegah cross-company cart leakage
- MyOrders polling (10 detik) memastikan customer lihat update status tanpa perlu refresh manual
- Voucher memiliki
usage_limitdanvalid_until— pastikan validasi kedua field ini sebelum apply diskon - Reseller discount tier dihitung otomatis berdasarkan membership level customer — tidak perlu input manual
- Untuk produk berbasis kuota, monitor
quota_remainingagar tidak terjadi over-usage
Referensi Entity Schema (base44)
Bagian ini mendokumentasikan schema entity secara lengkap berdasarkan definisi JSONC dibase44/entities/.
Diagram Relasi Entity (erDiagram)
Tabel Schema Detail Entity
MarketplaceCart — Keranjang Belanja Marketplace
DigitalProduct — Produk Digital (Official)
Struktur
order_form_fields[]:
Struktur
variants[]:
ProductOrder — Pesanan Produk Digital (Official)
MarketplaceOrder — Pesanan Marketplace (Third-Party Seller)
Struktur
items[] (MarketplaceOrder):
Struktur
shipping_address (MarketplaceOrder):
MarketplaceCommissionSettings — Pengaturan Komisi Marketplace
CompanyPOSTransaction — Transaksi POS (Mirror & Direct)
Struktur
items[] (CompanyPOSTransaction):
Struktur
payments[] (Split Payment):
CompanyPOSProduct — Produk POS & Inventory
Struktur
channel_pricing:
ShopSettings — Pengaturan Toko
Struktur
promo_banner:
Struktur
reseller_discounts:
