React: вопрос по архитектуре работы с props и локальными состояниями

Есть компонент LoginForm, который на вход получает среди свойств и props.notification, содержащий информацию о нотификациях(предупреждениях, ошибках) и т.д., которая отображается пользователю.

Если пользователь в форме начинает вводить какой-то текст, то полученные нотификации больше не отображаются. Но если нотификации были изменены, то начинают отображаться снова.

Реализовал это следующим способом (оставил только относящийся к этому функционалу код, чтобы не захламлять экран)

const LoginForm = (props) => {
    // контроль состояний
    const [notification, setNotification] = useState(undefined);

    // эффект: отслеживание изменения нотификаций от родителя
    useEffect(() => {
        setNotification(props.notification);
    }, [props.notification])
   
    // событие: изменение полей
    const onFieldsChange = () => {
        // сбросить нотификации
        setNotification(undefined);
    }

    // отрисовать компонент
    return (...);
};

такие вопросы:

1. можно ли обойтись без useEffect
2. не дичь ли я закодил для реализации этого функционала (можно было бы проще, но тогда этот компонент должен был бы общаться с данными напрямую, хотя ими заведует его родитель - некоторый конечный автомат, а LoginForm обычная форма, которая ни о чем не знает)
3. насколько вообще мой подход уместен, а именно:

• компонент формы (всякие поля, заполняемые пользователем и т.п.) должен знать только о данных, которые вводят ему, как их обрабатывать, корректировать и т.д.

• то, что с данными творится дальше компонент знать не должен (а значит и не должен иметь доступ к этим данным или другим служебным механизмам)

• компонент не должен знать откуда он получает props (понятно, что от родителя, но как они попали к родителю - сгенерировал ли он их сам или получил откуда-то) и модифицировать эти данные для своих локальных нужд тоже не должен (только копию данных)