Adjust useMapKeys trigger params (#7091)

packages/page-assets/src/useAssetIds.ts

@@ -6,17 +6,18 @@ import type { AssetId } from '@polkadot/types/interfaces';
 
 import { createNamedHook, useApi, useEventTrigger, useMapKeys } from '@polkadot/react-hooks';
 
-function extractAssetIds (keys: StorageKey<[AssetId]>[]): AssetId[] {
-  return keys
-    .map(({ args: [assetId] }) => assetId)
-    .sort((a, b) => a.cmp(b));
-}
+const options = {
+  transform: (keys: StorageKey<[AssetId]>[]): AssetId[] =>
+    keys
+      .map(({ args: [assetId] }) => assetId)
+      .sort((a, b) => a.cmp(b))
+};
 
 function useAssetIdsImpl (): AssetId[] | undefined {
   const { api } = useApi();
   const trigger = useEventTrigger([api.events.assets.Created, api.events.assets.Destroyed]);
 
-  return useMapKeys(api.query.assets.asset, { at: trigger.blockHash, transform: extractAssetIds });
+  return useMapKeys(api.query.assets.asset, options, trigger.blockHash);
 }
 
 export default createNamedHook('useAssetIds', useAssetIdsImpl);

packages/page-parachains/src/useFunds.ts

@@ -147,16 +147,17 @@ const optLeaseMulti = {
   withParamsTransform: true
 };
 
-function extractFundIds (keys: StorageKey<[ParaId]>[]): ParaId[] {
-  return keys.map(({ args: [paraId] }) => paraId);
-}
+const fundOpts = {
+  transform: (keys: StorageKey<[ParaId]>[]): ParaId[] =>
+    keys.map(({ args: [paraId] }) => paraId)
+};
 
 function useFundsImpl (): Campaigns {
   const { api } = useApi();
   const bestNumber = useBestNumber();
   const mountedRef = useIsMountedRef();
   const trigger = useEventTrigger([api.events.crowdloan?.Created]);
-  const paraIds = useMapKeys(api.query.crowdloan?.funds, { at: trigger.blockHash, transform: extractFundIds });
+  const paraIds = useMapKeys(api.query.crowdloan?.funds, fundOpts, trigger.blockHash);
   const campaigns = useCall<Campaign[]>(api.query.crowdloan?.funds.multi, [paraIds], optFundMulti);
   const leases = useCall<ParaId[]>(api.query.slots.leases.multi, [paraIds], optLeaseMulti);
   const [result, setResult] = useState<Campaigns>(EMPTY);

packages/page-parachains/src/useProposals.ts

@@ -20,9 +20,10 @@ const optionsMulti = {
   defaultValue: [undefined, undefined] as MultiQuery
 };
 
-function extractProposalIds (keys: StorageKey<[ParaId]>[]): ParaId[] {
-  return keys.map(({ args: [id] }) => id);
-}
+const proposalOpts = {
+  transform: (keys: StorageKey<[ParaId]>[]): ParaId[] =>
+    keys.map(({ args: [id] }) => id)
+};
 
 function extractScheduled (entries: [StorageKey<[SessionIndex]>, ParaId[]][]): Scheduled[] {
   return entries.map(([{ args: [sessionIndex] }, scheduledIds]) => ({
@@ -35,7 +36,7 @@ function useProposalsImpl (): Proposals | undefined {
   const { api } = useApi();
   const mountedRef = useIsMountedRef();
   const trigger = useEventTrigger([api.events.proposeParachain?.ProposeParachain]);
-  const proposalIds = useMapKeys(api.query.proposeParachain?.proposals, { at: trigger.blockHash, transform: extractProposalIds });
+  const proposalIds = useMapKeys(api.query.proposeParachain?.proposals, proposalOpts, trigger.blockHash);
   const scheduled = useMapEntries(api.query.proposeParachain?.scheduledProposals, { at: trigger.blockHash, transform: extractScheduled });
   const [sessionIndex, approvedIds] = useCallMulti<MultiQuery>([
     api.query.session.currentIndex,

packages/page-treasury/src/useTipHashes.ts

@@ -6,15 +6,16 @@ import type { Hash } from '@polkadot/types/interfaces';
 
 import { createNamedHook, useApi, useEventTrigger, useMapKeys } from '@polkadot/react-hooks';
 
-function extractHashes (keys: StorageKey<[Hash]>[]): string[] {
-  return keys.map(({ args: [hash] }) => hash.toHex());
-}
+const options = {
+  transform: (keys: StorageKey<[Hash]>[]): string[] =>
+    keys.map(({ args: [hash] }) => hash.toHex())
+};
 
 function useTipHashesImpl (): string[] | undefined {
   const { api } = useApi();
   const trigger = useEventTrigger([api.events.tips?.NewTip, api.events.tips?.TipClosed, api.events.tips?.TipRetracted]);
 
-  return useMapKeys((api.query.tips || api.query.treasury)?.tips, { at: trigger.blockHash, transform: extractHashes });
+  return useMapKeys((api.query.tips || api.query.treasury)?.tips, options, trigger.blockHash);
 }
 
 export default createNamedHook('useTipHashes', useTipHashesImpl);

packages/react-hooks/src/useMapKeys.ts

@@ -6,12 +6,11 @@ import type { QueryableStorageEntry } from '@polkadot/api/types';
 import { useEffect, useState } from 'react';
 
 interface Options <T> {
-  at?: string | null | false;
   transform?: (value: any[]) => T[];
 }
 
 // FIXME This is generic, we cannot really use createNamedHook
-export function useMapKeys <T = any> (entry?: QueryableStorageEntry<'promise'> | null | false, { at, transform }: Options<T> = {}): T[] | undefined {
+export function useMapKeys <T = any> (entry?: QueryableStorageEntry<'promise'> | null | false, { transform }: Options<T> = {}, at?: string | null | false): T[] | undefined {
   const [state, setState] = useState<T[] | undefined>();
 
   useEffect((): void => {