From 47c2eb73e4a9267403be500c941159567aafeffe Mon Sep 17 00:00:00 2001 From: janniks Date: Fri, 17 Nov 2023 12:47:43 +0100 Subject: [PATCH] refactor: fix default installed handling --- packages/connect-ui/src/components.d.ts | 10 ++-- .../connect-ui/src/components/modal/modal.tsx | 54 ++++++++++--------- .../connect-ui/src/components/modal/readme.md | 10 ++-- packages/connect-ui/src/providers.ts | 47 ++++++++++++---- packages/connect/src/index.ts | 7 +++ .../connect/src/stories/Connect.stories.tsx | 6 +-- packages/connect/src/stories/ConnectPage.tsx | 2 + packages/connect/src/ui.ts | 48 ++++++++--------- tsconfig.json | 3 +- 9 files changed, 109 insertions(+), 78 deletions(-) diff --git a/packages/connect-ui/src/components.d.ts b/packages/connect-ui/src/components.d.ts index 4ce137ee..e8177053 100644 --- a/packages/connect-ui/src/components.d.ts +++ b/packages/connect-ui/src/components.d.ts @@ -5,12 +5,12 @@ * It contains typing information for all components that exist in this project. */ import { HTMLStencilElement, JSXBase } from "@stencil/core/internal"; -import { StxProvider } from "./providers"; +import { WebBTCProvider } from "./providers"; export namespace Components { interface ConnectModal { "callback": Function; - "defaultProviders": StxProvider[]; - "registeredProviders": StxProvider[]; + "defaultProviders": WebBTCProvider[]; + "installedProviders": WebBTCProvider[]; } } declare global { @@ -27,8 +27,8 @@ declare global { declare namespace LocalJSX { interface ConnectModal { "callback"?: Function; - "defaultProviders"?: StxProvider[]; - "registeredProviders"?: StxProvider[]; + "defaultProviders"?: WebBTCProvider[]; + "installedProviders"?: WebBTCProvider[]; } interface IntrinsicElements { "connect-modal": ConnectModal; diff --git a/packages/connect-ui/src/components/modal/modal.tsx b/packages/connect-ui/src/components/modal/modal.tsx index f014077b..16e2a7b5 100644 --- a/packages/connect-ui/src/components/modal/modal.tsx +++ b/packages/connect-ui/src/components/modal/modal.tsx @@ -1,5 +1,5 @@ import { Component, Element, Prop, h } from '@stencil/core'; -import { StxProvider } from '../../providers'; +import { WebBTCProvider } from '../../providers'; import { setSelectedProvider } from '../../session'; import CloseIcon from './assets/close-icon.svg'; import { getBrowser, getPlatform } from './utils'; @@ -11,8 +11,8 @@ import { getBrowser, getPlatform } from './utils'; shadow: true, }) export class Modal { - @Prop() defaultProviders: StxProvider[]; - @Prop() registeredProviders: StxProvider[]; + @Prop() defaultProviders: WebBTCProvider[]; + @Prop() installedProviders: WebBTCProvider[]; @Prop() callback: Function; @@ -30,8 +30,8 @@ export class Modal { } // todo: nice to have: - // getComment(provider: StxProvider, browser: string, isMobile?: string) { - // if (!provider.urls) return null; + // getComment(provider: WebBTCProvider, browser: string, isMobile?: string) { + // if (!provider) return null; // const hasExtension = this.getBrowserUrl(provider); // const hasMobile = this.getMobileUrl(provider); @@ -44,25 +44,25 @@ export class Modal { // return null; // } - getBrowserUrl(provider: StxProvider) { - return provider.urls?.chromeWebStore ?? provider.urls?.mozillaWebStore; + getBrowserUrl(provider: WebBTCProvider) { + return provider.chromeWebStoreUrl ?? provider.mozillaAddOnsUrl; } - getMobileUrl(provider: StxProvider) { - return provider.urls?.iOSAppStore ?? provider.urls?.androidAppStore; + getMobileUrl(provider: WebBTCProvider) { + return provider.iOSAppStoreUrl ?? provider.googlePlayStoreUrl; } - getInstallUrl(provider: StxProvider, browser: string) { + getInstallUrl(provider: WebBTCProvider, browser: string) { if (browser === 'Chrome') { - return provider.urls?.chromeWebStore ?? this.getMobileUrl(provider) ?? provider.urls?.about; + return provider.chromeWebStoreUrl ?? this.getMobileUrl(provider) ?? provider.webUrl; } else if (browser === 'Firefox') { - return provider.urls?.mozillaWebStore ?? this.getMobileUrl(provider) ?? provider.urls?.about; + return provider.mozillaAddOnsUrl ?? this.getMobileUrl(provider) ?? provider.webUrl; } else if (browser === 'IOS') { - return provider.urls?.iOSAppStore ?? this.getBrowserUrl(provider) ?? provider.urls?.about; + return provider.iOSAppStoreUrl ?? this.getBrowserUrl(provider) ?? provider.webUrl; } else if (browser === 'Android') { - return provider.urls?.androidAppStore ?? this.getBrowserUrl(provider) ?? provider.urls?.about; + return provider.googlePlayStoreUrl ?? this.getBrowserUrl(provider) ?? provider.webUrl; } else { - return this.getBrowserUrl(provider) ?? provider.urls?.about ?? this.getMobileUrl(provider); + return this.getBrowserUrl(provider) ?? provider.webUrl ?? this.getMobileUrl(provider); } } @@ -70,6 +70,10 @@ export class Modal { const browser = getBrowser(); const mobile = getPlatform(); + const notInstalledProviders = this.defaultProviders.filter( + p => this.installedProviders.findIndex(i => i.id === p.id) === -1 // keep providers NOT already in installed list + ); + return (
@@ -85,7 +89,7 @@ export class Modal {
- {this.registeredProviders.length === 0 ? ( + {this.installedProviders.length === 0 ? (

No installed wallets detected. You can install one from the list below.

@@ -108,19 +112,19 @@ export class Modal {
{/* INSTALLED SECTION */} - {this.registeredProviders.length > 0 && ( + {this.installedProviders.length > 0 && (

INSTALLED

- {this.registeredProviders.map((provider: StxProvider) => ( + {this.installedProviders.map((provider: WebBTCProvider) => (
{`${provider.name}
{provider.name}
- {provider.urls?.about && ( + {provider.webUrl && ( @@ -139,20 +143,20 @@ export class Modal {
)} - {/* DEFAULT SECTION */} - {this.defaultProviders.length > 0 && ( + {/* NOT INSTALLED DEFAULT SECTION */} + {notInstalledProviders.length > 0 && (

POPULAR

- {this.defaultProviders.map((provider: StxProvider) => ( + {notInstalledProviders.map((provider: WebBTCProvider) => (
{`${provider.name}
{provider.name}
- {provider.urls?.about && ( + {provider.webUrl && ( { if (typeof window === 'undefined') return []; if (!window.webbtc_stx_providers) return []; - return window.webbtc_stx_providers as StxProvider[]; + return window.webbtc_stx_providers; +}; + +export const getInstalledProviders = (defaultProviders: WebBTCProvider[] = []) => { + if (typeof window === 'undefined') return []; + + const registeredProviders = getRegisteredProviders(); + + const additionalInstalledProviders = defaultProviders.filter(dp => { + // already registered, don't add again + if (registeredProviders.find(rp => rp.id === dp.id)) return false; + + // check if default provider is installed (even if not registered) + const provider = dp.id.split('.').reduce((acc, part) => acc?.[part], window); + return !!provider; + }); + + return registeredProviders.concat(additionalInstalledProviders); }; diff --git a/packages/connect/src/index.ts b/packages/connect/src/index.ts index e895fb68..9f7762a5 100644 --- a/packages/connect/src/index.ts +++ b/packages/connect/src/index.ts @@ -7,4 +7,11 @@ export * from './profile'; export * from './types'; export * from './utils'; export * from './ui'; + +// re-exports export * from '@stacks/auth'; +export { + clearSelectedProvider, + getSelectedProvider, + setSelectedProvider, +} from '@stacks/connect-ui'; diff --git a/packages/connect/src/stories/Connect.stories.tsx b/packages/connect/src/stories/Connect.stories.tsx index 0bd7af8e..eca3e536 100644 --- a/packages/connect/src/stories/Connect.stories.tsx +++ b/packages/connect/src/stories/Connect.stories.tsx @@ -38,11 +38,7 @@ const ConnectWithMockedWallet = () => { alert('MockedProvider.authenticationRequest()'); }, }; - return ( - - - - ); + return ; }; export const WithMockedWallet = { render: () => , diff --git a/packages/connect/src/stories/ConnectPage.tsx b/packages/connect/src/stories/ConnectPage.tsx index 039a9525..fa2df273 100644 --- a/packages/connect/src/stories/ConnectPage.tsx +++ b/packages/connect/src/stories/ConnectPage.tsx @@ -1,4 +1,5 @@ import { showConnect } from '@stacks/connect'; +import { clearSelectedProvider } from '@stacks/connect-ui'; export const ConnectPage = ({ children }: { children?: any }) => { function connect() { @@ -13,6 +14,7 @@ export const ConnectPage = ({ children }: { children?: any }) => { return (
+ {children}
); diff --git a/packages/connect/src/ui.ts b/packages/connect/src/ui.ts index d8aff72b..f1522575 100644 --- a/packages/connect/src/ui.ts +++ b/packages/connect/src/ui.ts @@ -1,4 +1,4 @@ -import { StxProvider, getRegisteredProviders, getSelectedProvider } from '@stacks/connect-ui'; +import { WebBTCProvider, getInstalledProviders, getSelectedProvider } from '@stacks/connect-ui'; import { defineCustomElements } from '@stacks/connect-ui/loader'; import { authenticate } from './auth'; import { signMessage } from './signature'; @@ -17,30 +17,29 @@ import type { AuthOptions } from './types/auth'; // todo: look into chrome extension url assets // todo: flatten urls? -/** @ignore */ -export const DEFAULT_PROVIDERS: StxProvider[] = [ +export const DEFAULT_PROVIDERS: WebBTCProvider[] = [ { id: 'LeatherProvider', name: 'Leather', icon: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgdmlld0JveD0iMCAwIDEyOCAxMjgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiByeD0iMjYuODM4NyIgZmlsbD0iIzEyMTAwRiIvPgo8cGF0aCBkPSJNNzQuOTE3MSA1Mi43MTE0QzgyLjQ3NjYgNTEuNTQwOCA5My40MDg3IDQzLjU4MDQgOTMuNDA4NyAzNy4zNzYxQzkzLjQwODcgMzUuNTAzMSA5MS44OTY4IDM0LjIxNTQgODkuNjg3MSAzNC4yMTU0Qzg1LjUwMDQgMzQuMjE1NCA3OC40MDYxIDQwLjUzNjggNzQuOTE3MSA1Mi43MTE0Wk0zOS45MTEgODMuNDk5MUMzMC4wMjU2IDgzLjQ5OTEgMjkuMjExNSA5My4zMzI0IDM5LjA5NjkgOTMuMzMyNEM0My41MTYzIDkzLjMzMjQgNDguODY2MSA5MS41NzY0IDUxLjY1NzMgODguNDE1N0M0Ny41ODY4IDg0LjkwMzggNDQuMjE0MSA4My40OTkxIDM5LjkxMSA4My40OTkxWk0xMDIuODI5IDc5LjI4NDhDMTAzLjQxIDk1Ljc5MDcgOTUuMDM2OSAxMDUuMDM5IDgwLjg0ODQgMTA1LjAzOUM3Mi40NzQ4IDEwNS4wMzkgNjguMjg4MSAxMDEuODc4IDU5LjMzMyA5Ni4wMjQ5QzU0LjY4MSAxMDEuMTc2IDQ1Ljg0MjMgMTA1LjAzOSAzOC41MTU0IDEwNS4wMzlDMTMuMjc4NSAxMDUuMDM5IDE0LjMyNTIgNzIuODQ2MyA0MC4wMjczIDcyLjg0NjNDNDUuMzc3MSA3Mi44NDYzIDQ5LjkxMjggNzQuMjUxMSA1NS43Mjc3IDc3Ljg4TDU5LjU2NTYgNjQuNDE3N0M0My43NDg5IDYwLjA4NjQgMzUuODQwNSA0Ny45MTE4IDQzLjYzMjYgMzAuNDY5M0g1Ni4xOTI5QzQ5LjIxNSA0Mi4wNTg2IDUzLjk4MzIgNTEuNjU3OCA2Mi44MjIgNTIuNzExNEM2Ny41OTAzIDM1LjczNzIgNzcuODI0NiAyMi41MDkgOTEuNDMxNiAyMi41MDlDOTkuMTA3NCAyMi41MDkgMTA1LjE1NSAyNy41NDI4IDEwNS4xNTUgMzYuNjczN0MxMDUuMTU1IDUxLjMwNjYgODYuMDgxOSA2My4yNDcxIDcxLjY2MDcgNjQuNDE3N0w2NS43Mjk1IDg1LjM3MjFDNzIuNDc0OCA5My4yMTUzIDkxLjE5OSAxMDAuODI0IDkxLjE5OSA3OS4yODQ4SDEwMi44MjlaIiBmaWxsPSIjRjVGMUVEIi8+Cjwvc3ZnPgo=', - urls: { - webUrl: 'https://leather.io', - chromeWebStore: - 'https://chrome.google.com/webstore/detail/hiro-wallet/ldinpeekobnhjjdofggfgjlcehhmanlj', - mozillaWebStore: 'https://addons.mozilla.org/en-US/firefox/addon/hiro-wallet', - }, + + webUrl: 'https://leather.io', + chromeWebStoreUrl: + 'https://chrome.google.com/webstore/detail/hiro-wallet/ldinpeekobnhjjdofggfgjlcehhmanlj', + mozillaAddOnsUrl: 'https://addons.mozilla.org/en-US/firefox/addon/hiro-wallet', + googlePlayStoreUrl: 'https://play.google.com/store/apps/details?id=io.hiro.wallet', + iOSAppStoreUrl: 'https://apps.apple.com/app/hiro-wallet/id1492380872', }, { id: 'XverseProviders.StacksProvider', name: 'Xverse Wallet', icon: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjQwIiBoZWlnaHQ9IjQwIiByeD0iMTAuMjkyNCIgZmlsbD0iIzEyMTUxRSIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExLjk0OTQgMTEuMTAxQzE2LjUxMjIgNi45NjYzMiAyMy40ODgxIDYuOTY2MzUgMjguMDUwOSAxMS4xMDFMMjYuOTg3MiAxMi4xNjQ3QzIzLjAxMzQgOC42MTQ2NiAxNi45ODcgOC42MTQ2MyAxMy4wMTMxIDEyLjE2NDZMMTEuOTQ5NCAxMS4xMDFaTTI4Ljg5OTQgMTEuOTQ5NkwyNy44MzU4IDEzLjAxMzNDMzEuMzg1NSAxNi45ODcxIDMxLjM4NTUgMjMuMDEzMyAyNy44MzU2IDI2Ljk4NzFMMjguODk5MiAyOC4wNTA4QzMzLjAzMzggMjMuNDg4MSAzMy4wMzM4IDE2LjUxMjQgMjguODk5NCAxMS45NDk2Wk0xMy4wMTMzIDI3LjgzNTdDMTYuOTg3MSAzMS4zODU1IDIzLjAxMzIgMzEuMzg1NSAyNi45ODcgMjcuODM1NkwyOC4wNTA3IDI4Ljg5OTNDMjMuNDg3OSAzMy4wMzM4IDE2LjUxMjQgMzMuMDMzOCAxMS45NDk2IDI4Ljg5OTRMMTMuMDEzMyAyNy44MzU3Wk0xMi4xNjQ3IDI2Ljk4NzJMMTEuMTAxIDI4LjA1MDlDNi45NjYzOCAyMy40ODgxIDYuOTY2MzIgMTYuNTEyNCAxMS4xMDA4IDExLjk0OTVMMTIuMTY0NSAxMy4wMTMyQzguNjE0NjMgMTYuOTg3MSA4LjYxNDY5IDIzLjAxMzQgMTIuMTY0NyAyNi45ODcyWk0yNy40Nzg2IDE0Ljk4OTZDMjcuMTU3OSAxNC41MTIxIDI2Ljc4NjQgMTQuMDU4NSAyNi4zNjQzIDEzLjYzNjRDMjMuNTY4MiAxMC44NDAyIDE5LjM4OTkgMTAuMjY4NSAxNi4wMjg2IDExLjkyMTRMMTYuNzgxOSAxMy4yMjYxQzE5LjU2NjQgMTEuOTAzMiAyMi45OTc3IDEyLjM5NDEgMjUuMzAyMiAxNC42OTg1QzI1LjYyOTMgMTUuMDI1NiAyNS45MTk4IDE1LjM3NTQgMjYuMTczOCAxNS43NDI5TDI3LjQ3ODYgMTQuOTg5NlpNMjYuNzc0NSAxNi43ODE3TDI4LjA3OTMgMTYuMDI4NEMyOS43MzIyIDE5LjM4OTggMjkuMTYwNiAyMy41NjgyIDI2LjM2NDMgMjYuMzY0NEMyNS45NDIyIDI2Ljc4NjYgMjUuNDg4NSAyNy4xNTggMjUuMDEwOCAyNy40Nzg4TDI0LjI1NzYgMjYuMTc0MUMyNC42MjUxIDI1LjkyIDI0Ljk3NSAyNS42Mjk0IDI1LjMwMjIgMjUuMzAyMkMyNy42MDY3IDIyLjk5NzcgMjguMDk3NSAxOS41NjYyIDI2Ljc3NDUgMTYuNzgxN1pNMjMuMjE4NyAyNi43NzQ3QzIwLjQzNDIgMjguMDk3NSAxNy4wMDI5IDI3LjYwNjYgMTQuNjk4NSAyNS4zMDIyQzE0LjM3MTIgMjQuOTc0OSAxNC4wODA1IDI0LjYyNDkgMTMuODI2NCAyNC4yNTczTDEyLjUyMTcgMjUuMDEwNkMxMi44NDI1IDI1LjQ4ODMgMTMuMjE0IDI1Ljk0MjEgMTMuNjM2MyAyNi4zNjQ0QzE2LjQzMjUgMjkuMTYwNSAyMC42MTA3IDI5LjczMjIgMjMuOTcyIDI4LjA3OTRMMjMuMjE4NyAyNi43NzQ3Wk0xMS45MjExIDIzLjk3MTdMMTMuMjI1OCAyMy4yMTg0QzExLjkwMzMgMjAuNDM0IDEyLjM5NDIgMTcuMDAyOSAxNC42OTg1IDE0LjY5ODVDMTUuMDI1NyAxNC4zNzE0IDE1LjM3NTUgMTQuMDgwOCAxNS43NDMgMTMuODI2N0wxNC45ODk3IDEyLjUyMkMxNC41MTIxIDEyLjg0MjggMTQuMDU4NSAxMy4yMTQyIDEzLjYzNjMgMTMuNjM2NEMxMC44NDAzIDE2LjQzMjQgMTAuMjY4NSAyMC42MTA0IDExLjkyMTEgMjMuOTcxN1pNMjQuMjQyOCAxNS43NTc0QzI1LjEyODcgMTYuNjQzMyAyNS42Nzk3IDE3LjczNzMgMjUuODk1NyAxOC44ODIxTDI0LjM4OTIgMTkuMDEzOUMyNC4yMDkzIDE4LjIwOTcgMjMuODA2NCAxNy40NDU0IDIzLjE4MDYgMTYuODE5NUMyMi4zNTU2IDE1Ljk5NDUgMjEuMjg5NyAxNS41NTY5IDIwLjIwOTIgMTUuNTA3TDIwLjA3NzQgMTQuMDAwNUMyMS41ODcxIDE0LjAxOTggMjMuMDkwOSAxNC42MDU0IDI0LjI0MjggMTUuNzU3NFpNMTguODgyIDE0LjEwNDVDMTcuNzM3MyAxNC4zMjA2IDE2LjY0MzMgMTQuODcxNSAxNS43NTc1IDE1Ljc1NzRDMTQuNjA1NiAxNi45MDkyIDE0LjAyIDE4LjQxMjkgMTQuMDAwNiAxOS45MjI1TDE1LjUwNzEgMTkuNzkwN0MxNS41NTcxIDE4LjcxMDMgMTUuOTk0NiAxNy42NDQ2IDE2LjgxOTYgMTYuODE5NUMxNy40NDU0IDE2LjE5MzggMTguMjA5NyAxNS43OTA5IDE5LjAxMzggMTUuNjExTDE4Ljg4MiAxNC4xMDQ1Wk0xNC4xMDQ2IDIxLjExOEMxNC4zMjA2IDIyLjI2MjggMTQuODcxNSAyMy4zNTY4IDE1Ljc1NzUgMjQuMjQyN0MxNi45MDkzIDI1LjM5NDYgMTguNDEzIDI1Ljk4MDIgMTkuOTIyNiAyNS45OTk2TDE5Ljc5MDcgMjQuNDkzMUMxOC43MTA0IDI0LjQ0MyAxNy42NDQ2IDI0LjAwNTUgMTYuODE5NiAyMy4xODA1QzE2LjE5MzggMjIuNTU0NyAxNS43OTEgMjEuNzkwNCAxNS42MTExIDIwLjk4NjJMMTQuMTA0NiAyMS4xMThaTTI0LjI0MjggMjQuMjQyN0MyMy4zNTY5IDI1LjEyODYgMjIuMjYyOCAyNS42Nzk2IDIxLjExOCAyNS44OTU2TDIwLjk4NjIgMjQuMzg5MUMyMS43OTA0IDI0LjIwOTIgMjIuNTU0OCAyMy44MDY0IDIzLjE4MDYgMjMuMTgwNUMyNC4wMDU2IDIyLjM1NTUgMjQuNDQzMiAyMS4yODk3IDI0LjQ5MzIgMjAuMjA5NEwyNS45OTk3IDIwLjA3NzZDMjUuOTgwMyAyMS41ODcyIDI1LjM5NDcgMjMuMDkwOCAyNC4yNDI4IDI0LjI0MjdaIiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfNTA1Nl8yNDIzNjgpIi8+CjxkZWZzPgo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfNTA1Nl8yNDIzNjgiIHgxPSIxMS41NjgxIiB5MT0iMjguNTY5MSIgeDI9IjMyLjc2NjkiIHkyPSI3LjM3MDMzIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IiM1NTY1RjciLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjOUVBN0ZBIi8+CjwvbGluZWFyR3JhZGllbnQ+CjwvZGVmcz4KPC9zdmc+Cg==', - urls: { - about: 'https://www.xverse.app', - chromeWebStore: - 'https://chrome.google.com/webstore/detail/xverse-wallet/idnnbdplmphpflfnlkomgpfbpcgelopg', - androidAppStore: 'https://play.google.com/store/apps/details?id=com.secretkeylabs.xverse', - iOSAppStore: 'https://apps.apple.com/app/xverse-bitcoin-web3-wallet/id1552272513', - }, + + webUrl: 'https://www.xverse.app', + chromeWebStoreUrl: + 'https://chrome.google.com/webstore/detail/xverse-wallet/idnnbdplmphpflfnlkomgpfbpcgelopg', + googlePlayStoreUrl: 'https://play.google.com/store/apps/details?id=com.secretkeylabs.xverse', + iOSAppStoreUrl: 'https://apps.apple.com/app/xverse-bitcoin-web3-wallet/id1552272513', }, ]; @@ -54,10 +53,10 @@ export type ActionOptions = ( | ContractDeployOptions | ContractCallOptions ) & { - defaultProviders?: StxProvider[]; + defaultProviders?: WebBTCProvider[]; }; // todo: are there more? -function buildUiAction any>(action: F) { +function wrapConnectCall any>(action: F) { return async function wrapped(...args: [ActionOptions, StacksProvider?]) { const selectedProvider = args[1] || getSelectedProvider(); if (selectedProvider) return await action(...args); @@ -65,15 +64,12 @@ function buildUiAction any>( if (typeof window === 'undefined') return; void defineCustomElements(window); - const installedProviders = getRegisteredProviders(); const defaultProviders = args[0]?.defaultProviders ?? DEFAULT_PROVIDERS; - const filteredDefaultProviders = defaultProviders.filter( - p => installedProviders.findIndex(i => i.id === p.id) === -1 // keep providers NOT already in installed list - ); + const installedProviders = getInstalledProviders(defaultProviders); const element = document.createElement('connect-modal'); - element.registeredProviders = installedProviders; - element.defaultProviders = filteredDefaultProviders; + element.defaultProviders = defaultProviders; + element.installedProviders = installedProviders; element.callback = () => action(...args); document.body.appendChild(element); @@ -88,8 +84,8 @@ function buildUiAction any>( }; } -export const uiSignMessage = buildUiAction(signMessage); -export const showConnect = buildUiAction(authenticate); +export const uiSignMessage = wrapConnectCall(signMessage); +export const showConnect = wrapConnectCall(authenticate); /** * @deprecated Use the renamed `showConnect` method diff --git a/tsconfig.json b/tsconfig.json index 6f0940c9..64839a50 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -21,7 +21,8 @@ "noUnusedParameters": true, "paths": { - "@stacks/connect/*": ["../connect/src/*"] + "@stacks/connect/*": ["../connect/src/*"], + "@stacks/connect-ui/*": ["../connect-ui/src/*"] } },