Aktualizace dat podle URL parametrů v úložišti v React Router

V minulé lekci jsme přidali ještě jednu trasu a stránku s formulářem pro editaci dat. Zbývá nám uložit data zadaná do našeho formuláře.

Pro začátek přidáme funkci pro aktualizaci dat produktu updateProduct v forStorage.js. Musíme do ní předat id produktu a změněná data:

forStorage.jsexport async function updateProduct(id, updates) {
  await someNetwork();
}

Dále z úložiště podle klíče 'products' získáme produkty a najdeme ten, který měníme podle jeho id. V případě neúspěchu vyhodíme chybu:

forStorage.jsexport async function updateProduct(id, updates) {
  await someNetwork();
  let products = await localforage.getItem('products');
  let product = products.find((product) => product.id === id);
  if (!product) throw new Error('No product found for this', id);        
}

Poté nám zbývá provést změny v nalezeném produktu a přepsat aktualizovaný seznam v úložišti pomocí naší funkce setProducts:

forStorage.jsexport async function updateProduct(id, updates) {
  await someNetwork();
  let products = await localforage.getItem('products');
  let product = products.find((product) => product.id === id);
  if (!product) throw new Error('No product found for this', id);
  Object.assign(product, updates);
  await setProducts(products);
  return product;
}