feat: disabled remote model when offline mode

joi/src/hooks/useOnlineStatus/index.ts

@@ -0,0 +1,22 @@
+import { useState, useEffect } from 'react'
+
+const useOnlineStatus = () => {
+  const [isOnline, setIsOnline] = useState(navigator.onLine)
+
+  useEffect(() => {
+    const handleOnline = () => setIsOnline(true)
+    const handleOffline = () => setIsOnline(false)
+
+    window.addEventListener('online', handleOnline)
+    window.addEventListener('offline', handleOffline)
+
+    return () => {
+      window.removeEventListener('online', handleOnline)
+      window.removeEventListener('offline', handleOffline)
+    }
+  }, [])
+
+  return { isOnline }
+}
+
+export { useOnlineStatus }

joi/src/hooks/useOnlineStatus/useOnlineStatus.test.ts

@@ -0,0 +1,62 @@
+import { renderHook, act } from '@testing-library/react'
+import { useOnlineStatus } from './index'
+
+describe('useOnlineStatus', () => {
+  beforeEach(() => {
+    jest.spyOn(window, 'addEventListener')
+    jest.spyOn(window, 'removeEventListener')
+  })
+
+  afterEach(() => {
+    jest.restoreAllMocks()
+  })
+
+  it('should initialize with the correct online status', () => {
+    const { result } = renderHook(() => useOnlineStatus())
+    expect(result.current.isOnline).toBe(navigator.onLine)
+  })
+
+  it('should set online status to true when the online event is triggered', () => {
+    const { result } = renderHook(() => useOnlineStatus())
+
+    act(() => {
+      window.dispatchEvent(new Event('online'))
+    })
+
+    expect(result.current.isOnline).toBe(true)
+  })
+
+  it('should set online status to false when the offline event is triggered', () => {
+    const { result } = renderHook(() => useOnlineStatus())
+
+    act(() => {
+      window.dispatchEvent(new Event('offline'))
+    })
+
+    expect(result.current.isOnline).toBe(false)
+  })
+
+  it('should register event listeners on mount and unregister on unmount', () => {
+    const { unmount } = renderHook(() => useOnlineStatus())
+
+    expect(window.addEventListener).toHaveBeenCalledWith(
+      'online',
+      expect.any(Function)
+    )
+    expect(window.addEventListener).toHaveBeenCalledWith(
+      'offline',
+      expect.any(Function)
+    )
+
+    unmount()
+
+    expect(window.removeEventListener).toHaveBeenCalledWith(
+      'online',
+      expect.any(Function)
+    )
+    expect(window.removeEventListener).toHaveBeenCalledWith(
+      'offline',
+      expect.any(Function)
+    )
+  })
+})

joi/src/index.test.ts

@@ -39,5 +39,6 @@ describe('Exports', () => {
     expect(components.useClickOutside).toBeDefined()
     expect(components.useOs).toBeDefined()
     expect(components.useMediaQuery).toBeDefined()
+    expect(components.useOnlineStatus).toBeDefined()
   })
 })

joi/src/index.ts

@@ -19,3 +19,4 @@ export * from './hooks/useTextSelection'
 export * from './hooks/useClickOutside'
 export * from './hooks/useOs'
 export * from './hooks/useMediaQuery'
+export * from './hooks/useOnlineStatus'