Estoy usando nextjs, firebase para construir mi proyecto, la idea del proyecto es una gestión de proyectos híbrida, el usuario puede crear un proyecto con muchos tableros y guardar tareas dentro de él: IU del tablero
Quiero guardar el tablero de esta manera: captura de pantalla de Firebase
El código:
Así es como se ve la matriz de la placa y los estados del proyecto:
const [projectFields, setProjectFields] = useState({ title: '', details: '', date: '', }); const [boardFields, setboardFields] = useState([ { title: '', type: '', columns: [ { name: "backlog" }, { name: "In progress" }, { name: "In review" } ] }, ]);función enviarProyecto:
const sendProject = async () => { if (loading) return; setLoading(true); const docRef = await addDoc(collection(db, "projects"), { id: session.user.uid, projectDetails: projectFields, boards: boardFields, timestamp: serverTimestamp(), }); setLoading(false); setProjectFields({ title: '', details: '', date: '', }) setboardFields({ title: '', type: '', columns: [{}] }) };función sendTask, que actualiza los "tableros" en el documento en firebase incorrectamente:
const sendTask = async () => { if (loading) return; setLoading(true); let object = { id: '1', priority: tasksFields.priority, title: tasksFields.title, date: tasksFields.date, details: tasksFields.details, chat: '0', attachment: '0' } const taskRef = doc(db, "projects", projectId ?? "1"); const newBoards = [...project.boards]; newBoards[boardIndex] = { ...newBoards[boardIndex], columns: { ...newBoards[boardIndex].columns[columnIndex], tasks: [...newBoards[boardIndex].columns[columnIndex].tasks, object] }, } await updateDoc(taskRef, { ...project, boards: newBoards, }); setLoading(false); setTasksFields( { id: '', priority: '', title: '', details: '', date: '', attachment: '0', } ) };aquí está el resultado después de actualizar el documento: imagen de esquema de base de datos incorrecta
No sé cómo actualizarlo correctamente, ¿alguna ayuda por favor? gracias a todos
Encontré la solución 👇:
Función sendTask actualizada:
const sendTask = async () => { if (loading) return; setLoading(true); let object = { id: '1', priority: tasksFields.priority, title: tasksFields.title, date: tasksFields.date, details: tasksFields.details, chat: '0', attachment: '0' } const taskRef = doc(db, "projects", projectId ?? "1"); const newBoard = {...project.boards}; const newColumn = [...project.boards[boardIndex].columns]; newColumn[columnIndex] = { ...newColumn[columnIndex], tasks: [...newColumn[columnIndex].tasks, object] }; newBoard[boardIndex] = {...newBoard[boardIndex], columns: newColumn}; await updateDoc(taskRef, { ...project, boards: newBoard, }); setLoading(false); setTasksFields( { id: '', priority: '', title: '', details: '', date: '', attachment: '0', } ) }; };