diff --git a/src/connectors/argent/argentMobile/index.ts b/src/connectors/argent/argentMobile/index.ts index 1aa5547..c33cb2d 100644 --- a/src/connectors/argent/argentMobile/index.ts +++ b/src/connectors/argent/argentMobile/index.ts @@ -1,3 +1,4 @@ +import sn from "@starknet-io/get-starknet-core" import { type AccountChangeEventHandler } from "@starknet-io/get-starknet-core" import { Permission, @@ -222,7 +223,7 @@ export class ArgentMobileBaseConnector extends Connector { url, icons, rpcUrl: providerRpcUrl, - modalWallet: getModalWallet(this), + modalWallet: getModalWallet(this, await sn.getDiscoveryWallets()), } if (projectId === DEFAULT_PROJECT_ID) { diff --git a/src/helpers/mapModalWallets.ts b/src/helpers/mapModalWallets.ts index 94cd0c4..45c5ace 100644 --- a/src/helpers/mapModalWallets.ts +++ b/src/helpers/mapModalWallets.ts @@ -9,6 +9,7 @@ import { ARGENT_X_ICON } from "../connectors/injected/constants" import type { ModalWallet, StoreVersion } from "../types/modal" import { isInArgentMobileAppBrowser } from "../connectors/argent/helpers" import { extractConnector, findConnectorById } from "./connector" +import { getStoreVersionFromBrowser } from "./getStoreVersionFromBrowser" interface SetConnectorsExpandedParams { availableConnectors: (StarknetkitConnector | StarknetkitCompoundConnector)[] @@ -23,7 +24,13 @@ export function getModalWallet( | StarknetkitConnector | StarknetkitCompoundConnector, discoveryWallets?: WalletProvider[], + _storeVersion?: StoreVersion | null, ): ModalWallet { + let storeVersion = _storeVersion + if (!storeVersion) { + storeVersion = getStoreVersionFromBrowser() + } + const connector = extractConnector( connectorOrCompoundConnector, ) as StarknetkitConnector @@ -32,6 +39,11 @@ export function getModalWallet( connectorOrCompoundConnector as StarknetkitCompoundConnector ).isCompoundConnector + const downloads = discoveryWallets?.find( + (d) => + d.id === (connector.id === "argentMobile" ? "argentX" : connector.id), + )?.downloads + return { name: isCompoundConnector ? connectorOrCompoundConnector.name @@ -50,7 +62,8 @@ export function getModalWallet( "subtitle" in connector && isString(connector.subtitle) ? connector.subtitle : undefined, - downloads: discoveryWallets?.find((d) => d.id === connector.id)?.downloads, + download: downloads?.[storeVersion as keyof typeof downloads], + downloads: downloads, } } @@ -92,6 +105,7 @@ export const mapModalWallets = ({ if (installed) { let icon let name + let download if (isCompoundConnector) { icon = _c.icon @@ -107,13 +121,18 @@ export const mapModalWallets = ({ name = installed.name } + const downloads = discoveryWallets.find( + (d) => d.id === (installed.id === "argentMobile" ? "argentX" : c?.id), + )?.downloads + return { name, id: installed.id, icon, connector: _c, installed: true, - downloads: discoveryWallets.find((d) => d.id === c?.id)?.downloads, + download: downloads?.[storeVersion as keyof typeof downloads], + downloads: downloads, } } diff --git a/src/main.ts b/src/main.ts index f151f39..1b55a87 100644 --- a/src/main.ts +++ b/src/main.ts @@ -170,7 +170,7 @@ export const connect = async ({ modal.$set({ selectedWallet: modalWallet }) if (!modalWallet.installed) { - modal.$set({ layout: Layout.extensionDownloadList }) + modal.$set({ layout: Layout.download }) return } @@ -223,7 +223,7 @@ export const connect = async ({ theme: modalTheme === "system" ? null : (modalTheme ?? null), modalWallets, }, - }) as ModalInstance // Prevents vite build errors + }) as unknown as ModalInstance // Prevents vite build errors }) } diff --git a/src/modal/Modal.svelte b/src/modal/Modal.svelte index dbeb81f..29bb135 100644 --- a/src/modal/Modal.svelte +++ b/src/modal/Modal.svelte @@ -9,8 +9,7 @@ import ArgentMobileQR from "./layouts/argent/ArgentMobileQR.svelte" import FailedLogin from "./layouts/FailedLogin.svelte" import SuccessfulLogin from "./layouts/SuccessfulLogin.svelte" - import ArgentDownload from "./layouts/argent/ArgentDownload/ArgentDownload.svelte" - import ExtensionDownloadList from "./layouts/ExtensionDownloadList/ExtensionDownloadList.svelte" + import DownloadWallet from "./layouts/DownloadWallet/DownloadWallet.svelte" import DynamicIcon from "./components/DynamicIcon.svelte" import { isInArgentMobileAppBrowser } from "../connectors/argent/helpers" @@ -18,6 +17,7 @@ import { StarknetkitCompoundConnector } from "../connectors" import { ArgentX } from "../connectors/injected/argentX" import { getModalWallet } from "../helpers/mapModalWallets" + import { getStoreVersionFromBrowser } from "../helpers/getStoreVersionFromBrowser" let nodeRef: HTMLElement | undefined @@ -117,11 +117,14 @@ handleFallback={() => callback(selectedWallet, true)} /> {:else if layout === Layout.qrCode} - setLayout(Layout.argentDownload)} /> - {:else if layout === Layout.extensionDownloadList} - - {:else if layout === Layout.argentDownload} - setLayout(Layout.extensionDownloadList)} /> + setLayout(Layout.download)} /> + {:else if layout === Layout.download} + {/if} diff --git a/src/modal/layouts/DownloadWallet/DownloadWallet.svelte b/src/modal/layouts/DownloadWallet/DownloadWallet.svelte new file mode 100644 index 0000000..10b7441 --- /dev/null +++ b/src/modal/layouts/DownloadWallet/DownloadWallet.svelte @@ -0,0 +1,85 @@ + + +
+
+ {#if isArgent} + + + + + + + + Download + + + + + + + {/if} + + {#if store && storeLink} + + +
+ Install for {storeData[store].name} +
+
+ + + {#if isArgent} + + {:else} + + {/if} + +
+ {/if} +
+ +
+ {#if isArgent} + +

If you want to learn more about argent visit our site: + www.argent.xyz +

+ {/if} +
+
\ No newline at end of file diff --git a/src/modal/layouts/argent/ArgentDownload/ArgentDownloadItem.svelte b/src/modal/layouts/DownloadWallet/DownloadWalletItem.svelte similarity index 71% rename from src/modal/layouts/argent/ArgentDownload/ArgentDownloadItem.svelte rename to src/modal/layouts/DownloadWallet/DownloadWalletItem.svelte index d6dcf29..1aba606 100644 --- a/src/modal/layouts/argent/ArgentDownload/ArgentDownloadItem.svelte +++ b/src/modal/layouts/DownloadWallet/DownloadWalletItem.svelte @@ -1,5 +1,5 @@
-
+
-

{title}

+

{title}

{subtitle}

-
+
diff --git a/src/modal/layouts/argent/ArgentDownload/graphics/MobileGraphic.svelte b/src/modal/layouts/DownloadWallet/graphics/ArgentMobileGraphic.svelte similarity index 100% rename from src/modal/layouts/argent/ArgentDownload/graphics/MobileGraphic.svelte rename to src/modal/layouts/DownloadWallet/graphics/ArgentMobileGraphic.svelte diff --git a/src/modal/layouts/argent/ArgentDownload/graphics/ArgentXGraphic.svelte b/src/modal/layouts/DownloadWallet/graphics/ArgentXGraphic.svelte similarity index 100% rename from src/modal/layouts/argent/ArgentDownload/graphics/ArgentXGraphic.svelte rename to src/modal/layouts/DownloadWallet/graphics/ArgentXGraphic.svelte diff --git a/src/modal/layouts/DownloadWallet/graphics/GeneralizedGraphic.svelte b/src/modal/layouts/DownloadWallet/graphics/GeneralizedGraphic.svelte new file mode 100644 index 0000000..82f5712 --- /dev/null +++ b/src/modal/layouts/DownloadWallet/graphics/GeneralizedGraphic.svelte @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadItem.svelte b/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadItem.svelte deleted file mode 100644 index b72f24d..0000000 --- a/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadItem.svelte +++ /dev/null @@ -1,19 +0,0 @@ - - -
  • - -
    -

    - Download {extensionName} for - {browser} -

    - -
    -
    -
  • diff --git a/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadList.svelte b/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadList.svelte deleted file mode 100644 index 6f94e88..0000000 --- a/src/modal/layouts/ExtensionDownloadList/ExtensionDownloadList.svelte +++ /dev/null @@ -1,34 +0,0 @@ - - -
    - {#if downloadLinks} -
      - {#if downloadLinks.chrome} - - {/if} - {#if downloadLinks.firefox} - - {/if} - {#if downloadLinks.edge} - - {/if} - {#if downloadLinks.chrome} - - {/if} -
    - {/if} -
    \ No newline at end of file diff --git a/src/modal/layouts/argent/ArgentDownload/ArgentDownload.svelte b/src/modal/layouts/argent/ArgentDownload/ArgentDownload.svelte deleted file mode 100644 index 884405a..0000000 --- a/src/modal/layouts/argent/ArgentDownload/ArgentDownload.svelte +++ /dev/null @@ -1,56 +0,0 @@ - - -
    -
    - - - - - - - - - - - - {#if showInstallExtension} - - - - - - - - - - - - - {/if} -
    - - -
    \ No newline at end of file diff --git a/src/types/modal.ts b/src/types/modal.ts index c6b36cd..97bff1f 100644 --- a/src/types/modal.ts +++ b/src/types/modal.ts @@ -18,8 +18,7 @@ export enum Layout { success = "success", failure = "failure", qrCode = "qrCode", - argentDownload = "argentDownload", - extensionDownloadList = "extensionDownloadList", + download = "download", } export interface ConnectOptions extends GetWalletOptions {