feat: add SSR safe for useHash hook

src/misc/isServer.ts

@@ -0,0 +1 @@
+export const isServer = () => typeof window === 'undefined';

src/useHash.ts

@@ -1,25 +1,26 @@
-import { useCallback, useState } from 'react';
-import useLifecycles from './useLifecycles';
+import { useCallback, useEffect, useState } from 'react';
 import { off, on } from './misc/util';
+import { isServer } from './misc/isServer';
 
 /**
  * read and write url hash, response to url hash change
  */
+
 export const useHash = () => {
-  const [hash, setHash] = useState(() => window.location.hash);
+  const [hash, setHash] = useState(() => (isServer() ? '' : window.location.hash));
 
   const onHashChange = useCallback(() => {
     setHash(window.location.hash);
   }, []);
 
-  useLifecycles(
-    () => {
-      on(window, 'hashchange', onHashChange);
-    },
-    () => {
+  useEffect(() => {
+    if (isServer()) return;
+    on(window, 'hashchange', onHashChange);
+
+    return () => {
       off(window, 'hashchange', onHashChange);
-    }
-  );
+    };
+  }, []);
 
   const _setHash = useCallback(
     (newHash: string) => {

tests/useHash.test.ts

@@ -1,5 +1,9 @@
 import { renderHook, act } from '@testing-library/react-hooks';
 import { useHash } from '../src/useHash';
+import { isServer } from '../src/misc/isServer';
+
+jest.mock('../src/misc/isServer');
+const mockIsServer = isServer as jest.MockedFunction<typeof isServer>;
 
 (global as any).window = Object.create(window);
 let mockHash = '#';
@@ -18,9 +22,20 @@ Object.defineProperty(window, 'location', {
 });
 
 beforeEach(() => {
+  mockIsServer.mockReturnValue(false);
   window.location.hash = '#';
 });
 
+test('returns an empty hash when rendered on the server', () => {
+  mockIsServer.mockReturnValue(true);
+  window.location.hash = '#abc';
+
+  const { result } = renderHook(() => useHash());
+
+  const hash = result.current[0];
+  expect(hash).toBe('');
+});
+
 test('returns current url hash', () => {
   window.location.hash = '#abc';