arthurvi

const itemsFromServer = {
  '1': {
    id: '1',
    value: 'tests',
    isSaving: false,
    otherIdForSavingOnly: '1-1'
  },
  '2': {
    id: '2',
    value: 'another row',

arthurvi

import React from 'react';

const ItemListDispatch = React.createContext(null);

// Call our API here with id, otherIdForSavingOnly, value etc.
async function save(item) {
  await new Promise((resolve) => setTimeout(resolve, 1000));
}

const itemsFromServer = {

arthurvi

const Item = React.memo(function Item({ id, value, isSaving, onChange, onSave }) {
  if (isSaving) {
    return <li>Saving...</li>;
  }

  return (
    <li>
      <input 
        value={value} 
        onChange={(event) => onChange(event.target.value)} 

arthurvi

function ItemList() {
  const [items, setItems] = React.useState(itemsFromServer);

  return (
    <ul>
      {Object.values(items).map((item) => (
        <ItemWrapper 
          key={item.id} 
          item={item} 
          setItems={setItems} 

arthurvi

function ItemList() {
  const [items, setItems] = React.useState(itemsFromServer);

  const handleChange = React.useCallback(
    function handleChange(id, value) { ... },
    [setItems]
  );

  async function handleSave(id) {
    // set isSaving to true

arthurvi

function ItemWrapper({ item, setItems }) {
  const handleChange = React.useCallback(
    function handleChange(value) { ... },
    [item, setItems]
  );

  const handleSave = React.useCallback(
    async function handleSave() {
      // set isSaving to true
      await save(item);

arthurvi

Boolean() or !! (double bang, double negation)?

What's the best way to answer the question "true or false?" in JavaScript

JavaScript does not bother you too much with types (at first), which is both a blessing and a cure. But we all know the Boolean type. Boolean variables can either be true or false. Yes or no.

Every value in JavaScript can be translated into a boolean, true or false. Values that translate to true are truthy, values that translate to false are falsy. Simple.

This is about two ways to make that translation.

arthurvi

{
  "name": "seneca-joi-test",
  "version": "1.0.0",
  "description": "Replicate issue with seneca-joi",
  "main": "server.js",
  "author": "Planl",
  "scripts": {
    "start": "node server.js"
  },
  "dependencies": {