UNPKG

@txnlab/use-wallet-vue

Version:

Vue library for integrating Algorand wallets into decentralized applications

196 lines (193 loc) 7.01 kB
// src/index.ts export * from "@txnlab/use-wallet"; // src/walletManagerPlugin.ts import { WalletManager } from "@txnlab/use-wallet"; import { ref } from "vue"; var WalletManagerPlugin = { install(app, options) { const manager = new WalletManager(options); const algodClient = ref(manager.algodClient); const setAlgodClient = (client) => { algodClient.value = client; manager.algodClient = client; }; app.provide("walletManager", manager); app.provide("algodClient", algodClient); app.provide("setAlgodClient", setAlgodClient); manager.resumeSessions().catch((error) => { console.error("Error resuming sessions:", error); }); } }; // src/useWallet.ts import { useStore } from "@tanstack/vue-store"; import "@txnlab/use-wallet"; import "algosdk"; import { computed, inject } from "vue"; function useWallet() { const manager = inject("walletManager"); const algodClient = inject("algodClient"); if (!manager) { throw new Error("WalletManager plugin is not properly installed"); } if (!algodClient) { throw new Error("Algod client not properly installed"); } const managerStatus = useStore(manager.store, (state) => state.managerStatus); const isReady = computed(() => managerStatus.value === "ready"); const walletStateMap = useStore(manager.store, (state) => state.wallets); const activeWalletId = useStore(manager.store, (state) => state.activeWallet); const transformToWallet = (wallet) => { const walletState = walletStateMap.value[wallet.id]; return { id: wallet.id, metadata: wallet.metadata, accounts: walletState?.accounts ?? [], activeAccount: walletState?.activeAccount ?? null, isConnected: !!walletState, isActive: wallet.id === activeWalletId.value, canSignData: wallet.canSignData ?? false, connect: (args) => wallet.connect(args), disconnect: () => wallet.disconnect(), setActive: () => wallet.setActive(), setActiveAccount: (addr) => wallet.setActiveAccount(addr) }; }; const wallets = computed(() => { return [...manager.wallets.values()].map(transformToWallet); }); const activeWallet = computed(() => { const wallet = activeWalletId.value ? manager.getWallet(activeWalletId.value) || null : null; return wallet ? transformToWallet(wallet) : null; }); const activeBaseWallet = computed(() => { return activeWalletId.value ? manager.getWallet(activeWalletId.value) || null : null; }); const activeWalletState = computed(() => { const wallet = activeWallet.value; return wallet ? walletStateMap.value[wallet.id] || null : null; }); const activeWalletAccounts = computed(() => { return activeWalletState.value?.accounts ?? null; }); const activeWalletAddresses = computed(() => { return activeWalletAccounts.value?.map((account) => account.address) ?? null; }); const activeAccount = computed(() => { return activeWalletState.value?.activeAccount ?? null; }); const activeAddress = computed(() => { return activeAccount.value?.address ?? null; }); const signTransactions = (txnGroup, indexesToSign) => { if (!activeBaseWallet.value) { throw new Error("No active wallet"); } return activeBaseWallet.value.signTransactions(txnGroup, indexesToSign); }; const transactionSigner = (txnGroup, indexesToSign) => { if (!activeBaseWallet.value) { throw new Error("No active wallet"); } return activeBaseWallet.value.transactionSigner(txnGroup, indexesToSign); }; const signData = (data, metadata) => { if (!activeBaseWallet.value) { throw new Error("No active wallet"); } return activeBaseWallet.value.signData(data, metadata); }; return { wallets, isReady, algodClient: computed(() => { if (!algodClient.value) { throw new Error("Algod client is undefined"); } return algodClient.value; }), activeWallet, activeWalletAccounts, activeWalletAddresses, activeAccount, activeAddress, signData, signTransactions, transactionSigner }; } // src/useNetwork.ts import { useStore as useStore2 } from "@tanstack/vue-store"; import "@txnlab/use-wallet"; import algosdk2 from "algosdk"; import { computed as computed2, inject as inject2 } from "vue"; function useNetwork() { const manager = inject2("walletManager"); const algodClient = inject2("algodClient"); const setAlgodClient = inject2("setAlgodClient"); if (!manager) { throw new Error("WalletManager plugin is not properly installed"); } if (!algodClient || !setAlgodClient) { throw new Error("Algod client or setter not properly installed"); } const activeNetwork = useStore2(manager.store, (state) => state.activeNetwork); const networkConfig = useStore2(manager.store, (state) => ({ networks: { ...manager.networkConfig }, activeNetwork: state.activeNetwork })); const activeNetworkConfig = computed2( () => networkConfig.value.networks[networkConfig.value.activeNetwork] ); const setActiveNetwork = async (networkId) => { if (networkId === activeNetwork.value) { return; } if (!manager.networkConfig[networkId]) { throw new Error(`Network "${networkId}" not found in network configuration`); } console.info(`[Vue] Creating new Algodv2 client...`); const { algod } = manager.networkConfig[networkId]; const { token = "", baseServer, port = "", headers = {} } = algod; const newClient = new algosdk2.Algodv2(token, baseServer, port, headers); await manager.setActiveNetwork(networkId); setAlgodClient(newClient); console.info(`[Vue] \u2705 Active network set to ${networkId}.`); }; const updateAlgodConfig = (networkId, config) => { manager.updateAlgodConfig(networkId, config); manager.store.setState((state) => ({ ...state })); if (networkId === activeNetwork.value) { console.info(`[Vue] Creating new Algodv2 client...`); const { algod } = manager.networkConfig[networkId]; const { token = "", baseServer, port = "", headers = {} } = algod; const newClient = new algosdk2.Algodv2(token, baseServer, port, headers); setAlgodClient(newClient); } }; const resetNetworkConfig = (networkId) => { manager.resetNetworkConfig(networkId); manager.store.setState((state) => ({ ...state })); if (networkId === activeNetwork.value) { console.info(`[Vue] Creating new Algodv2 client...`); const { algod } = manager.networkConfig[networkId]; const { token = "", baseServer, port = "", headers = {} } = algod; const newClient = new algosdk2.Algodv2(token, baseServer, port, headers); setAlgodClient(newClient); } }; return { activeNetwork, networkConfig: manager.networkConfig, activeNetworkConfig, setActiveNetwork, updateAlgodConfig, resetNetworkConfig }; } export { WalletManagerPlugin, useNetwork, useWallet }; //# sourceMappingURL=index.js.map