From 768cfc81f46be15dabc28c45bfc963a50f06b7dd Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Fri, 2 Apr 2021 22:21:05 +0300
Subject: [PATCH] Add finalized to parachains summary (#5015)

---
 .../page-parachains/src/Overview/Summary.tsx  | 30 +++++++++++--------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/packages/page-parachains/src/Overview/Summary.tsx b/packages/page-parachains/src/Overview/Summary.tsx
index c54acfb9b4..cedd3ecf73 100644
--- a/packages/page-parachains/src/Overview/Summary.tsx
+++ b/packages/page-parachains/src/Overview/Summary.tsx
@@ -7,6 +7,7 @@ import React from 'react';
 
 import SummarySession from '@polkadot/app-explorer/SummarySession';
 import { CardSummary, SummaryBox } from '@polkadot/react-components';
+import { BestFinalized } from '@polkadot/react-query';
 import { formatNumber, isNumber } from '@polkadot/util';
 
 import { useTranslation } from '../translate';
@@ -42,22 +43,25 @@ function Summary ({ leasePeriod, parachainCount, proposalCount, upcomingCount }:
       </section>
       <section>
         {leasePeriod && (
-          <CardSummary label={t<string>('current lease')}>
-            {formatNumber(leasePeriod.currentPeriod)}
-          </CardSummary>
+          <>
+            <CardSummary label={t<string>('current lease')}>
+              {formatNumber(leasePeriod.currentPeriod)}
+            </CardSummary>
+            <CardSummary
+              label={t<string>('lease period')}
+              progress={{
+                total: leasePeriod.length,
+                value: leasePeriod.progress,
+                withTime: true
+              }}
+            />
+          </>
         )}
       </section>
       <section>
-        {leasePeriod && (
-          <CardSummary
-            label={t<string>('lease period')}
-            progress={{
-              total: leasePeriod.length,
-              value: leasePeriod.progress,
-              withTime: true
-            }}
-          />
-        )}
+        <CardSummary label={t<string>('finalized')}>
+          <BestFinalized />
+        </CardSummary>
         <SummarySession
           className='media--800'
           withEra={false}