94:I[903690,["/chat-static/_next/static/immutable/chunks/10wpt-vzxn5i1.js","/chat-static/_next/static/immutable/chunks/0lyxw0nk-7-p_.js","/chat-static/_next/static/immutable/chunks/0s13a2j9-r_7z.js","/chat-static/_next/static/immutable/chunks/05z0jc31ylkrk.js","/chat-static/_next/static/immutable/chunks/2836u6jwf9bgv.js","/chat-static/_next/static/immutable/chunks/3ktygcwrvju41.js","/chat-static/_next/static/immutable/chunks/3npdfuq6kuky8.js","/chat-static/_next/static/immutable/chunks/3xgcz543a20n9.js","/chat-static/_next/static/immutable/chunks/2ks2dvr47nqsg.js","/chat-static/_next/static/immutable/chunks/0wp9iyt7gqj9c.js","/chat-static/_next/static/immutable/chunks/03w_e6mqufrhn.js","/chat-static/_next/static/immutable/chunks/3su8b9kn4mbaa.js","/chat-static/_next/static/immutable/chunks/2sp-yda0t06bm.js","/chat-static/_next/static/immutable/chunks/06-mpaxkl_qww.js","/chat-static/_next/static/immutable/chunks/2v1ytxhjawdqw.js","/chat-static/_next/static/immutable/chunks/3vhx3fg583u19.js","/chat-static/_next/static/immutable/chunks/3bon2sery8l35.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/179p_vj82jpro.js","/chat-static/_next/static/immutable/chunks/2d_83taslaz9s.js","/chat-static/_next/static/immutable/chunks/1r_xlti2nupgd.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/0ggiln07qpg3x.js","/chat-static/_next/static/immutable/chunks/0v6za4mu6mmch.js","/chat-static/_next/static/immutable/chunks/362eoze68z3tj.js","/chat-static/_next/static/immutable/chunks/30xbirk075f9u.js","/chat-static/_next/static/immutable/chunks/2s3rmbgvk5alc.js","/chat-static/_next/static/immutable/chunks/2ihe2cde8-h-m.js","/chat-static/_next/static/immutable/chunks/34pqinj9axzi3.js","/chat-static/_next/static/immutable/chunks/24oxen36r-7_-.js","/chat-static/_next/static/immutable/chunks/21nzp1fdul4xe.js","/chat-static/_next/static/immutable/chunks/2r3778mxx4zx3.js","/chat-static/_next/static/immutable/chunks/2aqaq-qj4jd04.js","/chat-static/_next/static/immutable/chunks/27kqtemkm6wc0.js","/chat-static/_next/static/immutable/chunks/1gwh2_shftvhf.js","/chat-static/_next/static/immutable/chunks/2wi4f19gpmjmu.js","/chat-static/_next/static/immutable/chunks/3f0qksrmwbx5_.js","/chat-static/_next/static/immutable/chunks/2p_xpxyq5ao8y.js","/chat-static/_next/static/immutable/chunks/1etiboqt-76vo.js","/chat-static/_next/static/immutable/chunks/30c9gel_8-oba.js","/chat-static/_next/static/immutable/chunks/1elbuzr4anjh-.js","/chat-static/_next/static/immutable/chunks/2i-ulz8g4wtdk.js"],"ExplicitChatIdProvider"] 95:I[838238,["/chat-static/_next/static/immutable/chunks/10wpt-vzxn5i1.js","/chat-static/_next/static/immutable/chunks/0lyxw0nk-7-p_.js","/chat-static/_next/static/immutable/chunks/0s13a2j9-r_7z.js","/chat-static/_next/static/immutable/chunks/05z0jc31ylkrk.js","/chat-static/_next/static/immutable/chunks/2836u6jwf9bgv.js","/chat-static/_next/static/immutable/chunks/3ktygcwrvju41.js","/chat-static/_next/static/immutable/chunks/3npdfuq6kuky8.js","/chat-static/_next/static/immutable/chunks/3xgcz543a20n9.js","/chat-static/_next/static/immutable/chunks/2ks2dvr47nqsg.js","/chat-static/_next/static/immutable/chunks/0wp9iyt7gqj9c.js","/chat-static/_next/static/immutable/chunks/03w_e6mqufrhn.js","/chat-static/_next/static/immutable/chunks/3su8b9kn4mbaa.js","/chat-static/_next/static/immutable/chunks/2sp-yda0t06bm.js","/chat-static/_next/static/immutable/chunks/06-mpaxkl_qww.js","/chat-static/_next/static/immutable/chunks/2v1ytxhjawdqw.js","/chat-static/_next/static/immutable/chunks/3vhx3fg583u19.js","/chat-static/_next/static/immutable/chunks/3bon2sery8l35.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/179p_vj82jpro.js","/chat-static/_next/static/immutable/chunks/2d_83taslaz9s.js","/chat-static/_next/static/immutable/chunks/1r_xlti2nupgd.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/0ggiln07qpg3x.js","/chat-static/_next/static/immutable/chunks/0v6za4mu6mmch.js","/chat-static/_next/static/immutable/chunks/362eoze68z3tj.js","/chat-static/_next/static/immutable/chunks/30xbirk075f9u.js","/chat-static/_next/static/immutable/chunks/2s3rmbgvk5alc.js","/chat-static/_next/static/immutable/chunks/2ihe2cde8-h-m.js","/chat-static/_next/static/immutable/chunks/34pqinj9axzi3.js","/chat-static/_next/static/immutable/chunks/24oxen36r-7_-.js","/chat-static/_next/static/immutable/chunks/21nzp1fdul4xe.js","/chat-static/_next/static/immutable/chunks/2r3778mxx4zx3.js","/chat-static/_next/static/immutable/chunks/2aqaq-qj4jd04.js","/chat-static/_next/static/immutable/chunks/27kqtemkm6wc0.js","/chat-static/_next/static/immutable/chunks/1gwh2_shftvhf.js","/chat-static/_next/static/immutable/chunks/2wi4f19gpmjmu.js","/chat-static/_next/static/immutable/chunks/3f0qksrmwbx5_.js","/chat-static/_next/static/immutable/chunks/2p_xpxyq5ao8y.js","/chat-static/_next/static/immutable/chunks/1etiboqt-76vo.js","/chat-static/_next/static/immutable/chunks/30c9gel_8-oba.js","/chat-static/_next/static/immutable/chunks/1elbuzr4anjh-.js","/chat-static/_next/static/immutable/chunks/2i-ulz8g4wtdk.js"],"SWRDataProvider"] 96:T2492,[V0_FILE]typescriptreact:file="currency-converter.tsx" isQuickEdit="true" "use client" import { useState, useEffect } from "react" import { motion } from "framer-motion" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog" import { ScrollArea } from "@/components/ui/scroll-area" import { ArrowUpDown, ChevronRight, Search } from "lucide-react" const fiatCurrencies = [ { code: "USD", name: "US Dollar", flag: "🇺🇸" }, { code: "EUR", name: "Euro", flag: "🇪🇺" }, { code: "GBP", name: "British Pound", flag: "🇬🇧" }, { code: "JPY", name: "Japanese Yen", flag: "🇯🇵" }, { code: "AUD", name: "Australian Dollar", flag: "🇦🇺" }, { code: "CAD", name: "Canadian Dollar", flag: "🇨🇦" }, { code: "CHF", name: "Swiss Franc", flag: "🇨🇭" }, { code: "CNY", name: "Chinese Yuan", flag: "🇨🇳" }, { code: "INR", name: "Indian Rupee", flag: "🇮🇳" }, { code: "SGD", name: "Singapore Dollar", flag: "🇸🇬" }, { code: "NZD", name: "New Zealand Dollar", flag: "🇳🇿" }, { code: "MXN", name: "Mexican Peso", flag: "🇲🇽" }, { code: "BRL", name: "Brazilian Real", flag: "🇧🇷" }, { code: "SEK", name: "Swedish Krona", flag: "🇸🇪" }, { code: "NOK", name: "Norwegian Krone", flag: "🇳🇴" }, ] const cryptoCurrencies = [ { code: "BTC", name: "Bitcoin", icon: "₿" }, { code: "ETH", name: "Ethereum", icon: "Ξ" }, { code: "USDT", name: "Tether", icon: "₮" }, { code: "BNB", name: "Binance Coin", icon: "BNB" }, { code: "XRP", name: "Ripple", icon: "XRP" }, { code: "ADA", name: "Cardano", icon: "ADA" }, { code: "SOL", name: "Solana", icon: "SOL" }, { code: "DOT", name: "Polkadot", icon: "DOT" }, { code: "DOGE", name: "Dogecoin", icon: "Ð" }, { code: "AVAX", name: "Avalanche", icon: "AVAX" }, ] export default function CurrencyConverter() { const [amount, setAmount] = useState(1) const [fromCurrency, setFromCurrency] = useState("USD") const [toCurrency, setToCurrency] = useState("EUR") const [convertedAmount, setConvertedAmount] = useState(null) const [exchangeRate, setExchangeRate] = useState(null) const [isCrypto, setIsCrypto] = useState(false) const [isLoading, setIsLoading] = useState(false) const [error, setError] = useState(null) useEffect(() => { const fetchExchangeRate = async () => { setIsLoading(true) setError(null) try { const response = await fetch( `https://free.currconv.com/api/v7/convert?apiKey=YOUR_API_KEY&q=${fromCurrency}_${toCurrency}&compact=ultra`, ) if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`) } const data = await response.json() const rate = data[`${fromCurrency}_${toCurrency}`] if (!rate) { throw new Error("Exchange rate not found in response") } setExchangeRate(rate) setConvertedAmount(amount * rate) } catch (error) { console.error("Error fetching exchange rate:", error) setError("Failed to fetch exchange rate. Using fallback rate.") // Fallback to a static exchange rate const fallbackRate = 1.1 // Example fallback rate setExchangeRate(fallbackRate) setConvertedAmount(amount * fallbackRate) } finally { setIsLoading(false) } } fetchExchangeRate() }, [amount, fromCurrency, toCurrency]) const handleSwapCurrencies = () => { setFromCurrency(toCurrency) setToCurrency(fromCurrency) } return (

