@web3auth/no-modal
Version:
Multi chain wallet aggregator for web3Auth
278 lines (274 loc) • 10.3 kB
JavaScript
'use strict';
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var core = require('@wagmi/core');
var vue$1 = require('@wagmi/vue');
var connectors = require('@wagmi/vue/connectors');
var auth = require('@web3auth/auth');
var viem = require('viem');
var vue = require('vue');
require('@babel/runtime/helpers/defineProperty');
require('@segment/analytics-next');
var loglevel = require('../../base/loglevel.js');
var baseControllers = require('@toruslabs/base-controllers');
var index = require('../../base/errors/index.js');
require('../../base/wallet/index.js');
require('../../base/connector/connectorStatus.js');
require('../../base/connector/constants.js');
require('jwt-decode');
require('../../base/plugin/errors.js');
require('../../base/plugin/IPlugin.js');
require('@toruslabs/constants');
require('@toruslabs/http-helpers');
var useWeb3Auth = require('../composables/useWeb3Auth.js');
var useWeb3AuthDisconnect = require('../composables/useWeb3AuthDisconnect.js');
var constants = require('./constants.js');
const WEB3AUTH_CONNECTOR_ID = "web3auth";
function getWeb3authConnector(config) {
return config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
}
// Helper to initialize connectors for the given wallets
// eslint-disable-next-line @typescript-eslint/no-explicit-any
async function setupConnector(provider, config) {
let connector = getWeb3authConnector(config);
if (connector) return connector;
// Create new connector if not already existing
connector = connectors.injected({
target: {
provider: provider,
id: WEB3AUTH_CONNECTOR_ID,
name: "Web3Auth"
}
});
const result = config._internal.connectors.setup(connector);
config._internal.connectors.setState(current => [...current, result]);
return result;
}
// Helper to connect a wallet and update wagmi state
async function connectWeb3AuthWithWagmi(connector, config) {
var _config$storage, _config$storage2;
await Promise.all([(_config$storage = config.storage) === null || _config$storage === void 0 ? void 0 : _config$storage.removeItem(`${connector.id}.disconnected`), (_config$storage2 = config.storage) === null || _config$storage2 === void 0 ? void 0 : _config$storage2.setItem("recentConnectorId", connector.id)]);
let chainId = await connector.getChainId();
if (!config.chains.find(c => c.id === chainId)) {
chainId = config.chains[0].id;
}
const accounts = await connector.getAccounts();
const connections = new Map([[connector.uid, {
accounts: [accounts[0]],
chainId,
connector
}]]);
config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
chainId,
connections,
current: connector.uid,
status: "connected"
}));
}
function resetConnectorState(config) {
config._internal.connectors.setState(prev => prev.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID));
config.connectors.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID);
}
async function disconnectWeb3AuthFromWagmi(config) {
var _config$storage3, _config$storage4;
const connector = getWeb3authConnector(config);
await Promise.all([(_config$storage3 = config.storage) === null || _config$storage3 === void 0 ? void 0 : _config$storage3.setItem(`${connector === null || connector === void 0 ? void 0 : connector.id}.disconnected`, true), (_config$storage4 = config.storage) === null || _config$storage4 === void 0 ? void 0 : _config$storage4.removeItem("injected.connected")]);
resetConnectorState(config);
config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
chainId: state.chainId,
connections: new Map(),
current: undefined,
status: "disconnected"
}));
}
const Web3AuthWagmiProvider = vue.defineComponent({
name: "Web3AuthWagmiProvider",
setup() {
const {
isConnected,
provider
} = useWeb3Auth.useWeb3Auth();
const {
disconnect
} = useWeb3AuthDisconnect.useWeb3AuthDisconnect();
const wagmiConfig = vue$1.useConfig();
const {
reconnect
} = vue$1.useReconnect();
vue$1.useAccountEffect({
onDisconnect: async () => {
loglevel.log.info("Disconnected from wagmi");
if (isConnected.value) await disconnect();
const connector = getWeb3authConnector(wagmiConfig);
// reset wagmi connector state if the provider handles disconnection because of the accountsChanged event
// from the connected provider
if (connector) {
resetConnectorState(wagmiConfig);
}
}
});
vue.watch(isConnected, async newIsConnected => {
if (newIsConnected && provider.value) {
const connector = await setupConnector(provider.value, wagmiConfig);
if (!connector) {
throw new Error("Failed to setup connector");
}
await connectWeb3AuthWithWagmi(connector, wagmiConfig);
reconnect();
} else if (!newIsConnected) {
if (wagmiConfig.state.status === "connected") {
await disconnectWeb3AuthFromWagmi(wagmiConfig);
}
}
}, {
immediate: true
});
},
render() {
var _this$$slots$default;
return vue.h((_this$$slots$default = this.$slots.default) !== null && _this$$slots$default !== void 0 ? _this$$slots$default : "");
}
});
const Web3AuthWagmiInnerProvider = vue.defineComponent({
name: "Web3AuthWagmiInnerProvider",
props: {
config: {
type: Object,
required: false
}
},
setup(props) {
const {
config
} = props;
vue.provide(vue$1.configKey, config);
},
render() {
var _this$$slots$default2;
return vue.h(Web3AuthWagmiProvider, {}, (_this$$slots$default2 = this.$slots.default) !== null && _this$$slots$default2 !== void 0 ? _this$$slots$default2 : "");
}
});
const WagmiProvider = vue.defineComponent({
name: "WagmiProvider",
props: {
config: {
type: Object,
required: false
}
},
setup(props) {
const {
config
} = props;
const {
web3Auth,
isInitialized
} = useWeb3Auth.useWeb3Auth();
const finalConfig = vue.shallowRef(constants.defaultWagmiConfig);
const configKey = vue.ref(auth.randomId());
const getTransport = chain => {
const {
wsTarget,
rpcTarget,
fallbackWsTargets = [],
fallbackRpcTargets = []
} = chain;
const transports = [];
if (wsTarget) transports.push(viem.webSocket(wsTarget));
if (fallbackWsTargets.length > 0) transports.push(...fallbackWsTargets.map(target => viem.webSocket(target)));
if (rpcTarget) transports.push(viem.http(rpcTarget));
if (fallbackRpcTargets.length > 0) transports.push(...fallbackRpcTargets.map(target => viem.http(target)));
return viem.fallback(transports);
};
const defineWagmiConfig = () => {
var _web3Auth$value;
const configParams = _objectSpread(_objectSpread({
ssr: true
}, config), {}, {
chains: undefined,
connectors: [],
transports: {},
multiInjectedProviderDiscovery: false,
client: undefined
});
const wagmiChains = [];
if (isInitialized.value && web3Auth !== null && web3Auth !== void 0 && (_web3Auth$value = web3Auth.value) !== null && _web3Auth$value !== void 0 && (_web3Auth$value = _web3Auth$value.coreOptions) !== null && _web3Auth$value !== void 0 && _web3Auth$value.chains) {
var _web3Auth$value$curre;
const defaultChainId = (_web3Auth$value$curre = web3Auth.value.currentChain) === null || _web3Auth$value$curre === void 0 ? void 0 : _web3Auth$value$curre.chainId;
const chains = web3Auth.value.coreOptions.chains.filter(chain => chain.chainNamespace === baseControllers.CHAIN_NAMESPACES.EIP155);
if (chains.length === 0) throw index.WalletInitializationError.invalidParams("No valid chains found in web3auth config for wagmi.");
chains.forEach(chain => {
const wagmiChain = viem.defineChain({
id: Number.parseInt(chain.chainId, 16),
// id in number form
name: chain.displayName,
rpcUrls: {
default: {
http: [chain.rpcTarget],
webSocket: [chain.wsTarget]
}
},
blockExplorers: chain.blockExplorerUrl ? {
default: {
name: "explorer",
// TODO: correct name if chain config has it
url: chain.blockExplorerUrl
}
} : undefined,
nativeCurrency: {
name: chain.tickerName,
symbol: chain.ticker,
decimals: chain.decimals || 18
}
});
if (defaultChainId === chain.chainId) {
wagmiChains.unshift(wagmiChain);
} else {
wagmiChains.push(wagmiChain);
}
configParams.transports[wagmiChain.id] = getTransport(chain);
});
configParams.chains = [wagmiChains[0], ...wagmiChains.slice(1)];
}
return vue$1.createConfig(configParams);
};
const hydrateWagmiConfig = () => {
if (finalConfig.value) {
core.hydrate(finalConfig.value, _objectSpread({
reconnectOnMount: false
}, props.config));
}
};
vue.watch(isInitialized, (newIsInitialized, prevIsInitialized) => {
var _web3Auth$value2;
(_web3Auth$value2 = web3Auth.value) === null || _web3Auth$value2 === void 0 || _web3Auth$value2.setAnalyticsProperties({
wagmi_enabled: true
});
if (newIsInitialized && !prevIsInitialized) {
finalConfig.value = defineWagmiConfig();
hydrateWagmiConfig();
configKey.value = auth.randomId();
}
}, {
immediate: true
});
if (!isInitialized.value) {
hydrateWagmiConfig();
}
return {
finalConfig,
configKey
};
},
render() {
return vue.h(Web3AuthWagmiInnerProvider, {
config: this.finalConfig,
key: this.configKey
}, {
default: () => {
var _this$$slots$default3, _this$$slots;
return (_this$$slots$default3 = (_this$$slots = this.$slots).default) === null || _this$$slots$default3 === void 0 ? void 0 : _this$$slots$default3.call(_this$$slots);
}
});
}
});
exports.WagmiProvider = WagmiProvider;