CFE-5 initialize socket provider

example.env.local

@@ -7,6 +7,7 @@ NEXT_PUBLIC_PRIMARY_MAIN = "#1b4332"
 NEXT_PUBLIC_SECONDARY_MAIN = "#800e13"
 
 NEXT_PUBLIC_BASE_URL = "https://crm.witel.ir"
+NEXT_PUBLIC_SERVER_SOCKET_URL = "wss://crm.witel.ir"
 NEXT_PUBLIC_POWERED_BY_URL = "https://witel.ir"
 
 NODE_ENV = "development"

package.json

@@ -46,6 +46,7 @@
     "react-dom": "^18.2.0",
     "react-toastify": "^9.1.3",
     "sass": "^1.62.0",
+    "socket.io-client": "^4.7.2",
     "stylis": "^4.1.3",
     "stylis-plugin-rtl": "^2.1.1",
     "swr": "^2.1.5",

src/lib/app/contexts/socket.jsx

@@ -0,0 +1,14 @@
+import {createContext, useMemo} from "react";
+import {io} from "socket.io-client";
+
+export const SocketContext = createContext()
+
+export const SocketProvider = ({children}) => {
+    const socket = useMemo(() => io(process.env.NEXT_PUBLIC_SERVER_SOCKET_URL, {
+        autoConnect: false,
+        auth: {
+            token: ""
+        }
+    }), [])
+    return <SocketContext.Provider value={{socket}}>{children}</SocketContext.Provider>
+}

src/lib/app/hooks/useSocket.jsx

@@ -0,0 +1,10 @@
+import {useContext} from "react";
+import {SocketContext} from "@/lib/app/contexts/socket";
+
+const useSocket = () => {
+    const {socket} = useContext(SocketContext)
+
+    return {socket}
+}
+
+export default useSocket

src/pages/_app.jsx

@@ -7,10 +7,12 @@ import {UserProvider} from "@/lib/app/contexts/user";
 import "moment/locale/fa";
 import {NextIntlProvider} from "next-intl";
 import TitlePage from "@/core/components/TitlePage";
+import {SocketProvider} from "@/lib/app/contexts/socket";
 
 const App = ({Component, pageProps}) => {
 
     return (<>
+        <SocketProvider>
             <UserProvider>
                 <LanguageProvider>
                     <NextIntlProvider locale={pageProps.locale} messages={pageProps.messages || {}}>
@@ -25,6 +27,7 @@ const App = ({Component, pageProps}) => {
                     </NextIntlProvider>
                 </LanguageProvider>
             </UserProvider>
+        </SocketProvider>
     </>)
 };