diff --git a/.gitignore b/.gitignore index a34823e11..781d22ed0 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +.vscode .idea .coverage.txt frontend/node_modules diff --git a/app/src/App.tsx b/app/src/App.tsx index 0088686e1..03dedcb3e 100644 --- a/app/src/App.tsx +++ b/app/src/App.tsx @@ -15,6 +15,7 @@ import { shouldAllowFaucetFunding } from "@/hooks/useFaucet"; import OnboardingModal from "@/components/OnboardingModal"; import "./App.scss"; +import { SifchainClientsProvider } from "./business/providers/SifchainClientsProvider"; // not currently working? - McCall const hideRedundantUselessMetamaskErrors = () => { @@ -122,14 +123,16 @@ export default defineComponent({ return () => (
- - - {shouldShowOnboardingModal.value && ( - - )} - - - + + + + {shouldShowOnboardingModal.value && ( + + )} + + + +
); }, diff --git a/app/src/business/providers/SifchainClientsProvider.tsx b/app/src/business/providers/SifchainClientsProvider.tsx new file mode 100644 index 000000000..78127d107 --- /dev/null +++ b/app/src/business/providers/SifchainClientsProvider.tsx @@ -0,0 +1,72 @@ +import { useCore } from "@/hooks/useCore"; +import { createQueryClient, createSigningClient } from "@sifchain/sdk"; +import { + defineComponent, + inject, + InjectionKey, + onMounted, + provide, + reactive, +} from "vue"; + +type QueryClients = Awaited>; + +type QueryClientsState = + | ({ + queryClientStatus: "fulfilled"; + } & QueryClients) + | { queryClientStatus?: "pending" | "rejected" }; + +type SigningClient = Awaited>; + +type SigningClientState = + | { + signingClientStatus: "fulfilled"; + signingClient: SigningClient; + } + | { + signingClientStatus?: "pending" | "rejected"; + }; + +export type ClientsState = QueryClientsState & SigningClientState; + +export const sifchainClientsSymbol: InjectionKey = + Symbol("sifchainClients"); + +export const SifchainClientsProvider = defineComponent((_, { slots }) => { + const state = reactive({ + queryClientStatus: undefined, + signingClientStatus: undefined, + }); + + const { config, services } = useCore(); + + onMounted(() => { + state.queryClientStatus = "pending"; + const queryClientPromise = createQueryClient(config.sifRpcUrl) + .then((x) => { + Object.assign(state, { ...x, queryClientStatus: "fulfilled" }); + }) + .catch(() => (state.queryClientStatus = "rejected")); + + state.signingClientStatus = "pending"; + const signingClientPromise = services.wallet.keplrProvider + .getSendingSigner(services.chains.nativeChain) + .then((x) => createSigningClient(config.sifRpcUrl, x)) + .then((x) => + Object.assign(state, { + signingClient: x, + signingClientStatus: "fulfilled", + }), + ) + .catch(() => (state.signingClientStatus = "rejected")); + + return Promise.all([queryClientPromise, signingClientPromise]); + }); + + provide(sifchainClientsSymbol, state); + + return () => slots.default?.(); +}); + +export const injectSifchainClients = () => inject(sifchainClientsSymbol);