From af75c227f6f4d59da74637dcd4498f5380dbeeb9 Mon Sep 17 00:00:00 2001
From: Curtis Olson <curtis@colony.io>
Date: Wed, 15 Jan 2020 12:26:27 -0600
Subject: [PATCH] Fix domain balances in colony home

---
 .../ColonyFunding/ColonyFunding.tsx           | 42 ++++++++++++++-----
 1 file changed, 31 insertions(+), 11 deletions(-)

diff --git a/src/modules/dashboard/components/ColonyHome/ColonyFunding/ColonyFunding.tsx b/src/modules/dashboard/components/ColonyHome/ColonyFunding/ColonyFunding.tsx
index b3ccb1d20d..c6c2ff8e7a 100644
--- a/src/modules/dashboard/components/ColonyHome/ColonyFunding/ColonyFunding.tsx
+++ b/src/modules/dashboard/components/ColonyHome/ColonyFunding/ColonyFunding.tsx
@@ -7,12 +7,17 @@ import { DialogType } from '~core/Dialog';
 import withDialog from '~core/Dialog/withDialog';
 import Heading from '~core/Heading';
 import { DomainsMapType } from '~types/index';
-import { useLoggedInUser, FullColonyFragment } from '~data/index';
+import {
+  useLoggedInUser,
+  FullColonyFragment,
+  useTokenBalancesForDomainsQuery,
+} from '~data/index';
 
 import { canMoveTokens as canMoveTokensCheck } from '../../../../admin/checks';
 import TokenItem from './TokenItem';
 
 import styles from './ColonyFunding.css';
+import { SpinnerLoader } from '~core/Preloaders';
 
 const MSG = defineMessages({
   buttonFund: {
@@ -49,7 +54,7 @@ const ColonyFunding = ({
     [walletAddress, domains],
   );
 
-  const { colonyAddress, tokens } = colony;
+  const { colonyAddress, tokens: colonyTokens } = colony;
 
   const handleMoveTokens = useCallback(
     () =>
@@ -63,6 +68,17 @@ const ColonyFunding = ({
     [openDialog, colonyAddress, currentDomainId],
   );
 
+  const {
+    data,
+    loading: isLoadingTokenBalances,
+  } = useTokenBalancesForDomainsQuery({
+    variables: {
+      colonyAddress,
+      domainIds: [currentDomainId],
+      tokenAddresses: colonyTokens.map(({ address }) => address),
+    },
+  });
+
   return (
     <div>
       <Heading appearance={{ size: 'normal', weight: 'bold' }}>
@@ -77,15 +93,19 @@ const ColonyFunding = ({
           </span>
         )}
       </Heading>
-      <ul>
-        {tokens.map(token => (
-          <TokenItem
-            currentDomainId={currentDomainId}
-            key={token.address}
-            token={token}
-          />
-        ))}
-      </ul>
+      {data && !isLoadingTokenBalances ? (
+        <ul>
+          {data.colony.tokens.map(token => (
+            <TokenItem
+              currentDomainId={currentDomainId}
+              key={token.address}
+              token={token}
+            />
+          ))}
+        </ul>
+      ) : (
+        <SpinnerLoader />
+      )}
     </div>
   );
 };