firebase.js

import React, { Component } from 'react';
import { map } from 'lodash';

import { database } from '../services/firebase';

export default class Tasks extends Component {

    state = {
        tasks: {},
        empty: null
    }

    componentDidMount() {
        //work_uid vem dos parâmetros da rota (react-router-dom)
        this.setState({ work_uid: this.props.match.params.uid })
        let tasks = {};

        //essas 2 referências funcionam, atualizando o componente quando são alterados no Firebase automagicamente.
        database.ref('categories')
            .on('value', snap => this.setState({ categoryOptions: Object.keys(snap.val()) }))

        database.ref('users')
            .on('value', snap => this.setState({ userOptions: snap.val() }))

        //é aqui que mora o problema
        database.ref('works').child(this.props.match.params.uid).child('tasks')
            .on('value', snap => {
                   //se não tiver registros no node /works/tasks, altera o estado pra notificar o usuário
                if (!snap.val()) this.setState({ empty: true })
                   //se tiver dados, as chaves do objeto resultante da primeira consulta são extraídas
                   //e iteradas pra buscar no node /tasks os dados equivalentes à aquela chave.
                if (snap.val()) return map(Object.keys(snap.val()), taskUID => {
                    database.ref('tasks').child(taskUID).on('value', task => {
                        //adiciona o registro encontrado no objeto tasks
                        tasks[taskUID] = task.val()
                    })
                })
            })
           // passa tasks pro estado da aplicação
        return this.setState({ tasks })
    }

   //remove os listeners
   componentWillUnmount() {
        const refs = ['works', 'tasks', 'categories', 'users']
        refs.forEach(element => {
            database.ref(element).off();
        })
    }

    render() {
        if (!this.state.tasks && !this.state.empty) {
		   	return <p>Carregando</p>
		}
		
		if (this.state.empty) {
			return <p>Nenhuma tarefa registrada</p>
		}
            
		return (
           <div>
			{this.state.tasks.forEach(task => {
				return <p>{task.name}</p>
			})}
			</div>
            )
    }

}

O real problema era a forma como o state era manipulado. Foi solucionado da seguinte forma:

this.setState({ tasks: { ...this.state.tasks, [item]: task.val() } })