USD to ARS VISA Exchange Rate

\n Date:\n setDate(e.target.value)}\n />\n

\n Fee Rate:\n \n {fee.toFixed(2)}%\n

\n {isLoading && (\n

\n )}\n {error && (\n

{error.message}

\n )}\n {data && !isLoading && !error && (\n

1 USD = {data.reverseAmount} ARS

\n )}\n {weekIsLoading && (\n

Loading week data...

\n )}\n {weekError && (\n

{weekError.message}

\n )}\n {weekData && !weekIsLoading && !weekError && (\n

\n \n

\n )}\n

\n \n Ver fuentes de datos\n {\" \"}\n - View Source\n

\n );\n}\n\nfunction App() {\n return (\n \n \n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nconst visaDomains = [\n \"usa.visa.com\",\n \"km.visamiddleeast.com\",\n \"www.visa.com.au\",\n \"www.visa.co.uk\"\n];\n\nfunction getRandomDomain() {\n const randomIndex = Math.floor(Math.random() * visaDomains.length);\n return visaDomains[randomIndex];\n}\n\nasync function cachedApiCall(baseUrl: string, cacheKey: string, maxRetries = 4) {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const { fetch } = await import(\"https://esm.town/v/std/fetch\");\n\n const cachedData = await blob.getJSON(cacheKey);\n\n if (cachedData) {\n return cachedData;\n }\n\n let lastError;\n for (let i = 0; i < maxRetries; i++) {\n const domain = getRandomDomain();\n const url = baseUrl.replace(\"{domain}\", domain);\n\n try {\n const response = await fetch(url);\n if (!response.ok) {\n throw new Error(`Failed to fetch from API: ${url}`);\n }\n\n const data = await response.json();\n await blob.setJSON(cacheKey, data);\n return data;\n } catch (error) {\n console.error(`Attempt ${i + 1} failed:`, error);\n lastError = error;\n }\n }\n\n throw new Error(`Failed to fetch after ${maxRetries} attempts. Last error: ${lastError.message}`);\n}\n\nexport default async function server(request: Request): Promise {\n const url = new URL(request.url);\n\n if (url.pathname === \"/api/exchange-rate\") {\n const date = url.searchParams.get(\"date\");\n const fee = url.searchParams.get(\"fee\");\n\n if (!date || !fee) {\n return new Response(JSON.stringify({ error: \"Missing date or fee parameter\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n const formattedDate = formatDate(date);\n const baseUrl = `https://{domain}/cmsapi/fx/rates?amount=1&fee=${fee}&utcConvertedDate=${formattedDate}&exchangedate=${formattedDate}&fromCurr=USD&toCurr=ARS`;\n const cacheKey = `visa_exchange_rate_${url.searchParams.toString()}`;\n\n try {\n const data = await cachedApiCall(baseUrl, cacheKey);\n return new Response(JSON.stringify(data), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n console.error(\"Error fetching from Visa API:\", error);\n return new Response(JSON.stringify({ error: \"Failed to fetch exchange rate after multiple attempts\" }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n } else if (url.pathname === \"/api/week-exchange-rate\") {\n const fee = url.searchParams.get(\"fee\");\n\n if (!fee) {\n return new Response(JSON.stringify({ error: \"Missing fee parameter\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n const cacheKey = `visa_week_exchange_rate_${url.searchParams.toString()}`;\n const cachedData = await cachedApiCall(\"\", cacheKey);\n\n if (cachedData) {\n return new Response(JSON.stringify(cachedData), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n const dates = [];\n const rates = [];\n const today = new Date();\n\n for (let i = 6; i >= 0; i--) {\n const date = new Date(today);\n date.setDate(today.getDate() - i);\n const formattedDate = formatDate(date.toISOString().split('T')[0]);\n dates.push(formattedDate);\n\n const baseUrl = `https://{domain}/cmsapi/fx/rates?amount=1&fee=${fee}&utcConvertedDate=${formattedDate}&exchangedate=${formattedDate}&fromCurr=USD&toCurr=ARS`;\n\n try {\n const data = await cachedApiCall(baseUrl, `visa_exchange_rate_${formattedDate}_${fee}`);\n rates.push(data);\n } catch (error) {\n console.error(\"Error fetching from Visa API:\", error);\n return new Response(JSON.stringify({ error: \"Failed to fetch week exchange rates\" }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n const weekData = { dates, rates };\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.setJSON(cacheKey, weekData);\n\n return new Response(JSON.stringify(weekData), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n return new Response(\n `\n \n \n USD to ARS Exchange Rate\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nfunction formatDate(dateString: string): string {\n const d = new Date(dateString);\n return `${(d.getMonth() + 1).toString().padStart(2, \"0\")}%2F${\n d.getDate().toString().padStart(2, \"0\")\n }%2F${d.getFullYear()}`;\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 20px;\n background-color: #f4f4f4;\n}\n\n.container {\n max-width: 800px;\n margin: 0 auto;\n background-color: #fff;\n padding: 20px;\n border-radius: 5px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n}\n\nh1 {\n color: #333;\n text-align: center;\n}\n\n.input-group {\n margin-bottom: 20px;\n}\n\nlabel {\n display: block;\n margin-bottom: 5px;\n}\n\ninput[type=\"date\"], input[type=\"range\"] {\n width: 100%;\n padding: 8px;\n border: 1px solid #ddd;\n border-radius: 4px;\n}\n\n.result {\n background-color: #e9f7ef;\n padding: 15px;\n border-radius: 4px;\n text-align: center;\n margin-bottom: 20px;\n}\n\nh2 {\n color: #27ae60;\n margin: 0;\n}\n\n.error {\n background-color: #ffebee;\n color: #c62828;\n padding: 15px;\n border-radius: 4px;\n text-align: center;\n margin-bottom: 20px;\n}\n\n.loading {\n background-color: #e3f2fd;\n color: #1565c0;\n padding: 15px;\n border-radius: 4px;\n text-align: center;\n margin-bottom: 20px;\n}\n\n.chart-container {\n margin-top: 20px;\n margin-bottom: 20px;\n}\n\n.footer {\n margin-top: 20px;\n text-align: center;\n}\n\n.footer a {\n color: #3498db;\n text-decoration: none;\n}\n\n.footer a:hover {\n text-decoration: underline;\n}\n`;","deleted","label",[100],"permalink","https://www.val.town/x/nulo/visaArsExchangeRate/code/main.tsx","extension","actionData","errors"]