dh_demo

DreamHanks demo project
git clone git://git.lair.cx/dh_demo
Log | Files | Refs | README

SocketContext.tsx (1090B)

      1 import { SocketClient } from '@/lib/sockets'
      2 import { useRouter } from 'next/router'
      3 import { createContext, ReactNode, useContext, useEffect, useMemo, useReducer, useRef } from 'react'
      4 
      5 const SocketContext = createContext<SocketClient>(null as any)
      6 
      7 export function SocketProvider ({ children }: { children: ReactNode }) {
      8   const router = useRouter()
      9   const client = useMemo(() => new SocketClient(), [])
     10 
     11   useEffect(() => {
     12     let connTimeout: any
     13 
     14     if (client.isConnected) {
     15       return
     16     }
     17 
     18     const tryConnect = () => {
     19       client.connect()
     20         .then(() => {
     21 
     22         }, () => {
     23           connTimeout = setTimeout(tryConnect, 1000)
     24         })
     25     }
     26 
     27     tryConnect()
     28 
     29     return () => {
     30       if (connTimeout != null) {
     31         clearTimeout(connTimeout)
     32       }
     33     }
     34   }, [])
     35 
     36   useEffect(() => {
     37     client.wait()
     38       .then(() => client.changePath(router.asPath))
     39   }, [router.asPath])
     40 
     41   return (
     42     <SocketContext.Provider value={client}>
     43       {children}
     44     </SocketContext.Provider>
     45   )
     46 }
     47 
     48 export function useSocket () {
     49   return useContext(SocketContext)
     50 }