Сбросить значение у input'a в дефолтное, приходящее из пропсов

Из пропсов приходит имя, это имя копируется в useState, через onChange я меняю это значение, но так же я могу закрыть инпут и хочу, чтобы в useState оставалось старое значение прешедшее из пропсов, а не измененное через onChange.

setCopy(name) в 12 строчке - хорошая практика или плохая?

const element = document.getElementById("root");

const User = (props) => {
  const { name } = props;

  const [ copy, setCopy ] = React.useState(name);
  const [ isEdit, setIsEdit ] = React.useState(false);

  const edit = () => setIsEdit(true);
  const close = () => {
    setIsEdit(false);
    setCopy(name);
  };
  const change = (event) => setCopy(event.target.value);

  return (
    <>
      {isEdit
        ? <>
            <input type="text" value={copy} onChange={change} />
            <button>Сохранить</button>
            <button onClick={close}>Закрыть</button>
          </>
        : <>
            <h1>Меня зовут {name}</h1>
            <button onClick={edit}>Редактировать</button>
        </>
      }
    </>
  )
};

const App = () => {
  const [ users, setUsers ] = React.useState([]);
  const [ name, setName ] = React.useState("");

  const onName = (event) => {
    setName(event.target.value);
  };

  const addUser = () => {
    setUsers([ ...users, { name: name, id: Date.now() } ]);
    setName("");
  };

  return (
    <>
      <input type="text" onChange={onName} />
      <button disabled={name.length === 0} value={name} onClick={addUser}>Добавить пользователя</button>
      {users.length !== 0 && users.map(item => <User name={item.name} />)}
    </>
  )
};

ReactDOM.render(
  <App />,
  element
);