foo.js

const addAccountToTransactions = (txs, accounts) => (
  txs.map(tx => (
    // add the relationship
    {
      ...tx,
      account: accounts[tx.accountKey]
    }
  ))
)

const TransactionsWithAccounts = () => (
  // these fetch in parallel
  <Ref path="/accounts">
    {(accounts) => (
      <Ref path="/transactions" list={true}>
        {(txs) => (
          // txs will be an array
          accounts.error || txs.error ? (
            <ErrorMessages errors={[ accounts.error, txs.error ]}/>
          ) : accounts.loaded && txs.loaded ? (
            children(addAccountToTransactions(transactions.value, accounts.value))
          ) : (
            <Loading/>
          )
        )}
      </Ref>
    )}
  </Ref>
)


// now it's super easy to just grab that data from anywhere, even w/ the foreign relationship!
const TransactionsDashboard = () => (
  <Block>
    <Header>Transactions</Header>
    <TransactionsWithAccounts>
      {(txs) => (
        <Table txs={formatTransactions(txs)}/>
      )}
    </TransactionsWithAccounts>
  </Block>
)