shadcn.io is not affiliated with official shadcn/ui
Yield Farming Web3 Block for Ark UI
A farm directory that shows what each of five liquidity farms pays after gas: a deposit field, a switch for gas and harvest costs, net rate and break-even deposit per row, and a deposit button that turns on when you pick a farm.
Installation
Overview
Show small deposits what fees do to a yield, with this farm directory for React with Ark UI. It's the directory of Furrowfi, a fictional yield farm directory, and every rate and cost is a typed example, not a promise of returns. A deposit field and a Switch named Include gas and harvest costs sit above a table of five farms with the pair, the value locked, the base plus reward rate and the lock-up. Each row's net rate and its break-even deposit, the smallest deposit whose yield pays the fees, are worked out for the deposit you type, so a small deposit shows a negative net rate. Choosing a farm, with native radios in the table so the arrow keys move between rows, turns on the foot's one primary and the status line reads that farm at 500 and at 20,000 USDC. For DeFi dashboards and wallets.
FAQ
How is the net rate worked out?
Net rate is the rate before fees minus the yearly costs divided by the deposit. Yearly costs are one deposit's gas plus twelve harvests, since a harvest happens every 30 days. Break-even is the yearly costs divided by the rate before fees. With the switch off, the net rate equals the rate and break-even shows a dash.
Why can the net rate be negative?
Because fees do not scale with the deposit. At 500 USDC a farm with 110 USDC of yearly costs loses most of a year to fees; at 20,000 it keeps nearly all of its rate. The page shows the minus sign rather than hiding the row, and the Deposit button warns when the fees take more than the yield.
What stays local, and how do I wire it?
All of it. Farms, rates, gas and harvest costs are constants, and Deposit only writes a line in the status area. In your app read pools from your protocol's API, estimate gas from the network at the time, and send the deposit as a wallet transaction.
What does the page say about risk?
The header and the MDX say the rates are examples and not a promise of returns. Real farms carry smart contract risk, impermanent loss and reward tokens that can lose value, none of which a net rate shows.
Is it accessible from the keyboard?
Yes. The farms are one native radio group, so Tab enters the table once and the arrow keys move between rows, the switch and the field are labelled, and the table has a caption and row headers. The Deposit button stays reachable when it is not ready and the status line says why.