# How it Works

This document provides a detailed explanation of how the system works and highlights the seamless experience it delivers, payment and product claim workflow in a decentralized application, including token selection, payment execution, and subsequent product claim or delivery confirmation. Below is a step-by-step breakdown of each part of the process:

#### **1. Payment Initialization**

* **Import Payment Component**:
  * The user accesses the payment functionality by importing the required component.
* **Select Chain and Token**:
  * The user selects the blockchain network (e.g., Binance Smart Chain, Polygon) and the token they want to use for payment (e.g., BNB, USDC).

#### **2. Token Price Conversion**

* **Fetch Token Price from Fiat**:
  * The system fetches the token's current price relative to fiat currency (e.g., USD).
* **Return Token Price**:
  * The token price is returned and displayed to the user. This ensures the user knows the exact amount of tokens required for the transaction.

#### **3. Payment Execution**

* **Display Amount in Token Currency**:
  * The payment amount is displayed in the selected token (e.g., "2 BNB").
* **Click on Pay**:
  * The user clicks the “Pay” button to initiate the transaction.
* **Open MetaMask Popup**:
  * A MetaMask popup opens, allowing the user to confirm the transaction.
* **Confirm Payment**:
  * The user approves the transaction in MetaMask.

#### **4. Transaction Handling**

* **Execute Transaction**:
  * The payment is processed on-chain, and the transaction is recorded.
* **New Transactions**:
  * The system reflects the new transaction details, showing that payment has been made.

***

#### **5. Claim and Delivery Process**

* **11-Day Claim Period**:
  * After payment, the product enters a claim period. The user can claim the product during this time.
* **Claim Product**:
  * The user initiates a claim on the purchased product.

**Alternate Flow**

* **After 1 Day**:
  * If no issues are reported within the claim period:
    * **Confirm Delivered**:
      * The system automatically confirms the delivery.
    * **Allow Withdrawal**:
      * Funds are made available for withdrawal by the seller.

***

#### **6. Post-Claim Actions**

* **Claim on Product (Block Withdrawal)**:
  * If the user claims an issue with the product, the withdrawal of funds by the seller is blocked temporarily.
* **Confirm Delivered After Issue Resolution**:
  * If the issue is resolved, the product is confirmed as delivered, and the seller is allowed to withdraw the funds.

***

### **Use Case Summary**

This sequence diagram represents the end-to-end workflow of:

1. **Token-based payment processing**.
2. **Ensuring product delivery through claim periods**.
3. **Resolving disputes and confirming product delivery**.

The diagram ensures transparency and decentralization in the payment and product claim processes while providing flexibility for multiple tokens and chains.

<div align="center"><figure><img src="https://2183554551-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOThdde3kgElPId9LRohq%2Fuploads%2Fac3XG2xtDPdTKLdH3Ly0%2Fimage.png?alt=media&#x26;token=bfc796b5-4b0a-414a-a189-3468c8c18448" alt=""><figcaption></figcaption></figure></div>