chore: move sapi to its own package (#1779)

* chore: move sapi to its own package

* chore: cleanup

* chore: cleanup

* chore: comment about nonce

.changeset/config.json

@@ -17,6 +17,7 @@
     "extension-core",
     "extension-shared",
     "playground",
-    "talisman-ui"
+    "talisman-ui",
+    "sapi"
   ]
 }

apps/extension/package.json

@@ -82,6 +82,7 @@
     "dompurify": "^3.1.7",
     "extension-core": "workspace:*",
     "extension-shared": "workspace:*",
+    "sapi": "workspace:*",
     "framer-motion": "11.11.9",
     "highlight.js": "11.10.0",
     "html-react-parser": "5.1.18",

apps/extension/src/ui/domains/Sign/SignRequestContext/PolkadotSignRequestContext.ts

@@ -4,14 +4,14 @@ import { HexString } from "@polkadot/util/types"
 import { papiStringify } from "@talismn/scale"
 import { useQuery } from "@tanstack/react-query"
 import { useCallback, useEffect, useMemo } from "react"
+import { DecodedCall, ScaleApi } from "sapi"
 
 import { Address, isJsonPayload, SubstrateSigningRequest } from "@extension/core"
 import { log } from "@extension/shared"
 import { provideContext } from "@talisman/util/provideContext"
 import { api } from "@ui/api"
 import { useBalancesHydrate, useChainByGenesisHash } from "@ui/state"
 import { getExtrinsicDispatchInfo } from "@ui/util/getExtrinsicDispatchInfo"
-import { DecodedCall, ScaleApi } from "@ui/util/scaleApi"
 
 import { useSubstratePayloadMetadataSuspense } from "../../../hooks/useSubstratePayloadMetadata"
 import { useAnySigningRequest } from "./AnySignRequestContext"

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedBatch.tsx

@@ -1,6 +1,5 @@
 import { useMemo } from "react"
-
-import { DecodedCall } from "@ui/util/scaleApi"
+import { DecodedCall } from "sapi"
 
 import { DecodedBatchArgs, DecodedCallComponent, isBatchCall } from "../types"
 import { SubSignDecodedBatchDrawer } from "./SubSignDecodedBatchDrawer"

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedBatchDrawer.tsx

@@ -2,10 +2,10 @@ import { ChevronLeftIcon, ChevronRightIcon } from "@talismn/icons"
 import { SignerPayloadJSON } from "extension-core"
 import { FC } from "react"
 import { useTranslation } from "react-i18next"
+import { ScaleApi } from "sapi"
 import { Button, Drawer } from "talisman-ui"
 
 import { ScrollContainer } from "@talisman/components/ScrollContainer"
-import { ScaleApi } from "@ui/util/scaleApi"
 
 import { useSubSignDecodedBatchDrawer } from "./SubSignDecodedBatchDrawerContext"
 import { SubSignDecodedCallContent } from "./SubSignDecodedCallContent"

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedBatchDrawerContext.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from "react"
+import { DecodedCall } from "sapi"
 
 import { provideContext } from "@talisman/util/provideContext"
-import { DecodedCall } from "@ui/util/scaleApi"
 
 import { DecodedBatchCall } from "../types"
 

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedCallButtonContent.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react"
+import { DecodedCall } from "sapi"
 
 import { FallbackErrorBoundary } from "@talisman/components/FallbackErrorBoundary"
-import { DecodedCall } from "@ui/util/scaleApi"
 
 import { SUMMARY_COMPONENTS } from "../summary/calls"
 import { DecodedCallComponent, SummaryButtonDisplayMode } from "../types"

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedCallContent.tsx

@@ -9,10 +9,10 @@ import { marked } from "marked"
 import { Binary } from "polkadot-api"
 import { FC, Suspense, useMemo } from "react"
 import { useTranslation } from "react-i18next"
+import { DecodedCall, ScaleApi } from "sapi"
 
 import { CodeBlock } from "@talisman/components/CodeBlock"
 import { FallbackErrorBoundary } from "@talisman/components/FallbackErrorBoundary"
-import { DecodedCall, ScaleApi } from "@ui/util/scaleApi"
 
 import { SubSignDecodedCallSummaryBlock } from "./SubSignDecodedCallSummaryBlock"
 

apps/extension/src/ui/domains/Sign/Substrate/decode/SubSignDecodedCallDrawer.tsx

@@ -2,10 +2,10 @@ import { XIcon } from "@talismn/icons"
 import { SignerPayloadJSON } from "extension-core"
 import { FC } from "react"
 import { useTranslation } from "react-i18next"
+import { DecodedCall, ScaleApi } from "sapi"
 import { Button, Drawer, IconButton } from "talisman-ui"
 
 import { ScrollContainer } from "@talisman/components/ScrollContainer"
-import { DecodedCall, ScaleApi } from "@ui/util/scaleApi"
 
 import { SubSignDecodedCallContent } from "./SubSignDecodedCallContent"
 

apps/extension/src/ui/domains/Sign/Substrate/summary/calls/SummaryBalances.tsx

