diff --git a/bun.lockb b/bun.lockb
index ba474ce..4eb0b3c 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 73bb358..a33a5ba 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "test:coverage": "vitest run --coverage"
   },
   "dependencies": {
-    "@coinbase/onchainkit": "^0.33.6",
+    "@coinbase/onchainkit": "^0.35.6",
     "next": "^14.2.5",
     "permissionless": "^0.1.26",
     "react": "^18",
diff --git a/src/app/global.css b/src/app/global.css
index 81feaad..dc5a0a0 100644
--- a/src/app/global.css
+++ b/src/app/global.css
@@ -81,5 +81,5 @@ a {
 }
 
 .templateSection > div {
-  max-width: 100%;;
-}
\ No newline at end of file
+  max-width: 100%;
+}
diff --git a/src/components/LoginButton.test.tsx b/src/components/LoginButton.test.tsx
index 5722f9c..3c68bff 100644
--- a/src/components/LoginButton.test.tsx
+++ b/src/components/LoginButton.test.tsx
@@ -1,6 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { beforeAll, describe, expect, it } from 'vitest';
 import { http, WagmiProvider, createConfig } from 'wagmi';
 import { base } from 'wagmi/chains';
 import { mock } from 'wagmi/connectors';
@@ -35,6 +35,22 @@ const renderWithProviders = (component: JSX.Element) => {
 };
 
 describe('LoginButton', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'matchMedia', {
+      writable: true,
+      value: (query: string) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: () => {}, // Deprecated
+        removeListener: () => {}, // Deprecated
+        addEventListener: () => {},
+        removeEventListener: () => {},
+        dispatchEvent: () => false,
+      }),
+    });
+  });
+
   it('should render', () => {
     renderWithProviders(<LoginButton />);
     const walletWrapper = screen.getByTestId('ockConnectWallet_Container');
diff --git a/src/components/SignupButton.test.tsx b/src/components/SignupButton.test.tsx
index 4675cac..076f77d 100644
--- a/src/components/SignupButton.test.tsx
+++ b/src/components/SignupButton.test.tsx
@@ -1,6 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { beforeAll, describe, expect, it } from 'vitest';
 import { http, WagmiProvider, createConfig } from 'wagmi';
 import { base } from 'wagmi/chains';
 import { mock } from 'wagmi/connectors';
@@ -35,6 +35,21 @@ const renderWithProviders = (component: JSX.Element) => {
 };
 
 describe('SignupButton', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'matchMedia', {
+      writable: true,
+      value: (query: string) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: () => {}, // Deprecated
+        removeListener: () => {}, // Deprecated
+        addEventListener: () => {},
+        removeEventListener: () => {},
+        dispatchEvent: () => false,
+      }),
+    });
+  });
   it('should render', () => {
     renderWithProviders(<SignupButton />);
     const wallet = screen.getByTestId('ockConnectWallet_Container');
diff --git a/src/components/TransactionWrapper.test.tsx b/src/components/TransactionWrapper.test.tsx
index 7d32bb6..15ea979 100644
--- a/src/components/TransactionWrapper.test.tsx
+++ b/src/components/TransactionWrapper.test.tsx
@@ -1,6 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { beforeAll, describe, expect, it } from 'vitest';
 import { http, WagmiProvider, createConfig } from 'wagmi';
 import { base } from 'wagmi/chains';
 import { mock } from 'wagmi/connectors';
@@ -34,6 +34,21 @@ const renderWithProviders = (component: JSX.Element) => {
 };
 
 describe('TransactionWrapper', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'matchMedia', {
+      writable: true,
+      value: (query: string) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: () => {}, // Deprecated
+        removeListener: () => {}, // Deprecated
+        addEventListener: () => {},
+        removeEventListener: () => {},
+        dispatchEvent: () => false,
+      }),
+    });
+  });
   it('should renders', () => {
     renderWithProviders(
       <TransactionWrapper address="0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266" />,
diff --git a/src/components/WalletWrapper.test.tsx b/src/components/WalletWrapper.test.tsx
index 2f51658..2ed54f6 100644
--- a/src/components/WalletWrapper.test.tsx
+++ b/src/components/WalletWrapper.test.tsx
@@ -1,6 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { beforeAll, describe, expect, it } from 'vitest';
 import { http, WagmiProvider, createConfig } from 'wagmi';
 import { base } from 'wagmi/chains';
 import { mock } from 'wagmi/connectors';
@@ -34,6 +34,21 @@ const renderWithProviders = (Component: React.ComponentType) => {
 };
 
 describe('WalletWrapper', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'matchMedia', {
+      writable: true,
+      value: (query: string) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: () => {}, // Deprecated
+        removeListener: () => {}, // Deprecated
+        addEventListener: () => {},
+        removeEventListener: () => {},
+        dispatchEvent: () => false,
+      }),
+    });
+  });
   it('should renders', () => {
     renderWithProviders(WalletWrapper);
     const wallet = screen.getByTestId('ockConnectWallet_Container');