fix formatting

src/app/global.css

@@ -51,7 +51,6 @@ a {
 svg {
   display: block;
   overflow: visible;
-  vertical-align: middle;
 }
 
 ul {
@@ -64,22 +63,6 @@ ul {
   z-index: 0;
 }
 
-.ockConnectWallet_Container span {
-  color: #030712;
-}
-
-/* i believe this is necessary because 
-of a div added by rainbowkit provider */
-body > div {
-  height: 100%;
-  max-width: 100vw;
-  box-sizing: border-box;
-}
-
 a {
   text-decoration: none;
 }
-
-.templateSection > div {
-  max-width: 100%;;
-}

src/components/OnchainStoreItem.test.tsx

@@ -1,23 +1,23 @@
-import { render, screen } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
-import OnchainStoreItem from "./OnchainStoreItem";
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import OnchainStoreItem from './OnchainStoreItem';
 
 const mockProduct = {
-  id: "1",
-  name: "Sample Product",
+  id: '1',
+  name: 'Sample Product',
   price: 19.99,
-  image: "https://example.com/image.jpg",
+  image: 'https://example.com/image.jpg',
 };
 
-vi.mock("./QuantityInput", () => {
+vi.mock('./QuantityInput', () => {
   return {
     default: ({ productId }: { productId: string }) => (
       <input data-testid={`quantity-input-${productId}`} />
     ),
   };
 });
 
-vi.mock("next/image", () => {
+vi.mock('next/image', () => {
   return {
     default: ({
       src,
@@ -33,17 +33,17 @@ vi.mock("next/image", () => {
   };
 });
 
-describe("OnchainStoreItem", () => {
-  it("should render product information correctly", () => {
+describe('OnchainStoreItem', () => {
+  it('should render product information correctly', () => {
     render(<OnchainStoreItem {...mockProduct} />);
 
-    expect(screen.getByText("Sample Product")).toBeInTheDocument();
-    expect(screen.getByText("19.99 USDC")).toBeInTheDocument();
-    const imageElement = screen.getByAltText("123");
+    expect(screen.getByText('Sample Product')).toBeInTheDocument();
+    expect(screen.getByText('19.99 USDC')).toBeInTheDocument();
+    const imageElement = screen.getByAltText('123');
     expect(imageElement).toBeInTheDocument();
-    expect(imageElement).toHaveAttribute("src", mockProduct.image);
-    expect(imageElement).toHaveAttribute("width", "400");
-    expect(imageElement).toHaveAttribute("height", "400");
-    expect(screen.getByTestId("quantity-input-1")).toBeInTheDocument();
+    expect(imageElement).toHaveAttribute('src', mockProduct.image);
+    expect(imageElement).toHaveAttribute('width', '400');
+    expect(imageElement).toHaveAttribute('height', '400');
+    expect(screen.getByTestId('quantity-input-1')).toBeInTheDocument();
   });
 });

tsconfig.json

@@ -11,7 +11,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "preserve",
     "incremental": true,
     "plugins": [
       {