From 51143f5980f201f1020af3426e4f7b2ef2c8549b Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Fri, 26 Jul 2024 13:16:59 +0100 Subject: [PATCH] migrate to biome (#28) * migrate to biome * get biome config from @kremalicious/config --- .eslintrc.json | 3 - .prettierrc.json | 7 - app/api/prices/route.ts | 6 +- app/api/quote/route.ts | 6 +- app/layout.tsx | 2 +- app/page.tsx | 2 +- biome.json | 3 + components/Content/Content.tsx | 2 +- components/Footer/Footer.tsx | 4 +- components/Header/Header.tsx | 4 +- components/Input/Input.tsx | 2 +- components/Logo/Logo.tsx | 1 + components/Select/Select.tsx | 4 +- components/TokenLogo/TokenLogo.tsx | 8 +- constants.ts | 2 +- .../components/MarketData/MarketData.tsx | 4 +- features/prices/components/Price/Price.tsx | 6 +- .../prices/components/Price/PriceChange.tsx | 4 +- features/prices/hooks/use-locale.ts | 2 +- features/strategies/components/Buy.tsx | 6 +- features/strategies/components/FormAmount.tsx | 12 +- features/strategies/components/FormMarket.tsx | 6 +- .../strategies/components/Result/Result.tsx | 8 +- .../strategies/components/Swap/Results.tsx | 8 +- features/strategies/components/Swap/Swap.tsx | 8 +- .../strategies/hooks/use-persistent-state.ts | 2 +- features/strategies/hooks/use-quote.ts | 4 +- lib/tokens.ts | 2 +- next.config.mjs | 6 + package-lock.json | 3901 +---------------- package.json | 17 +- 31 files changed, 239 insertions(+), 3813 deletions(-) delete mode 100644 .eslintrc.json delete mode 100644 .prettierrc.json create mode 100644 biome.json diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index bffb357..0000000 --- a/.eslintrc.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "extends": "next/core-web-vitals" -} diff --git a/.prettierrc.json b/.prettierrc.json deleted file mode 100644 index d9baec0..0000000 --- a/.prettierrc.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "semi": false, - "singleQuote": true, - "trailingComma": "none", - "tabWidth": 2, - "endOfLine": "lf" -} diff --git a/app/api/prices/route.ts b/app/api/prices/route.ts index f435f52..7363ac8 100644 --- a/app/api/prices/route.ts +++ b/app/api/prices/route.ts @@ -1,4 +1,4 @@ -import { type NextRequest } from 'next/server' +import type { NextRequest } from 'next/server' export const runtime = 'edge' @@ -21,8 +21,8 @@ export async function GET(request: NextRequest) { } const url = `${apiUrl}/prices?tokens=${tokens}` - let data - let status + let data: unknown + let status: number try { const res = await fetch(url, config) diff --git a/app/api/quote/route.ts b/app/api/quote/route.ts index 7eb93d5..0eba719 100644 --- a/app/api/quote/route.ts +++ b/app/api/quote/route.ts @@ -1,4 +1,4 @@ -import { type NextRequest } from 'next/server' +import type { NextRequest } from 'next/server' export const runtime = 'edge' @@ -14,8 +14,8 @@ export async function GET(request: NextRequest) { return Response.json(null, { status: 400 }) const url = `${apiUrl}/quote?tokenIn=${tokenIn}&tokenOut=${tokenOut}&amountIn=${amountIn}` - let data - let status + let data: unknown + let status: number try { const res = await fetch(url) diff --git a/app/layout.tsx b/app/layout.tsx index 78b9682..cd64490 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,8 +1,8 @@ import type { Metadata } from 'next' import '@/styles/globals.css' import '@/styles/loading-ui.css' +import { description, font, isProduction, liveUrl, title } from '@/constants' import Script from 'next/script' -import { title, description, font, liveUrl, isProduction } from '@/constants' export const metadata: Metadata = { title, diff --git a/app/page.tsx b/app/page.tsx index 33740a9..c2c658c 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,6 +1,6 @@ import { Content, Footer, Header } from '@/components' -import { Swap, Buy } from '@/features/strategies' import { MarketData } from '@/features/prices' +import { Buy, Swap } from '@/features/strategies' import styles from './page.module.css' export default function Home() { diff --git a/biome.json b/biome.json new file mode 100644 index 0000000..3666848 --- /dev/null +++ b/biome.json @@ -0,0 +1,3 @@ +{ + "extends": ["@kremalicious/config/biome"] +} diff --git a/components/Content/Content.tsx b/components/Content/Content.tsx index 3009a21..42a5779 100644 --- a/components/Content/Content.tsx +++ b/components/Content/Content.tsx @@ -1,6 +1,6 @@ +import content from '@/content.md' import Markdown from 'react-markdown' import styles from './Content.module.css' -import content from '@/content.md' export function Content() { return {content} diff --git a/components/Footer/Footer.tsx b/components/Footer/Footer.tsx index 21f62c6..9d01e13 100644 --- a/components/Footer/Footer.tsx +++ b/components/Footer/Footer.tsx @@ -1,6 +1,6 @@ +import { repoUrl } from '@/constants' import { GitHubLogoIcon } from '@radix-ui/react-icons' import styles from './Footer.module.css' -import { repoUrl } from '@/constants' export function Footer() { return ( @@ -24,7 +24,7 @@ export function Footer() {

-

+

) diff --git a/components/Header/Header.tsx b/components/Header/Header.tsx index e6377cc..9597a47 100644 --- a/components/Header/Header.tsx +++ b/components/Header/Header.tsx @@ -1,6 +1,6 @@ -import { title, description } from '@/constants' -import styles from './Header.module.css' import { Logo } from '@/components/Logo' +import { description, title } from '@/constants' +import styles from './Header.module.css' export function Header() { return ( diff --git a/components/Input/Input.tsx b/components/Input/Input.tsx index 90969ad..f7aa4f2 100644 --- a/components/Input/Input.tsx +++ b/components/Input/Input.tsx @@ -1,4 +1,4 @@ -import { InputHTMLAttributes } from 'react' +import type { InputHTMLAttributes } from 'react' import styles from './Input.module.css' type Props = InputHTMLAttributes diff --git a/components/Logo/Logo.tsx b/components/Logo/Logo.tsx index 400c729..045035e 100644 --- a/components/Logo/Logo.tsx +++ b/components/Logo/Logo.tsx @@ -7,6 +7,7 @@ export function Logo(props: React.SVGProps) { viewBox="0 0 425 282" {...props} > + Logo & { options: { value: string; label: string }[] diff --git a/components/TokenLogo/TokenLogo.tsx b/components/TokenLogo/TokenLogo.tsx index bdaa575..0d858c7 100644 --- a/components/TokenLogo/TokenLogo.tsx +++ b/components/TokenLogo/TokenLogo.tsx @@ -1,9 +1,9 @@ -import { Token } from '@/types' -import styles from './TokenLogo.module.css' -import oceanImage from '@/images/ocean.png' import agixImage from '@/images/agix.png' -import fetImage from '@/images/fet.png' import asiImage from '@/images/asi.png' +import fetImage from '@/images/fet.png' +import oceanImage from '@/images/ocean.png' +import type { Token } from '@/types' +import styles from './TokenLogo.module.css' export function TokenLogo({ token, diff --git a/constants.ts b/constants.ts index 8b069e9..8f45b44 100644 --- a/constants.ts +++ b/constants.ts @@ -1,4 +1,4 @@ -import { Token } from '@/types' +import type { Token } from '@/types' import { Hanken_Grotesk } from 'next/font/google' export const title = 'ASI Calculator' diff --git a/features/prices/components/MarketData/MarketData.tsx b/features/prices/components/MarketData/MarketData.tsx index 3e2b687..988cd59 100644 --- a/features/prices/components/MarketData/MarketData.tsx +++ b/features/prices/components/MarketData/MarketData.tsx @@ -1,8 +1,8 @@ 'use client' -import { ratioOceanToAsi, ratioAgixToAsi, ratioFetToAsi } from '@/constants' -import { usePrices, Price } from '@/features/prices' import { Badge } from '@/components' +import { ratioAgixToAsi, ratioFetToAsi, ratioOceanToAsi } from '@/constants' +import { Price, usePrices } from '@/features/prices' import styles from './MarketData.module.css' export function MarketData() { diff --git a/features/prices/components/Price/Price.tsx b/features/prices/components/Price/Price.tsx index 400ed8d..fbd7d73 100644 --- a/features/prices/components/Price/Price.tsx +++ b/features/prices/components/Price/Price.tsx @@ -1,7 +1,7 @@ -import { useLocale, usePrices, type PriceCoingecko } from '@/features/prices' -import { PriceChange } from './PriceChange' -import styles from './Price.module.css' +import { type PriceCoingecko, useLocale, usePrices } from '@/features/prices' import { formatFiat } from '@/lib' +import styles from './Price.module.css' +import { PriceChange } from './PriceChange' export function Price({ price }: { price: PriceCoingecko }) { const { isValidating, isLoading } = usePrices() diff --git a/features/prices/components/Price/PriceChange.tsx b/features/prices/components/Price/PriceChange.tsx index e7e2ee5..e1c388a 100644 --- a/features/prices/components/Price/PriceChange.tsx +++ b/features/prices/components/Price/PriceChange.tsx @@ -1,8 +1,8 @@ 'use client' -import { TriangleUpIcon, TriangleDownIcon } from '@radix-ui/react-icons' -import styles from './PriceChange.module.css' import { useLocale } from '@/features/prices/hooks/use-locale' +import { TriangleDownIcon, TriangleUpIcon } from '@radix-ui/react-icons' +import styles from './PriceChange.module.css' export function PriceChange({ priceChange }: { priceChange: number }) { const locale = useLocale() diff --git a/features/prices/hooks/use-locale.ts b/features/prices/hooks/use-locale.ts index 2934c37..ed4d849 100644 --- a/features/prices/hooks/use-locale.ts +++ b/features/prices/hooks/use-locale.ts @@ -1,6 +1,6 @@ 'use client' -import { useState, useEffect } from 'react' +import { useEffect, useState } from 'react' export function useLocale() { const [locale, setLocale] = useState('en-US') diff --git a/features/strategies/components/Buy.tsx b/features/strategies/components/Buy.tsx index 3db14d8..a1d6b43 100644 --- a/features/strategies/components/Buy.tsx +++ b/features/strategies/components/Buy.tsx @@ -1,11 +1,11 @@ 'use client' -import { useDebounce } from 'use-debounce' -import { ratioOceanToAsi, ratioAgixToAsi, ratioFetToAsi } from '@/constants' +import { ratioAgixToAsi, ratioFetToAsi, ratioOceanToAsi } from '@/constants' import { usePrices } from '@/features/prices' -import { getTokenBySymbol } from '@/lib' import { FormAmount, Result, usePersistentState } from '@/features/strategies' import stylesShared from '@/features/strategies/styles/shared.module.css' +import { getTokenBySymbol } from '@/lib' +import { useDebounce } from 'use-debounce' export function Buy() { const { prices, isValidating, isLoading } = usePrices() diff --git a/features/strategies/components/FormAmount.tsx b/features/strategies/components/FormAmount.tsx index 61d8c87..082b608 100644 --- a/features/strategies/components/FormAmount.tsx +++ b/features/strategies/components/FormAmount.tsx @@ -1,6 +1,6 @@ -import { Dispatch, SetStateAction } from 'react' -import { TokenSymbol } from '@/types' -import { Select, Input, FormInline } from '@/components' +import { FormInline, Input, Select } from '@/components' +import type { TokenSymbol } from '@/types' +import type { Dispatch, SetStateAction } from 'react' export function FormAmount({ amount, @@ -20,7 +20,7 @@ export function FormAmount({ if (value === '') { setAmount(0) - } else if (isNaN(Number(value))) { + } else if (Number.isNaN(Number(value))) { return } else { setAmount(Number(value)) @@ -53,7 +53,7 @@ export function FormAmount({ value={amount} onChange={handleAmountChange} onFocus={handleFocus} - style={{ width: amount.toString().length + 'ch' }} + style={{ width: `${amount.toString().length}ch` }} />