Dev Diaries #3 - Refresh w/ Hook

App-with-Refresh.tsx

export function App<Additional extends AdditionalArgs>(props: AppProps<Additional>): ReactElement {
  const { args, renderFunc } = props;
  const [authData, setAuthData] = useState(JSON.parse(args.authFile as string));

  const API = new DappbotAPI({
    authData,
    setAuthData: (auth) => {
      setAuthData(auth);
      saveAuthToFile(auth);
    },
    dappbotUrl: args.apiUrl
  })

  useEffect(function refreshIfStale() {
    if (API.hasStaleAuth()) {
      API.refreshAuth()
    }
  }, [API, authData])

  return API.hasStaleAuth() ? (
    <Loader message='Refreshing your authData...' />
  ) : (
      renderFunc({
        API, authData, setAuthData, args
      })
    )
}