Merge pull request #1 from SamHoque/storage-loading-state

♻️ Added a loading state to the storage hook

src/hook.ts

@@ -34,6 +34,7 @@ export function useStorage<T = any>(
     readonly setRenderValue: React.Dispatch<React.SetStateAction<T>>
     readonly setStoreValue: (v: T) => Promise<null>
     readonly remove: () => void
+    readonly isLoading: boolean
   }
 ]
 export function useStorage<T = any>(
@@ -45,6 +46,7 @@ export function useStorage<T = any>(
     readonly setRenderValue: React.Dispatch<React.SetStateAction<T | undefined>>
     readonly setStoreValue: (v?: T) => Promise<null>
     readonly remove: () => void
+    readonly isLoading: boolean
   }
 ]
 export function useStorage<T = any>(rawKey: RawKey, onInit?: Setter<T>) {
@@ -54,7 +56,8 @@ export function useStorage<T = any>(rawKey: RawKey, onInit?: Setter<T>) {
 
   // Render state
   const [renderValue, setRenderValue] = useState(onInit)
-
+  const [isLoading, setIsLoading] = useState(true)
+
   // Use to ensure we don't set render state after unmounted
   const isMounted = useRef(false)
 
@@ -95,6 +98,7 @@ export function useStorage<T = any>(rawKey: RawKey, onInit?: Setter<T>) {
       [key]: (change) => {
         if (isMounted.current) {
           setRenderValue(change.newValue)
+          setIsLoading(false)
         }
       }
     }
@@ -110,6 +114,7 @@ export function useStorage<T = any>(rawKey: RawKey, onInit?: Setter<T>) {
       } else {
         setRenderValue(v !== undefined ? v : onInit)
       }
+      setIsLoading(false)
     })
 
     return () => {