diff --git a/src/@types/index.ts b/src/@types/index.ts
index 1b17bd7..72e1c52 100644
--- a/src/@types/index.ts
+++ b/src/@types/index.ts
@@ -11,19 +11,21 @@ export enum State {
 export interface Status {
   network: string
   currentBlock: number
-  market: State
-  faucet: FaucetStatus | Record<string, never>
-  aquarius: AquariusStatus
-  provider: ProviderStatus
-  subgraph: SubgraphStatus
-  operator: OperatorStatus
-  dataFarming: State
   lastUpdatedOn: number
+  components: {
+    market: ComponentStatusBase
+    faucet: FaucetStatus | Record<string, never>
+    aquarius: AquariusStatus
+    provider: ProviderStatus
+    subgraph: SubgraphStatus
+    operator: OperatorStatus
+    dataFarming: ComponentStatusBase
+  }
 }
 
 export interface ComponentStatusBase {
   status: State
-  statusMessages: string
+  statusMessages: string[]
   response: number
   version: string
 }
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 8d38775..5842a57 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -66,86 +66,61 @@ export default function HomePage(): ReactElement {
         {isLoading ? (
           <div className={styles.loading}>Loading...</div>
         ) : (
-          Object.entries(data || {}).map(([key, value]) => {
-            const networkKey = key
+          Object.entries(data || {}).map(([networkName, value]) => (
+            <Fragment key={networkName}>
+              <h2 className={styles.networkName}>{networkName}</h2>
+              <div className={styles.grid}>
+                {Object.entries(value.components).map(
+                  ([componentName, value]) => (
+                    <div
+                      key={componentName}
+                      className={`${styles.card} ${statusStyle(value.status)}`}
+                    >
+                      <h2 className={styles.titleComponent}>
+                        {statusIcon(value.status)} {componentName}
+                        <code
+                          className={styles.version}
+                          title="deployed version"
+                        >
+                          {value.version}
+                        </code>
+                      </h2>
 
-            return (
-              <Fragment key={networkKey}>
-                <h2 className={styles.networkName}>{networkKey}</h2>
-                <div className={styles.grid}>
-                  {Object.entries(value)
-                    .filter(
-                      // TODO: Remove this filter if we fix this on API level
-                      // Needs a new `components` key under Status response
-                      ([key]) =>
-                        key !== 'currentBlock' &&
-                        key !== 'lastUpdatedOn' &&
-                        key !== 'network' &&
-                        key !== '_id' &&
-                        key !== '__v'
-                    )
-                    .map(([key, value]) => (
-                      <div
-                        key={key}
-                        className={`${styles.card} ${statusStyle(
-                          // TODO: all component states should be of type Status on API level
-                          key === 'market' || key === 'dataFarming'
-                            ? value
-                            : value.status
-                        )}`}
-                      >
-                        <h2 className={styles.titleComponent}>
-                          {statusIcon(
-                            key === 'market' || key === 'dataFarming'
-                              ? value
-                              : value.status
-                          )}{' '}
-                          {key}
-                          <code
-                            className={styles.version}
-                            title="deployed version"
-                          >
-                            {value.version}
-                          </code>
-                        </h2>
+                      {value.statusMessages?.length ? (
+                        <ul className={styles.messages}>
+                          {value.statusMessages.map(
+                            (message: string, i: number) => (
+                              <li key={i} className={styles.statusMessage}>
+                                {message}
+                              </li>
+                            )
+                          )}
+                        </ul>
+                      ) : null}
+                    </div>
+                  )
+                )}
+              </div>
 
-                        {value.statusMessages && value.statusMessages !== '' && (
-                          <ul className={styles.messages}>
-                            {value.statusMessages
-                              .split(',')
-                              .map((message: string, i: number) => (
-                                <li key={i} className={styles.statusMessage}>
-                                  {message}
-                                </li>
-                              ))}
-                          </ul>
-                        )}
-                      </div>
-                    ))}
-                </div>
-
-                <details className={styles.contracts}>
-                  <summary>
-                    <h3 className={styles.titleComponent}>
-                      Deployed Contracts
-                    </h3>
-                  </summary>
-                  <ul>
-                    {Object.entries((addresses as any)[networkKey]).map(
-                      ([key, value]) =>
-                        key !== 'chainId' &&
-                        key !== 'startBlock' && (
-                          <li key={key}>
-                            <code className={styles.key}>{key}</code>:{' '}
-                            <code>{JSON.stringify(value)}</code>
-                          </li>
-                        )
-                    )}
-                  </ul>
-                </details>
-              </Fragment>
-            )
-          })
+              <details className={styles.contracts}>
+                <summary>
+                  <h3 className={styles.titleComponent}>Deployed Contracts</h3>
+                </summary>
+                <ul>
+                  {Object.entries((addresses as any)[networkName]).map(
+                    ([key, value]) =>
+                      key !== 'chainId' &&
+                      key !== 'startBlock' && (
+                        <li key={key}>
+                          <code className={styles.key}>{key}</code>:{' '}
+                          <code>{JSON.stringify(value)}</code>
+                        </li>
+                      )
+                  )}
+                </ul>
+              </details>
+            </Fragment>
+          ))
         )}
       </main>
 
diff --git a/src/styles/Home.module.css b/src/styles/Home.module.css
index 02f9bc4..f535d06 100644
--- a/src/styles/Home.module.css
+++ b/src/styles/Home.module.css
@@ -92,12 +92,17 @@
   list-style-type: square;
   margin-left: 1rem;
   margin-top: calc(var(--spacer) / 4);
+  color: var(--color-secondary);
+  font-size: var(--font-size-small);
 }
 
 .messages li {
   display: list-item;
   margin-top: calc(var(--spacer) / 8);
   list-style-position: outside;
+}
+
+.warning .messages {
   color: var(--brand-alert-orange);
 }