ReactJS: Как присвоить переменным результат fetch(список объектов)?

Новичок в js: Необходимо использовать переменные storeProducts(массив объектов) и detailProduct(конкретный объект) далее в программе, но они не видны за пределами getDetails. Как решить данную дилемму? Пробовал присваивать без асинхронной функции и await, но в таком случае, вместо массива объектов возвращают Promise {}.

let tempProducts = [];

async function getDetails(products, product){
  const storeProducts = await fetch('https:/products/').then(res => res.json());
  const detailProduct = await fetch('https:/products/:id').then(res => res.json());
}
getDetails();
Object.keys(storeProducts/*undefined*/).forEach(item => tempProducts.push({ ...item })
  );
const initialState = {
  products: tempProducts,
  productDetails: { ...detailProduct/*undefined*/ }
};

Спасибо за ответ, пардон за банальность вопроса