Comment by vlasev

    {name}{confirmation}{request}

is basically a hidden render loop. If you had something like

    const inputs = [name, confirmation, request]

and rendered that via inputs.map() (or just {inputs}), it would have complained about the missing key prop. React can't seem identify which state belongs to which item in the "iteration".

Using a conditional render like

   {nameInput}
   {isBob ? confirmationInput : null}
   {requestInput}

seems to avoid the issue as well, without using a key prop. So yeah, beware of hidden loops.