https://v0.dev/chat/pay-flow-dashboard-design-knmBspOUPrM

PayFlow

PayFlow is a decentralized point-of-sale (POS) Web3 application built with React, Tailwind CSS, and Ethereum integration. It allows merchants to accept ETH or ERC-20 tokens directly via wallet-to-wallet payments—no middlemen, no banks.

✨ Features

• 🔐 Wallet connection (MetaMask, WalletConnect)
• 💳 Full POS interface (cart, product list, checkout)
• 📈 Transaction history with Etherscan links
• ⚙️ Merchant settings (ETH address, testnet toggle)
• 🌐 Built using wagmi, ethers.js, rainbowkit
• 🌓 Dark mode, mobile-responsive, modern UI

🛠️ Tech Stack

• Frontend: React, Tailwind CSS
• Web3: Ethers.js, Wagmi, RainbowKit
• Storage/Backend: Firebase or Supabase (optional)
• Smart Contracts: Solidity (Hardhat or Foundry)

🚀 Getting Started

git clone https://github.com/yourname/payflow.git
cd payflow
npm install
npm run dev

🧪 Simulate Payment (Example)

const tx = await signer.sendTransaction({
  to: merchantAddress,
  value: ethers.utils.parseEther("0.01"),
});
await tx.wait();

📜 Smart Contract Sample

event PaymentProcessed(address indexed buyer, uint256 amount, string itemId);

function pay(string memory itemId) public payable {
    require(msg.value > 0, "Payment required");
    emit PaymentProcessed(msg.sender, msg.value, itemId);
}

🧰 Tools Recommended

• V0.dev for layout
• Lucide Icons
• IPFS for decentralized receipts

---

Made with 💜 by kind people, for kind people.