@@ -3,9 +3,9 @@ import { useSuspenseQuery } from "@tanstack/react-query"
 import { Address } from "extension-core"
 import { useMemo } from "react"
 import { Trans, useTranslation } from "react-i18next"
+import { ScaleApi } from "sapi"
 
 import { useChain, useToken } from "@ui/state"
-import { ScaleApi } from "@ui/util/scaleApi"
 
 import { DecodedCallSummaryComponent, DecodedCallSummaryComponentDefs } from "../../types"
 import { getAddressFromMultiAddress } from "../../util/getAddressFromMultiAddress"

apps/extension/src/ui/domains/Sign/Substrate/summary/calls/SummaryNominationPools.tsx

@@ -3,10 +3,10 @@ import { useSuspenseQuery } from "@tanstack/react-query"
 import { Binary } from "polkadot-api"
 import { FC, useMemo } from "react"
 import { Trans, useTranslation } from "react-i18next"
+import { ScaleApi } from "sapi"
 
 import { cleanupNomPoolName } from "@ui/domains/Staking/helpers"
 import { useChain } from "@ui/state"
-import { ScaleApi } from "@ui/util/scaleApi"
 
 import { DecodedCallSummaryComponent, DecodedCallSummaryComponentDefs } from "../../types"
 import { SummaryContainer, SummaryContent, SummarySeparator } from "../shared/SummaryContainer"

apps/extension/src/ui/domains/Sign/Substrate/types.ts

@@ -1,8 +1,7 @@
 import { PolkadotCalls } from "@polkadot-api/descriptors"
 import { SignerPayloadJSON } from "extension-core"
 import { FC } from "react"
