Handling Asynchronous state

AsyncState.js

const fetchResource = () => fetch('https://pokemons.com').then(r => r.json())
const state = useState(fetchResource);

if (state.promised) {
 return <p>Loading {resourcePath}</p>;
}

if (state.error) {
 return (<p>
 Failed to load {resourcePath}
   <br />
   <h3 style={{ color: 'red' }}>{state.error.toString()}</h3>    
   <br />
   <button onClick={() => state.set(fetchResource)}>Retry</button>
</p>)
}

return (<p>
    Loaded {resourcePath}<br />
   <h3 style={{ color: 'green' }}>{state.name}</h3>
   <h4 style={{ color: 'blue' }}>{state.power}</h4>
   <h5 style={{ color: 'yellow' }}>{state.description}</h5>
</p>);