How to cache ReactJS fetch json results for a period of time in localStorage

In a ReactJS app i was calling an external API to get some news and display to the user. Every time this page was loading i had this external API call.

So i need to make a small 5 minute caching of the result in order to avoid external calls.

In my function i have a function getContent that fetch the result and it is called by an effect.

You need to replace the URL and the results layout with your own data.

import React, { useMemo, useEffect,useState } from "react";
export function GoogleNewsWidget() {
 //loader animation - status
 const [loading, setLoading] = useState(false);
 // our data 
 const [data, setData] = useState({});
async function getContent() {
   // set loading true 
   setLoading(true);
  
   // fetch url
  const metadataResponse = await         fetch(process.env.REACT_APP_NEWS_URL, {
         method: 'GET', 
         mode: 'cors', 
        cache: 'default'
   });
  
  // get response
  const resp = await metadataResponse.json();
   if (resp!==null) setData(resp);
   
   //stop the animation
   setLoading(false);
}
 useEffect(() => {…