React Native, use persistent state via a hook

usePersistentState.js

import React, { useState, useEffect } from 'react'
import { useAsyncStorage } from '@react-native-community/async-storage'

export default function usePersistedState(initialValue, { key }) {
  if (!key) {
    throw new Error('key is required');
  }
  const [localState, setLocalState] = useState(initialValue)
  const { getItem, setItem } = useAsyncStorage('@' + key)

  // load persisted state, if present
  useEffect(() => {
    getItem().then(value => {
      // console.log('got value', value)
      setLocalState(JSON.parse(value))
    })
  }, [])

  useEffect(() => {
    setItem(JSON.stringify(localState)) // is async
  }, [localState])

  return [localState, setLocalState]
}