95:I[903690,["/chat-static/_next/static/immutable/chunks/1jt7kduqvys87.js","/chat-static/_next/static/immutable/chunks/3h9c9xa_ce096.js","/chat-static/_next/static/immutable/chunks/3mww3nmkzi9tl.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/0re7e5f0cowr7.js","/chat-static/_next/static/immutable/chunks/0d2mcgj-q16do.js","/chat-static/_next/static/immutable/chunks/0ic6a6ps43-np.js","/chat-static/_next/static/immutable/chunks/0ucsnyispllfk.js","/chat-static/_next/static/immutable/chunks/30wqhens5cioe.js","/chat-static/_next/static/immutable/chunks/40oczuspnd9lh.js","/chat-static/_next/static/immutable/chunks/124j6_tl6f8ph.js","/chat-static/_next/static/immutable/chunks/44ac-26ybftd3.js","/chat-static/_next/static/immutable/chunks/1y8f_921aawwo.js","/chat-static/_next/static/immutable/chunks/0af_1mofjxcba.js","/chat-static/_next/static/immutable/chunks/2dfjxmcoo1tp2.js","/chat-static/_next/static/immutable/chunks/33g364dont6bc.js","/chat-static/_next/static/immutable/chunks/3207spnjuidpt.js","/chat-static/_next/static/immutable/chunks/3_zne-oxp3ex8.js","/chat-static/_next/static/immutable/chunks/21b4squl5r8au.js","/chat-static/_next/static/immutable/chunks/3cg2lu5nlxz19.js","/chat-static/_next/static/immutable/chunks/38ti4hx2285mi.js","/chat-static/_next/static/immutable/chunks/2-wdjxm1l1tgc.js","/chat-static/_next/static/immutable/chunks/0g4_0g2ih2szk.js","/chat-static/_next/static/immutable/chunks/3oq4lrkhu64j_.js","/chat-static/_next/static/immutable/chunks/12jgl_43mlhsg.js","/chat-static/_next/static/immutable/chunks/0sg7s8mat8wbm.js","/chat-static/_next/static/immutable/chunks/2fuq3dzrsdm_0.js","/chat-static/_next/static/immutable/chunks/0ajqvtd47_5sl.js","/chat-static/_next/static/immutable/chunks/43gfst54wug0y.js","/chat-static/_next/static/immutable/chunks/0tygtpd1clwgp.js","/chat-static/_next/static/immutable/chunks/07ac4chx00t4a.js","/chat-static/_next/static/immutable/chunks/1-d6vp0sze29d.js","/chat-static/_next/static/immutable/chunks/1mom5in5gecbc.js","/chat-static/_next/static/immutable/chunks/1di-zl73drzjt.js","/chat-static/_next/static/immutable/chunks/1odhq-f_n4f5b.js","/chat-static/_next/static/immutable/chunks/3nfzfjsmxws0b.js","/chat-static/_next/static/immutable/chunks/2n9sfuryk7osj.js"],"ExplicitChatIdProvider"] 96:I[838238,["/chat-static/_next/static/immutable/chunks/1jt7kduqvys87.js","/chat-static/_next/static/immutable/chunks/3h9c9xa_ce096.js","/chat-static/_next/static/immutable/chunks/3mww3nmkzi9tl.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/0re7e5f0cowr7.js","/chat-static/_next/static/immutable/chunks/0d2mcgj-q16do.js","/chat-static/_next/static/immutable/chunks/0ic6a6ps43-np.js","/chat-static/_next/static/immutable/chunks/0ucsnyispllfk.js","/chat-static/_next/static/immutable/chunks/30wqhens5cioe.js","/chat-static/_next/static/immutable/chunks/40oczuspnd9lh.js","/chat-static/_next/static/immutable/chunks/124j6_tl6f8ph.js","/chat-static/_next/static/immutable/chunks/44ac-26ybftd3.js","/chat-static/_next/static/immutable/chunks/1y8f_921aawwo.js","/chat-static/_next/static/immutable/chunks/0af_1mofjxcba.js","/chat-static/_next/static/immutable/chunks/2dfjxmcoo1tp2.js","/chat-static/_next/static/immutable/chunks/33g364dont6bc.js","/chat-static/_next/static/immutable/chunks/3207spnjuidpt.js","/chat-static/_next/static/immutable/chunks/3_zne-oxp3ex8.js","/chat-static/_next/static/immutable/chunks/21b4squl5r8au.js","/chat-static/_next/static/immutable/chunks/3cg2lu5nlxz19.js","/chat-static/_next/static/immutable/chunks/38ti4hx2285mi.js","/chat-static/_next/static/immutable/chunks/2-wdjxm1l1tgc.js","/chat-static/_next/static/immutable/chunks/0g4_0g2ih2szk.js","/chat-static/_next/static/immutable/chunks/3oq4lrkhu64j_.js","/chat-static/_next/static/immutable/chunks/12jgl_43mlhsg.js","/chat-static/_next/static/immutable/chunks/0sg7s8mat8wbm.js","/chat-static/_next/static/immutable/chunks/2fuq3dzrsdm_0.js","/chat-static/_next/static/immutable/chunks/0ajqvtd47_5sl.js","/chat-static/_next/static/immutable/chunks/43gfst54wug0y.js","/chat-static/_next/static/immutable/chunks/0tygtpd1clwgp.js","/chat-static/_next/static/immutable/chunks/07ac4chx00t4a.js","/chat-static/_next/static/immutable/chunks/1-d6vp0sze29d.js","/chat-static/_next/static/immutable/chunks/1mom5in5gecbc.js","/chat-static/_next/static/immutable/chunks/1di-zl73drzjt.js","/chat-static/_next/static/immutable/chunks/1odhq-f_n4f5b.js","/chat-static/_next/static/immutable/chunks/3nfzfjsmxws0b.js","/chat-static/_next/static/immutable/chunks/2n9sfuryk7osj.js"],"SWRDataProvider"] 97: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 ( ) } 8b:["$","$L95",null,{"chatId":"wPdRCJBeVIz","children":["$","$L96",null,{"data":{"@\"active-block\",\"wPdRCJBeVIz\",":{"id":"jPJ5aJ5Ibw9","messageId":"gCAY0YcSDyHDZST6gNGmwSHT6UuPrVEZ","source":"$97","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},"children":"$L98"}]}]

About

Tags

Share

About

Tags

Share

More from dollargill

More Templates Like This