React, компонент

[od0201]

Есть такой код в "первом" компоненте

const [deleted,setDeleted]=useState(false)
const deleteHandler=()=>{  
    const conf = window.confirm(`Вы уверены что ходите удалить "установку"?`);
    if(conf){
      deleteDoc(doc(db,"todos",props.todoId)).then(() => {
          console.log("Document successfully deleted!");
          setDeleted(true)
      }).catch((error) => {
          console.error("Error removing document: ", error);          
      }); 
    }
  }

мне во "втором" компоненте нужно также иметь возможность удалить данную запить. Как мне правильнее сделать? Вынести функцию в Redux, дублировать эту функцию во "втором" компоненте или другой вариант. Спасибо.

[Aetae]

Какие проблемы просто вынести функцию и импортировать куда надо?

export async function deleteTodo(todoId) {
  const conf = window.confirm(`Вы уверены что ходите удалить "установку"?`);

  if(conf){
    return deleteDoc(doc(db,"todos", todoId)).then(() => {
      console.log("Document successfully deleted!");
      return true;
    }, (error) => {
      console.error("Error removing document: ", error); 
      return false;
    });
  }

  return false;
}

Если нужно добавть state - обычный кастомный хук вам в помощь:

function useDeleteTodo() {
  const [deleted, setDeleted] = useState(false);
  const deleteHandler = useCallback((todoId) => {
    deleteTodo(todoId).then(setDeleted);
  }, []);
  return [deleted, deleteHandler];
}

[od0201]

Проблемы в том, что "плаваю" и хотелось бы знать как правильно делать

Все работает, большое спасибо

[ksa]

хотелось бы знать как правильно делать

"Правильно" у всех свое...

Не дублировать код - уже шаг к правильному.