Default Component - Copy this React, Mui Component to your project

Left-Section:-Product-List-The-product-list-should-allow-for:-Editing-the-quantity-of-items.-Editing-the-product-name.-Editing-the-price.-A-dropdown-to-select-from-the-following-price-options:-Cash-7%-10%-12%-15%-Latest-price-(the-most-recent-price-of-the-product-from-the-database).-The-price-should-be-pulled-from-the-database.-A-trash-can-button-to-remove-an-item.-Right-Section:-Customer-Information-and-Shipping-Customer-Name-(pulled-from-the-database).-Payment-Type:-Choose-between-Cash-Sales-or-Credit-Sales.-Shipping-Method:-Choose-between-"Ship"-or-"Pickup".-If-"Ship"-is-selected:-Shipping-Address-(pulled-from-the-database).-If-not-available,-allow-the-user-to-add-a-new-address-with-a-popup-containing-the-following-fields:-Recipient-name.-Phone-number.-Select-location-(can-choose-location-from-a-map).-Automatically-fill-in-the-province,-district,-sub-district,-and-postal-code.-Delivery-Date-and-Time.-Option-to-choose-whether-to-include-shipping-cost-or-not.-If-shipping-cost-is-not-included,-the-system-will-calculate-the-shipping-cost-based-on-the-distance-from-the-warehouse-to-the-customer’s-location,-but-the-user-can-manually-adjust-the-shipping-cost.-If-shipping-cost-is-included,-no-additional-shipping-charges-will-be-calculated.-If-"Pickup"-is-selected:-Select-Branch-(pulled-from-the-database).-Pickup-Date-and-Time.-Payment-Method-(only-available-for-Cash-Sales):-QR-Code.-Cash.-Credit-Card.-Cash-on-Delivery-(COD).