diff --git a/package.json b/package.json index 26feba4..994a917 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "starknetkit", - "version": "1.0.3", + "version": "1.0.6", "repository": "github:argentlabs/starknetkit", "private": false, "browser": { diff --git a/src/connectors/argentMobile/index.ts b/src/connectors/argentMobile/index.ts index 395e78c..6759a8d 100644 --- a/src/connectors/argentMobile/index.ts +++ b/src/connectors/argentMobile/index.ts @@ -145,6 +145,21 @@ export class ArgentMobileConnector extends Connector { url, } + if (projectId === DEFAULT_PROJECT_ID) { + console.log("========= NOTICE =========") + console.log( + "While your application will continue to function, we highly recommended", + ) + console.log("signing up for your own API keys.") + console.log( + "Go to WalletConnect Cloud (https://cloud.walletconnect.com) and create a new account.", + ) + console.log( + "Once your account is created, create a new project and collect the Project ID", + ) + console.log("==========================") + } + const _wallet = await getStarknetWindowObject(options) this._wallet = _wallet } diff --git a/src/connectors/argentMobile/modal/starknet/adapter.ts b/src/connectors/argentMobile/modal/starknet/adapter.ts index 39366e0..8c4152a 100644 --- a/src/connectors/argentMobile/modal/starknet/adapter.ts +++ b/src/connectors/argentMobile/modal/starknet/adapter.ts @@ -36,8 +36,8 @@ export class StarknetAdapter extends NamespaceAdapter implements ConnectedStarknetWindowObject { - id = "starknetkit" - name = "Starknet Kit" + id = "argentMobile" + name = "Argent Mobile" version = "0.1.0" icon = "" provider: ProviderInterface diff --git a/src/helpers/lastConnected.ts b/src/helpers/lastConnected.ts new file mode 100644 index 0000000..aa34de6 --- /dev/null +++ b/src/helpers/lastConnected.ts @@ -0,0 +1,7 @@ +export const setStarknetLastConnectedWallet = (id: string) => { + localStorage.setItem("starknetLastConnectedWallet", id) +} + +export const removeStarknetLastConnectedWallet = () => { + localStorage.removeItem("starknetLastConnectedWallet") +} diff --git a/src/main.ts b/src/main.ts index 118f185..bb936a1 100644 --- a/src/main.ts +++ b/src/main.ts @@ -9,6 +9,10 @@ import { mapModalWallets } from "./helpers/mapModalWallets" import { resetWalletConnect } from "./helpers/resetWalletConnect" import Modal from "./modal/Modal.svelte" import type { ConnectOptions, ModalWallet } from "./types/modal" +import { + removeStarknetLastConnectedWallet, + setStarknetLastConnectedWallet, +} from "./helpers/lastConnected" export const connect = async ({ modalMode = "canAsk", @@ -28,9 +32,9 @@ export const connect = async ({ }) : connectors - const lastWallet = await sn.getLastConnectedWallet() + const lastWalletId = localStorage.getItem("starknetLastConnectedWallet") if (modalMode === "neverAsk") { - const connector = availableConnectors.find((c) => c.id === lastWallet?.id) + const connector = availableConnectors.find((c) => c.id === lastWalletId) await connector?.connect() return connector?.wallet || null } @@ -38,19 +42,19 @@ export const connect = async ({ const installedWallets = await sn.getAvailableWallets(restOptions) // we return/display wallet options once per first-dapp (ever) connect - if (modalMode === "canAsk" && lastWallet) { + if (modalMode === "canAsk" && lastWalletId) { const preAuthorizedWallets = await sn.getPreAuthorizedWallets({ ...restOptions, }) const wallet = - preAuthorizedWallets.find((w) => w.id === lastWallet?.id) ?? + preAuthorizedWallets.find((w) => w.id === lastWalletId) ?? installedWallets.length === 1 ? installedWallets[0] : undefined if (wallet) { - const connector = availableConnectors.find((c) => c.id === lastWallet?.id) + const connector = availableConnectors.find((c) => c.id === lastWalletId) await connector?.connect() return wallet } // otherwise fallback to modal @@ -70,6 +74,9 @@ export const connect = async ({ dappName, callback: async (value: StarknetWindowObject | null) => { try { + if (value.id !== "argentWebWallet") { + setStarknetLastConnectedWallet(value.id) + } resolve(value) } finally { setTimeout(() => modal.$destroy()) @@ -84,5 +91,6 @@ export const connect = async ({ export function disconnect(options: DisconnectOptions = {}): Promise { resetWalletConnect() + removeStarknetLastConnectedWallet() return sn.disconnect(options) } diff --git a/src/modal/ConnectorButton.svelte b/src/modal/ConnectorButton.svelte index b3895a5..518cafc 100644 --- a/src/modal/ConnectorButton.svelte +++ b/src/modal/ConnectorButton.svelte @@ -14,11 +14,15 @@ href={wallet.download} target="_blank" rel="noopener noreferrer" - class="rounded-md focus:outline-none focus:ring-2 focus:ring-neutral-200 dark:focus:ring-neutral-700 transition-colors" + class={`starknetkit-rounded-md focus:starknetkit-outline-none focus:starknetkit-ring-2 + focus:starknetkit-ring-neutral-200 dark:focus:starknetkit-ring-neutral-700 starknetkit-transition-colors`} >
  • { cb(null) }} @@ -29,16 +33,26 @@ }} > -

    +

    Install {wallet.name}

    - {wallet.name} + {wallet.name}
  • {:else}
  • { @@ -51,16 +65,22 @@ }} > -
    -

    {wallet.title ?? wallet.name}

    -

    {wallet.subtitle ?? ""}

    +
    +

    + {wallet.title ?? wallet.name} +

    +

    + {wallet.subtitle ?? ""} +

    {#if loadingItem === wallet?.id}
    - Loading... + Loading...
    {:else if isSvg}
    {@html wallet.icon}
    {:else} - {wallet?.name} + {wallet?.name} {/if}
  • {/if} diff --git a/src/modal/Modal.svelte b/src/modal/Modal.svelte index ecf2487..6358e24 100644 --- a/src/modal/Modal.svelte +++ b/src/modal/Modal.svelte @@ -46,7 +46,7 @@ (theme === null && window.matchMedia("(prefers-color-scheme: dark)").matches) ) { - darkModeControlClass = "dark" + darkModeControlClass = "starknetkit-dark" } else { darkModeControlClass = "" } @@ -74,8 +74,8 @@ {#if !isInAppBrowser && !emailOnly}
    cb(null)} on:keyup={(e) => { if (e.key === "Escape") { @@ -86,21 +86,39 @@
    e.stopPropagation()} on:keyup={(e) => { e.stopPropagation() }} > -
    -

    Connect to

    +
    +

    + Connect to +

    {dappName}

    -
      +
        {#each modalWallets as wallet} {/each} @@ -142,7 +160,7 @@ @import url("https://fonts.googleapis.com/css2?family=Barlow:wght@500;600&display=swap"); - * { + .starknetkit-font { font-family: "Barlow", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; @@ -152,7 +170,7 @@ font-feature-settings: "kern"; } - .l2 { + .starknetkit-l2 { color: #8c8c8c; font-size: 12px; font-weight: 500; @@ -161,7 +179,7 @@ text-align: left; } - p { + .starknetkit-p { margin: 0; } diff --git a/tailwind.config.cjs b/tailwind.config.cjs index 62ff797..92b05b9 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -2,12 +2,13 @@ module.exports = { content: ["./src/**/*.{svelte,ts}"], darkMode: "class", + prefix: "starknetkit-", theme: { extend: { boxShadow: { "list-item": "0px 2px 12px rgba(0, 0, 0, 0.12)", - "modal": "0px 4px 20px rgba(0, 0, 0, 0.5)" - } + modal: "0px 4px 20px rgba(0, 0, 0, 0.5)", + }, }, }, plugins: [],