Fix getMints()

src/App.tsx

@@ -12,7 +12,6 @@ import {
   getCouncilSize,
   getVotes,
 } from "./lib/election";
-import { getAssets, getStorageProviders } from "./lib/storage";
 import {
   getStashes,
   getNominators,

src/components/Tokenomics/Groups.tsx

@@ -7,7 +7,7 @@ const mJoy = (joy: number) => (joy ? (joy / 1000000).toFixed(3) : ``);
 
 const Groups = (props: { price: nubmer; workers: {}; mints: number[] }) => {
   const { mints, workers, price } = props;
-  if (!mints?.length) return <div />;
+  if (!mints[4]) return <div />;
   return (
     <div className="d-flex flex-wrap">
       <Group

src/components/Tokenomics/Overview.tsx

@@ -4,7 +4,7 @@ import { Table } from "react-bootstrap";
 import { Tokenomics } from "../../types";
 
 const mJoy = (joy: number) =>
-  joy ? (joy / 1000000).toFixed(3) + ` M JOY` : `Loading ..`;
+  isNaN(joy) ? `Loading ..` : (joy / 1000000).toFixed(3) + ` M JOY`;
 
 const Overview = (props: { groups: any[]; tokenomics: Tokenomics }) => {
   const { groups, tokenomics, proposals } = props;

src/components/Tokenomics/Spending.tsx

@@ -4,6 +4,7 @@ import { RoleSpending } from "../../types";
 
 const mJoy = (joy: number) => (joy / 1000000).toFixed(3);
 const percent = (joy, total) => ((100 * joy) / total).toFixed(2);
+
 const Spending = (props: { roles: RoleSpending[] }) => {
   const { groups, price } = props;
   if (!groups.length) return <div />;

src/lib/groups.ts

@@ -4,10 +4,12 @@ import { Mint } from "@joystream/types/mint";
 
 export const getMints = async (api: Api, ids: number[]): Promise<Mint[]> => {
   console.debug(`Fetching mints`);
-  let mints: Mint[] = [];
   const getMint = (id: number) => api.query.minting.mints(id);
-  ids.forEach(async (id) => (await getMint(id)).toJSON() as Mint);
-  return Promise.all(mints);
+  const mints: Mint[] = [];
+  await Promise.all(
+    ids.map(async (id) => (mints[id] = (await getMint(id)).toJSON()))
+  );
+  return mints;
 };
 
 export const updateWorkers = async (