From 05cb2a9d4ffadddd2e0b86533aa1513bd2d3d3ef Mon Sep 17 00:00:00 2001
From: Nilesh Gupta <guptanilesh2312@gmail.com>
Date: Tue, 25 Jul 2023 13:29:32 +0530
Subject: [PATCH] fix: resolved socket multiple instances getting created

---
 .../space/SpaceBanner/SpaceBanner.tsx         |  2 --
 .../space/SpaceWidget/SpaceWidget.tsx         |  4 +--
 .../dataProviders/SpaceComponentsWrapper.tsx  | 32 +++++++++++++++++++
 .../lib/dataProviders/SpaceDataProvider.tsx   | 13 +++-----
 .../lib/hooks/space/usePushSpaceSocket.tsx    |  1 -
 5 files changed, 37 insertions(+), 15 deletions(-)
 create mode 100644 packages/uiweb/src/lib/dataProviders/SpaceComponentsWrapper.tsx

diff --git a/packages/uiweb/src/lib/components/space/SpaceBanner/SpaceBanner.tsx b/packages/uiweb/src/lib/components/space/SpaceBanner/SpaceBanner.tsx
index 9dd2c647a..bbb0ef8d3 100644
--- a/packages/uiweb/src/lib/components/space/SpaceBanner/SpaceBanner.tsx
+++ b/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 />;
diff --git a/packages/uiweb/src/lib/components/space/SpaceWidget/SpaceWidget.tsx b/packages/uiweb/src/lib/components/space/SpaceWidget/SpaceWidget.tsx
index 12edd0a70..a3534585b 100644
--- a/packages/uiweb/src/lib/components/space/SpaceWidget/SpaceWidget.tsx
+++ b/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;
diff --git a/packages/uiweb/src/lib/dataProviders/SpaceComponentsWrapper.tsx b/packages/uiweb/src/lib/dataProviders/SpaceComponentsWrapper.tsx
new file mode 100644
index 000000000..db1c888e6
--- /dev/null
+++ b/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>
+  );
+};
diff --git a/packages/uiweb/src/lib/dataProviders/SpaceDataProvider.tsx b/packages/uiweb/src/lib/dataProviders/SpaceDataProvider.tsx
index 76612e2e4..8c208260d 100644
--- a/packages/uiweb/src/lib/dataProviders/SpaceDataProvider.tsx
+++ b/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>
diff --git a/packages/uiweb/src/lib/hooks/space/usePushSpaceSocket.tsx b/packages/uiweb/src/lib/hooks/space/usePushSpaceSocket.tsx
index 86a56f92f..6876bb5d0 100644
--- a/packages/uiweb/src/lib/hooks/space/usePushSpaceSocket.tsx
+++ b/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*/