-
-import { DecodedCall, ScaleApi } from "@ui/util/scaleApi"
+import { DecodedCall, ScaleApi } from "sapi"
 
 export type DecodedBatchCall =
   | {

apps/extension/src/ui/domains/Sign/Substrate/util/getGovernanceTrackName.ts

@@ -1,7 +1,6 @@
 import { PolkadotConstants } from "@polkadot-api/descriptors"
 import { capitalize } from "lodash"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 export const getConvictionVotingTrackName = (sapi: ScaleApi, trackId: number): string | null => {
   const tracks = sapi.getConstant("Referenda", "Tracks") as PolkadotConstants["Referenda"]["Tracks"]

apps/extension/src/ui/domains/Sign/Substrate/util/useDecodedCallComponent.ts

@@ -1,6 +1,5 @@
 import { useMemo } from "react"
-
-import { DecodedCall } from "@ui/util/scaleApi"
+import { DecodedCall } from "sapi"
 
 import { DecodedCallComponentDefs } from "../types"
 

apps/extension/src/ui/domains/Staking/helpers.ts

@@ -1,8 +1,7 @@
 import { Enum } from "@polkadot-api/substrate-bindings"
 import { range } from "lodash"
 import { Binary } from "polkadot-api"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 export const getStakingErasPerYear = (sapi: ScaleApi) => {
   const MS_PER_YEAR = 1000n * 60n * 60n * 24n * 365n

apps/extension/src/ui/domains/Staking/hooks/bittensor/useCanStakeBittensor.ts

@@ -1,7 +1,6 @@
 import { ChainId } from "extension-core"
 import { useEffect, useMemo, useState } from "react"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { useGetLatestBlockNumber } from "../../shared/useGetLatestBlockNumber"
 import { useGetBittensorTotalHotkeyColdkeyStakes } from "./useGetBittensorTotalHotkeyColdkeyStakes"

apps/extension/src/ui/domains/Staking/hooks/bittensor/useGetBittensorStakingPayload.ts

@@ -1,7 +1,6 @@
 import { useQuery } from "@tanstack/react-query"
 import { useMemo } from "react"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { getBittensorStakingPayload } from "../../helpers"
 

apps/extension/src/ui/domains/Staking/hooks/bittensor/useGetBittensorTotalHotkeyColdkeyStakes.ts

@@ -1,6 +1,5 @@
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 type GetBittensorTotalHotkeyColdkeyStakes = {
   sapi: ScaleApi | undefined | null

apps/extension/src/ui/domains/Staking/hooks/bittensor/useGetBittensorUnbondPayload.ts

@@ -1,6 +1,5 @@
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 type GetBittensorUnbondPayload = {
   sapi: ScaleApi | undefined | null

apps/extension/src/ui/domains/Staking/hooks/nomPools/useGetNomPoolPlanksToUnbond.ts

@@ -1,7 +1,6 @@
 import { papiStringify } from "@talismn/scale"
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { NomPoolMember } from "../../types"
 

apps/extension/src/ui/domains/Staking/hooks/nomPools/useGetNomPoolStakingPayload.ts

@@ -1,7 +1,6 @@
 import { useQuery } from "@tanstack/react-query"
 import { useMemo } from "react"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { getNomPoolStakingPayload } from "../../helpers"
 

apps/extension/src/ui/domains/Staking/hooks/nomPools/useGetNomPoolUnbondPayload.ts

@@ -1,8 +1,7 @@
 import { Enum } from "@polkadot-api/substrate-bindings"
 import { papiStringify } from "@talismn/scale"
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { NomPoolMember } from "../../types"
 

apps/extension/src/ui/domains/Staking/hooks/nomPools/useNomPoolStakingStatus.ts

@@ -2,11 +2,11 @@ import { TokenId } from "@talismn/chaindata-provider"
 import { useQuery } from "@tanstack/react-query"
 import { log } from "extension-shared"
 import { useMemo } from "react"
+import { ScaleApi } from "sapi"
 
 import { usePortfolioNavigation } from "@ui/domains/Portfolio/usePortfolioNavigation"
 import { useScaleApi } from "@ui/hooks/sapi/useScaleApi"
 import { useBalances, useToken } from "@ui/state"
-import { ScaleApi } from "@ui/util/scaleApi"
 
 import { getStakingEraDurationMs } from "../../helpers"
 import { useGetMinJoinBond } from "../../shared/useGetMinJoinBond"

apps/extension/src/ui/domains/Staking/shared/useGetFeeEstimate.ts

@@ -1,7 +1,6 @@
 import { SignerPayloadJSON } from "@polkadot/types/types"
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 type GetNomPoolFeeEstimate = {
   sapi: ScaleApi | undefined | null

apps/extension/src/ui/domains/Staking/shared/useGetLatestBlockNumber.ts

@@ -1,6 +1,5 @@
 import { useQuery } from "@tanstack/react-query"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 type GetLatestBlockNumber = {
   sapi: ScaleApi | undefined | null

apps/extension/src/ui/domains/Staking/shared/useGetStakeInfo.ts

@@ -1,8 +1,7 @@
 import { UseQueryResult } from "@tanstack/react-query"
 import { ChainId, SignerPayloadJSON } from "extension-core"
 import { useMemo } from "react"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { useCanStakeBittensor } from "../hooks/bittensor/useCanStakeBittensor"
 import { useGetBittensorStakeHotkeys } from "../hooks/bittensor/useGetBittensorStakeHotkeys"

apps/extension/src/ui/domains/Staking/shared/useGetUnbondInfo.ts

@@ -1,6 +1,5 @@
 import { ChainId } from "extension-core"
-
-import { ScaleApi } from "@ui/util/scaleApi"
+import { ScaleApi } from "sapi"
 
 import { useCanStakeBittensor } from "../hooks/bittensor/useCanStakeBittensor"
 import { useGetBittensorStakeByHotKey } from "../hooks/bittensor/useGetBittensorStakeByHotKey"

apps/extension/src/ui/hooks/sapi/useScaleApi.ts

@@ -4,10 +4,10 @@ import { useQuery } from "@tanstack/react-query"
 import { ChainId } from "extension-core"
 import { getMetadataRpcFromDef } from "extension-shared"
 import { useMemo } from "react"
+import { getScaleApi, ScaleApi } from "sapi"
 
 import { api } from "@ui/api"
 import { useChain, useChainByGenesisHash, useToken } from "@ui/state"
-import { getScaleApi, ScaleApi } from "@ui/util/scaleApi"
 
 /**
  * useScaleApi instantiates a ScaleApi object for a given chainIdOrHash, specVersion, and blockHash.
@@ -36,7 +36,11 @@ export const useScaleApi = (
       if (!metadataRpc) return null
 
       return getScaleApi(
-        chain.id,
+        {
+          chainId: chain.id,
+          send: (...args) => api.subSend(chain.id, ...args),
+          submit: api.subSubmit,
+        },
         metadataRpc,
         token,
         chain.hasCheckMetadataHash,

apps/extension/src/ui/hooks/useSubstratePayloadMetadata.ts

@@ -3,11 +3,12 @@ import { assert, hexToNumber, u8aToHex } from "@polkadot/util"
 import { Chain, Token } from "@talismn/chaindata-provider"
 import { useQuery, useSuspenseQuery } from "@tanstack/react-query"
 import { SignerPayloadJSON } from "extension-core"
+import { getScaleApi } from "sapi"
 
 import { log } from "@extension/shared"
+import { api } from "@ui/api"
 import { useChainByGenesisHash, useToken } from "@ui/state"
 import { getFrontendTypeRegistry } from "@ui/util/getFrontendTypeRegistry"
-import { getScaleApi } from "@ui/util/scaleApi"
 
 export const useSubstratePayloadMetadata = (payload: SignerPayloadJSON | null) => {
   const chain = useChainByGenesisHash(payload?.genesisHash)
@@ -67,7 +68,11 @@ const getSubstratePayloadMetadata = async ({
     const sapi =
       metadata.version > 14
         ? getScaleApi(
-            chain.id,
+            {
+              chainId: chain.id,
+              send: (...args) => api.subSend(chain.id, ...args),
+              submit: api.subSubmit,
+            },
             metadataRpc,
             token,
             chain.hasCheckMetadataHash,