diff --git a/web/src/context/BusterWebSocket/useBusterWebSocket.tsx b/web/src/context/BusterWebSocket/useBusterWebSocket.tsx
index 61d038b69..699dc7851 100644
--- a/web/src/context/BusterWebSocket/useBusterWebSocket.tsx
+++ b/web/src/context/BusterWebSocket/useBusterWebSocket.tsx
@@ -3,7 +3,7 @@
 import { useMemoizedFn } from 'ahooks';
 import React, { useMemo, useRef } from 'react';
 import { useBusterNotifications } from '../BusterNotifications/BusterNotifications';
-import {
+import type {
   BusterSocketRequest,
   BusterSocketResponse,
   BusterSocketResponseRoute
@@ -18,7 +18,7 @@ import {
 } from '@fluentui/react-context-selector';
 import { SupabaseContextReturnType } from '../Supabase';
 
-const BUSTER_WS_URL = `${process.env.NEXT_PUBLIC_API_URL}/api/v1/ws`;
+const BUSTER_WS_URL = `${process.env.NEXT_PUBLIC_WEB_SOCKET_URL}/api/v1/ws`;
 
 export type BusterOnCallback = {
   callback: BusterSocketResponse['callback'];
diff --git a/web/src/context/BusterWebSocket/useWebSocketCustom.tsx b/web/src/context/BusterWebSocket/useWebSocketCustom.tsx
index a47534430..e403d366f 100644
--- a/web/src/context/BusterWebSocket/useWebSocketCustom.tsx
+++ b/web/src/context/BusterWebSocket/useWebSocketCustom.tsx
@@ -1,3 +1,5 @@
+'use client';
+
 import { useMemoizedFn, useMount, useNetwork, useThrottleFn } from 'ahooks';
 import { useEffect, useRef, useState } from 'react';
 import { ReadyState } from './useBusterWebSocket';