fix: resolved socket multiple instances getting created

packages/uiweb/src/lib/components/space/SpaceBanner/SpaceBanner.tsx

@@ -72,8 +72,6 @@ export const SpaceBanner: React.FC<ISpaceBannerProps> = ({
     setSpaceWidgetId(spaceData?.spaceId as string);
   };
 
-  usePushSpaceSocket({ account, env });
-
   // Check if the spaceData is not available, show the skeleton loading effect
   if (!spaceData) {
     return <SpaceBannerLoadingSkeleton />;

packages/uiweb/src/lib/components/space/SpaceWidget/SpaceWidget.tsx

@@ -9,7 +9,7 @@ import { WidgetHeader } from './WidgetHeader';
 import { ISpaceWidgetProps } from '../exportedTypes';
 import { isHostOfSpace, isMemberOfSpace } from './helpers/utils';
 
-import { usePushSpaceSocket, useSpaceData } from '../../../hooks';
+import { useSpaceData } from '../../../hooks';
 
 import { ThemeContext } from '../theme/ThemeProvider';
 
@@ -41,8 +41,6 @@ export const SpaceWidget: React.FC<ISpaceWidgetProps> = (
   const { getSpaceInfo, setSpaceInfo, account, env, spaceInfo } =
     useSpaceData();
 
-  usePushSpaceSocket({ account, env });
-
   useEffect(() => {
     if (!spaceId) {
       return;

packages/uiweb/src/lib/dataProviders/SpaceComponentsWrapper.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { usePushSpaceSocket, useSpaceData, useSpaceNotificationSocket } from '../hooks';
+
+export interface ISpacesComponentsWrapperProps {
+  children: React.ReactNode;
+}
+
+export const SpaceComponentWrapper = ({
+  children,
+}: ISpacesComponentsWrapperProps) => {
+  const {
+    account,
+    env,
+    acceptSpaceRequest,
+    connectSpaceRequest
+  } = useSpaceData();
+
+  useSpaceNotificationSocket({
+    account,
+    env,
+    acceptSpaceRequest,
+    connectSpaceRequest,
+  });
+
+  usePushSpaceSocket({ account, env });
+
+  return (
+    <div>
+      {children}
+    </div>
+  );
+};

packages/uiweb/src/lib/dataProviders/SpaceDataProvider.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useState } from 'react';
 import { SignerType, SpaceDTO, SpaceIFeeds } from '@pushprotocol/restapi';
 
+import { SpaceComponentWrapper } from './SpaceComponentsWrapper';
 import { SpacesUI } from '../components';
 import { ThemeContext } from '../components/space/theme/ThemeProvider';
 import { ISpacesTheme, lightTheme } from '../components/space/theme';
@@ -384,20 +385,14 @@ export const SpacesUIProvider = ({
   const PROVIDER_THEME = Object.assign({}, lightTheme, theme);
 
   spaceUI.init();
-  useSpaceNotificationSocket({
-    account,
-    env,
-    acceptSpaceRequest,
-    connectSpaceRequest,
-  });
-  // usePushSpaceSocket({ account, env });
-  // console.log("isPushSDKSocketConnected", isPushSDKSocketConnected);
 
   return (
     <LivepeerConfig client={livepeerClient}>
       <ThemeContext.Provider value={PROVIDER_THEME}>
         <SpaceDataContext.Provider value={value}>
-          {children}
+          <SpaceComponentWrapper>
+            {children}
+          </SpaceComponentWrapper>  
         </SpaceDataContext.Provider>
       </ThemeContext.Provider>
     </LivepeerConfig>

packages/uiweb/src/lib/hooks/space/usePushSpaceSocket.tsx

@@ -48,7 +48,6 @@ export const usePushSpaceSocket = ({
     );
 
     pushSpaceSocket?.on('SPACES', async (spaceInfo: SpaceDTO) => {
-      console.log(spaceInfo, spaceRequests, popularSpaces, mySpaces);
 
       /* TODO: In future, store all space info in SpaceInfo state itself, and mySpaces, popularSpaces, requests only store spaceId
         so as to only update spaceInfo once and it should reflect at every place*/