format

coinbase · Jun 13, 2024 · 85b1a31 · 85b1a31
1 parent 4dc6b33
commit 85b1a31
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 53 deletions.
diff --git a/src/swap/components/SwapAmountInput.test.tsx b/src/swap/components/SwapAmountInput.test.tsx
@@ -1,111 +1,111 @@
 /**
  * @jest-environment jsdom
  */
-import React from "react";
-import { render, screen, fireEvent } from "@testing-library/react";
-import "@testing-library/jest-dom";
-import { SwapAmountInput } from "./SwapAmountInput";
-import { SwapContext } from "../context";
-import { type Token } from "../../token";
-import type { SwapContextType } from "../types";
-import type { Address } from "viem";
-
-jest.mock("../../token", () => ({
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { SwapAmountInput } from './SwapAmountInput';
+import { SwapContext } from '../context';
+import { type Token } from '../../token';
+import type { SwapContextType } from '../types';
+import type { Address } from 'viem';
+
+jest.mock('../../token', () => ({
   TokenChip: jest.fn(() => <div>TokenChip</div>),
 }));
 
 const mockContextValue = {
-  fromAmount: "10",
+  fromAmount: '10',
   setFromAmount: jest.fn(),
   setFromToken: jest.fn(),
   setToAmount: jest.fn(),
   setToToken: jest.fn(),
-  toAmount: "20",
-  address: "0x5FbDB2315678afecb367f032d93F642f64180aa3" as Address,
+  toAmount: '20',
+  address: '0x5FbDB2315678afecb367f032d93F642f64180aa3' as Address,
 } as SwapContextType;
 
 const mockToken: Token = {
-  name: "ETH",
-  address: "",
-  symbol: "ETH",
+  name: 'ETH',
+  address: '',
+  symbol: 'ETH',
   decimals: 18,
   image:
-    "https://wallet-api-production.s3.amazonaws.com/uploads/tokens/eth_288.png",
+    'https://wallet-api-production.s3.amazonaws.com/uploads/tokens/eth_288.png',
   chainId: 8453,
 };
 
-describe("SwapAmountInput", () => {
+describe('SwapAmountInput', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
 
-  it("renders the component with the correct label and token", () => {
+  it('renders the component with the correct label and token', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="from" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    expect(screen.getByText("From")).toBeInTheDocument();
+    expect(screen.getByText('From')).toBeInTheDocument();
   });
 
   it('displays the correct amount when this type is "from"', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="from" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    const input = screen.getByTestId("ockSwapAmountInput_Input");
-    expect(input).toHaveValue("10");
+    const input = screen.getByTestId('ockSwapAmountInput_Input');
+    expect(input).toHaveValue('10');
   });
 
   it('displays the correct amount when this type is "to"', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="To" token={mockToken} type="to" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    const input = screen.getByTestId("ockSwapAmountInput_Input");
-    expect(input).toHaveValue("20");
+    const input = screen.getByTestId('ockSwapAmountInput_Input');
+    expect(input).toHaveValue('20');
   });
 
   it('calls setFromAmount when type is "from" and valid input is entered', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="from" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    const input = screen.getByTestId("ockSwapAmountInput_Input");
-    fireEvent.change(input, { target: { value: "15" } });
+    const input = screen.getByTestId('ockSwapAmountInput_Input');
+    fireEvent.change(input, { target: { value: '15' } });
 
-    expect(mockContextValue.setFromAmount).toHaveBeenCalledWith("15");
+    expect(mockContextValue.setFromAmount).toHaveBeenCalledWith('15');
   });
 
   it('calls setToAmount when type is "to" and valid input is entered', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="to" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    const input = screen.getByTestId("ockSwapAmountInput_Input");
-    fireEvent.change(input, { target: { value: "15" } });
+    const input = screen.getByTestId('ockSwapAmountInput_Input');
+    fireEvent.change(input, { target: { value: '15' } });
 
-    expect(mockContextValue.setToAmount).toHaveBeenCalledWith("15");
+    expect(mockContextValue.setToAmount).toHaveBeenCalledWith('15');
   });
 
-  it("does not call setAmount when invalid input is entered", () => {
+  it('does not call setAmount when invalid input is entered', () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="from" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
-    const input = screen.getByTestId("ockSwapAmountInput_Input");
-    fireEvent.change(input, { target: { value: "invalid" } });
+    const input = screen.getByTestId('ockSwapAmountInput_Input');
+    fireEvent.change(input, { target: { value: 'invalid' } });
 
     expect(mockContextValue.setFromAmount).not.toHaveBeenCalled();
   });
@@ -114,7 +114,7 @@ describe("SwapAmountInput", () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="From" token={mockToken} type="from" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
     expect(mockContextValue.setFromToken).toHaveBeenCalledWith(mockToken);
@@ -124,7 +124,7 @@ describe("SwapAmountInput", () => {
     render(
       <SwapContext.Provider value={mockContextValue}>
         <SwapAmountInput label="To" token={mockToken} type="to" />
-      </SwapContext.Provider>
+      </SwapContext.Provider>,
     );
 
     expect(mockContextValue.setToToken).toHaveBeenCalledWith(mockToken);

diff --git a/src/swap/components/SwapAmountInput.tsx b/src/swap/components/SwapAmountInput.tsx
@@ -1,10 +1,10 @@
-import { useCallback, useContext, useEffect, useMemo } from "react";
+import { useCallback, useContext, useEffect, useMemo } from 'react';
 
-import { isValidAmount } from "../utils";
-import { TokenChip } from "../../token";
-import { cn } from "../../utils/cn";
-import { SwapContext } from "../context";
-import type { SwapAmountInputReact } from "../types";
+import { isValidAmount } from '../utils';
+import { TokenChip } from '../../token';
+import { cn } from '../../utils/cn';
+import { SwapContext } from '../context';
+import type { SwapAmountInputReact } from '../types';
 
 export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
   const {
@@ -17,21 +17,21 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
   } = useContext(SwapContext);
 
   const amount = useMemo(() => {
-    if (type === "to") {
+    if (type === 'to') {
       return toAmount;
     }
     return fromAmount;
   }, [type, toAmount, fromAmount]);
 
   const setAmount = useMemo(() => {
-    if (type === "to") {
+    if (type === 'to') {
       return setToAmount;
     }
     return setFromAmount;
   }, [type, setToAmount, setFromAmount]);
 
   const setToken = useMemo(() => {
-    if (type === "to") {
+    if (type === 'to') {
       return setToToken;
     }
     return setFromToken;
@@ -43,7 +43,7 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
         setAmount?.(event.target.value);
       }
     },
-    [setAmount]
+    [setAmount],
   );
 
   useEffect(() => {
@@ -55,8 +55,8 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
   return (
     <div
       className={cn(
-        "box-border flex w-full flex-col items-start",
-        "gap-[11px] border-b border-solid bg-[#FFF] p-4"
+        'box-border flex w-full flex-col items-start',
+        'gap-[11px] border-b border-solid bg-[#FFF] p-4',
       )}
       data-testid="ockSwapAmountInput_Container"
     >