From 46ee0f28599887a48c27f12251e57eebdb9ff900 Mon Sep 17 00:00:00 2001
From: Arjun Porwal <65214523+ap211unitech@users.noreply.github.com>
Date: Wed, 5 Nov 2025 13:31:40 +0530
Subject: [PATCH] fix: enhance RefEnd component with staking async APIs
 integration (#11970)

---
 packages/page-referenda/src/Referenda/RefEnd.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/page-referenda/src/Referenda/RefEnd.tsx b/packages/page-referenda/src/Referenda/RefEnd.tsx
index b5c3b2af96..478af5b205 100644
--- a/packages/page-referenda/src/Referenda/RefEnd.tsx
+++ b/packages/page-referenda/src/Referenda/RefEnd.tsx
@@ -5,7 +5,7 @@ import type { BN } from '@polkadot/util';
 
 import React from 'react';
 
-import { useBestNumberRelay } from '@polkadot/react-hooks';
+import { useBestNumberRelay, useStakingAsyncApis } from '@polkadot/react-hooks';
 import { BlockToTime } from '@polkadot/react-query';
 import { formatNumber } from '@polkadot/util';
 
@@ -17,14 +17,19 @@ interface Props {
 
 function RefEnd ({ className = '', label, when }: Props): React.ReactElement<Props> {
   const bestNumber = useBestNumberRelay();
+  const { isStakingAsync, rcApi } = useStakingAsyncApis();
 
   return (
     <td className={`${className} number`}>
       {bestNumber && when && (
         <>
           <div>{label}</div>
+          {/* Remaining period should be decided based on Relay chain */}
           {when.gt(bestNumber) && (
-            <BlockToTime value={when.sub(bestNumber)} />
+            <BlockToTime
+              api={isStakingAsync ? rcApi : undefined}
+              value={when.sub(bestNumber)}
+            />
           )}
           <div>#{formatNumber(when)}</div>
         </>