Currency Converter

Convert

{ const value = Number.parseFloat(e.target.value) if (!isNaN(value)) { setAmount(Math.max(0, Math.min(1000000, value))) } }} onWheel={(e) => { e.preventDefault() const delta = e.deltaY > 0 ? -1 : 1 setAmount((prevAmount) => { const newAmount = prevAmount + delta return Math.max(0, Math.min(1000000, newAmount)) }) }} step="1" min="0" max="1000000" className="w-full text-5xl font-light bg-transparent border-none text-center focus:ring-0 focus:outline-none text-white placeholder-gray-400" placeholder="0" />

{isLoading ? (

) : ( <> {error &&

{error}

}

{convertedAmount !== null ? convertedAmount.toFixed(isCrypto ? 8 : 2) : "..."} {toCurrency}

1 {fromCurrency} = {exchangeRate !== null ? exchangeRate.toFixed(isCrypto ? 8 : 4) : "..."}{" "} {toCurrency}

)}

) } function CurrencySelect({ value, onChange, label, isCrypto }) { const [open, setOpen] = useState(false) const [search, setSearch] = useState("") const currencies = isCrypto ? cryptoCurrencies : fiatCurrencies const filteredCurrencies = currencies.filter( (currency) => currency.code.toLowerCase().includes(search.toLowerCase()) || currency.name.toLowerCase().includes(search.toLowerCase()), ) return ( ) } 8a:["$","$L94",null,{"chatId":"wPdRCJBeVIz","children":["$","$L95",null,{"data":{"@\"active-block\",\"wPdRCJBeVIz\",":{"id":"jPJ5aJ5Ibw9","messageId":"gCAY0YcSDyHDZST6gNGmwSHT6UuPrVEZ","source":"$96","language":"typescriptreact","type":"code-project","closed":true,"meta":{"id":"premium-currency-converter","type":"code-project","project":"premium-currency-converter"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"wPdRCJBeVIz\",":false,"":null},"children":"$L97"}]}]

About

Tags

Share

About

Tags

Share

About

Tags

Share

More from dollargill

More Templates Like This