diff --git a/app/api/quote/route.ts b/app/api/quote/route.ts index c8c37d7..373d5ce 100644 --- a/app/api/quote/route.ts +++ b/app/api/quote/route.ts @@ -7,7 +7,6 @@ const apiUrl = 'https://api.1inch.dev/swap/v6.0/1/quote' const config: RequestInit = { headers: { Authorization: `Bearer ${process.env.ONEINCH_API_KEY}`, - accept: 'application/json', 'content-type': 'application/json' }, method: 'GET', @@ -24,18 +23,27 @@ export async function GET(request: NextRequest) { return Response.json(null, { status: 400 }) } - let data const url = `${apiUrl}/?src=${src}&dst=${dst}&amount=${amount}&includeTokensInfo=true&includeProtocols=true` + let data + let status try { const res = await fetch(url, config) const json = await res.json() data = json + status = res.status } catch (error: unknown) { console.error((error as Error).message) data = null + status = 500 } - return Response.json(data) + return new Response(JSON.stringify(data), { + status, + headers: { + 'Content-Type': 'application/json', + 'Cache-Control': 'public, s-maxage=10' + } + }) } diff --git a/app/layout.tsx b/app/layout.tsx index 2f3fc68..9a2b00f 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -5,8 +5,8 @@ import './globals.css' const firaCode = Fira_Code({ subsets: ['latin'] }) export const metadata: Metadata = { - title: 'Create Next App', - description: 'Generated by create next app' + title: 'OCEAN + AGIX + FET = ASI', + description: 'Calculate how much ASI you get for your OCEAN, AGIX, or FET' } export default function RootLayout({ diff --git a/features/Prices/components/Prices.module.css b/features/Prices/components/Prices.module.css index f280466..399056e 100644 --- a/features/Prices/components/Prices.module.css +++ b/features/Prices/components/Prices.module.css @@ -2,17 +2,6 @@ margin-top: 2rem; } -.results h3, -.results p { +.results h3 { margin-bottom: 1rem; } - -.results p { - padding-left: 100px; -} - -.results p span { - margin-left: -100px; - min-width: 90px; - display: inline-block; -} diff --git a/features/Prices/components/Result.module.css b/features/Prices/components/Result.module.css new file mode 100644 index 0000000..eb7bd41 --- /dev/null +++ b/features/Prices/components/Result.module.css @@ -0,0 +1,6 @@ +.result { + margin-bottom: 1rem; +} + +.amount { +} diff --git a/features/Prices/components/Result.tsx b/features/Prices/components/Result.tsx index 746c24e..0db1ed9 100644 --- a/features/Prices/components/Result.tsx +++ b/features/Prices/components/Result.tsx @@ -1,3 +1,6 @@ +import { formatCurrency } from '@coingecko/cryptoformat' +import styles from './Result.module.css' + type Props = { symbol: string amount: number @@ -5,12 +8,23 @@ type Props = { amountFiat: number } +function formatPrice(price: number, currency: string) { + return formatCurrency(price, currency, 'en', false, { + decimalPlaces: 3, + significantFigures: 5 + }) +} + export function Result({ symbol, amount, amountAsi, amountFiat }: Props) { return ( -

- {symbol} {amount} {symbol}, convertible to{' '} - {amountAsi} ASI currently worth{' '} - ${amountFiat.toFixed(2)}. -

+
+

+ {formatPrice(amount, symbol)} →{' '} + {formatPrice(amountAsi, 'ASI')} +

+

+ = {formatPrice(amountFiat, 'USD')} +

+
) } diff --git a/package-lock.json b/package-lock.json index c10c526..464eb1e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "ocean-fetch-price-difference", "version": "0.1.0", "dependencies": { + "@coingecko/cryptoformat": "^0.8.1", "next": "14.1.4", "react": "^18", "react-dom": "^18", @@ -43,6 +44,14 @@ "node": ">=6.9.0" } }, + "node_modules/@coingecko/cryptoformat": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@coingecko/cryptoformat/-/cryptoformat-0.8.1.tgz", + "integrity": "sha512-pBxGpae1HIX0is1jFNB9U5RYv2OfRTKu6bcKM9BlhlfR/5TMK1m569Narra8pqlopg3MTHJ9B71zGqUbv56row==", + "engines": { + "node": ">=10" + } + }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", diff --git a/package.json b/package.json index 6d376cd..40c16c7 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "lint": "next lint" }, "dependencies": { + "@coingecko/cryptoformat": "^0.8.1", "next": "14.1.4", "react": "^18", "react-dom": "^18",