diff --git a/packages/page-explorer/src/SummarySession.tsx b/packages/page-explorer/src/SummarySession.tsx
index 99bd35c94d..52aabda58d 100644
--- a/packages/page-explorer/src/SummarySession.tsx
+++ b/packages/page-explorer/src/SummarySession.tsx
@@ -21,9 +21,7 @@ function SummarySession ({ withEra = true, withSession = true }: Props): React.R
   const { t } = useTranslation();
   const { api } = useApi();
   const sessionInfo = useCall<DeriveSessionProgress>(api.derive.session?.progress, []);
-  const isForceNone = useCall<boolean>(api.query.staking?.forceEra, [], {
-    transform: (forcing: Forcing) => forcing.isForceNone
-  });
+  const forcing = useCall<Forcing>(api.query.staking?.forceEra, []);
   const eraLabel = useMemo(() =>
     t<string>('era')
   , [t]);
@@ -55,14 +53,14 @@ function SummarySession ({ withEra = true, withSession = true }: Props): React.R
                 </CardSummary>
               )
           )}
-          {!isForceNone && withEra && (
+          {forcing && !forcing.isForceNone && withEra && (
             sessionInfo.sessionLength.gtn(1)
               ? (
                 <CardSummary
                   label={eraLabel}
                   progress={{
-                    total: sessionInfo.eraLength,
-                    value: sessionInfo.eraProgress,
+                    total: forcing.isForceAlways ? sessionInfo.sessionLength : sessionInfo.eraLength,
+                    value: forcing.isForceAlways ? sessionInfo.sessionProgress : sessionInfo.eraProgress,
                     withTime: true
                   }}
                 />
diff --git a/packages/page-staking/src/Payouts/useEraBlocks.ts b/packages/page-staking/src/Payouts/useEraBlocks.ts
index 297be2bd51..d8e2f7506d 100644
--- a/packages/page-staking/src/Payouts/useEraBlocks.ts
+++ b/packages/page-staking/src/Payouts/useEraBlocks.ts
@@ -2,6 +2,7 @@
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
 
+import { Forcing } from '@polkadot/types/interfaces';
 import { DeriveSessionProgress } from '@polkadot/api-derive/types';
 
 import BN from 'bn.js';
@@ -13,19 +14,25 @@ export default function useEraBlocks (era?: BN): BN | undefined {
   const { api } = useApi();
   const depth = useCall<BN>(api.query.staking.historyDepth, []);
   const progress = useCall<DeriveSessionProgress>(api.derive.session.progress, []);
+  const forcing = useCall<Forcing>(api.query.staking.forceEra, []);
   const [duration, setDuration] = useState<BN | undefined>();
 
   useEffect((): void => {
-    depth && era && progress && progress.sessionLength.gt(BN_ONE) && setDuration(
-      progress.eraLength
-        .mul(
-          depth
-            .sub(progress.activeEra.sub(era))
-            .add(BN_ONE)
-        )
-        .sub(progress.eraProgress)
+    depth && era && forcing && progress && progress.sessionLength.gt(BN_ONE) && setDuration(
+      (forcing.isForceAlways
+        ? progress.sessionLength
+        : progress.eraLength
+      ).mul(
+        depth
+          .sub(progress.activeEra.sub(era))
+          .add(BN_ONE)
+      ).sub(
+        forcing.isForceAlways
+          ? progress.sessionProgress
+          : progress.eraProgress
+      )
     );
-  }, [api, depth, era, progress]);
+  }, [api, depth, era, forcing, progress]);
 
   return duration;
 }