From 4561314d13411a5854a278d707895ddd8efcfdc6 Mon Sep 17 00:00:00 2001
From: Roland Bewick <roland.bewick@gmail.com>
Date: Mon, 13 May 2024 20:22:41 +0700
Subject: [PATCH 1/5] chore: simplify conditional balance display and bitcoin
 connect store

---
 package.json                                  |  2 +-
 src/api.ts                                    | 31 +--------
 src/components/BitcoinConnectElement.ts       | 35 ++--------
 src/components/bc-balance.ts                  | 13 +---
 src/components/bc-button.ts                   | 23 ++-----
 src/components/bc-start.ts                    | 24 ++-----
 .../connectors/bc-alby-nwc-connector.ts       |  4 +-
 src/components/pages/bc-umbrel.ts             |  2 +-
 src/state/store.ts                            | 65 +++++++++----------
 src/types/BitcoinConnectConfig.ts             | 27 ++++++++
 10 files changed, 84 insertions(+), 142 deletions(-)
 create mode 100644 src/types/BitcoinConnectConfig.ts

diff --git a/package.json b/package.json
index 30eb03d..c369869 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@getalby/bitcoin-connect",
-  "version": "3.4.1",
+  "version": "3.4.2",
   "description": "Web components to connect to a lightning wallet and power a website with WebLN",
   "type": "module",
   "source": "src/index.ts",
diff --git a/src/api.ts b/src/api.ts
index 7e8aa0a..85a8235 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -1,29 +1,7 @@
 import {SendPaymentResponse, WebLNProvider} from '@webbtc/webln-types';
 import store from './state/store';
-import {ConnectorFilter} from './types/ConnectorFilter';
-import {WebLNProviderConfig} from './types/WebLNProviderConfig';
 import {PaymentMethods} from './types/PaymentMethods';
-
-type BitcoinConnectConfig = {
-  /**
-   * Name of the application that the user is interacting with.
-   *   May be passed to the connector the user chooses to connect with (e.g. NWC)
-   */
-  appName?: string;
-  /**
-   * Limit which connectors are shown in the connect flow
-   */
-  filters?: ConnectorFilter[];
-  /**
-   * Set to false to not request or show the user's wallet balance
-   */
-  showBalance?: boolean;
-
-  /**
-   * Customize individual providers (NWC, LNC, LNbits etc)
-   */
-  providerConfig?: WebLNProviderConfig;
-};
+import {BitcoinConnectConfig} from './types/BitcoinConnectConfig';
 
 type LaunchPaymentModalArgs = {
   /**
@@ -193,10 +171,7 @@ export function isConnected() {
  * @param config
  */
 export function init(config: BitcoinConnectConfig = {}) {
-  store.getState().setAppName(config.appName);
-  store.getState().setFilters(config.filters);
-  store.getState().setShowBalance(config.showBalance);
-  store.getState().setProviderConfig(config.providerConfig);
+  store.getState().setBitcoinConnectConfig(config);
 }
 
 /**
@@ -312,5 +287,5 @@ export function disconnect() {
  * @returns the configuration of the current connector (if connected)
  */
 export function getConnectorConfig() {
-  return store.getState().config;
+  return store.getState().connectorConfig;
 }
diff --git a/src/components/BitcoinConnectElement.ts b/src/components/BitcoinConnectElement.ts
index d2d0102..3f9a96b 100644
--- a/src/components/BitcoinConnectElement.ts
+++ b/src/components/BitcoinConnectElement.ts
@@ -1,4 +1,4 @@
-import {property, state} from 'lit/decorators.js';
+import {state} from 'lit/decorators.js';
 import store from '../state/store';
 import {InternalElement} from './internal/InternalElement';
 import {ConnectorFilter} from '../types/ConnectorFilter';
@@ -29,28 +29,13 @@ export class BitcoinConnectElement extends InternalElement {
   @state()
   protected _route: Route;
 
-  @property({
-    type: String,
-    attribute: 'app-name',
-  })
-  appName?: string;
-
-  @property({
-    type: Array,
-    attribute: 'filters',
-    converter(value, _type) {
-      return value?.split(',');
-    },
-  })
-  filters?: ConnectorFilter[];
-
   constructor() {
     super();
     this._connected = store.getState().connected;
     this._connecting = store.getState().connecting;
     this._connectorName = store.getState().connectorName;
-    this._appName = store.getState().appName;
-    this._filters = store.getState().filters;
+    this._appName = store.getState().bitcoinConnectConfig.appName;
+    this._filters = store.getState().bitcoinConnectConfig.filters;
     this._error = store.getState().error;
     this._route = store.getState().route;
     this._modalOpen = store.getState().modalOpen;
@@ -60,21 +45,11 @@ export class BitcoinConnectElement extends InternalElement {
       this._connected = currentState.connected;
       this._connecting = currentState.connecting;
       this._connectorName = currentState.connectorName;
-      this._appName = currentState.appName;
-      this._filters = currentState.filters;
+      this._appName = currentState.bitcoinConnectConfig.appName;
+      this._filters = currentState.bitcoinConnectConfig.filters;
       this._error = currentState.error;
       this._route = currentState.route;
       this._modalOpen = currentState.modalOpen;
     });
   }
-
-  override connectedCallback() {
-    super.connectedCallback();
-    if (this.appName != undefined) {
-      store.getState().setAppName(this.appName);
-    }
-    if (this.filters != undefined) {
-      store.getState().setFilters(this.filters);
-    }
-  }
 }
diff --git a/src/components/bc-balance.ts b/src/components/bc-balance.ts
index 387d660..e6129b2 100644
--- a/src/components/bc-balance.ts
+++ b/src/components/bc-balance.ts
@@ -82,21 +82,10 @@ export class Balance extends withTwind()(BitcoinConnectElement) {
     (async () => {
       try {
         const provider = store.getState().provider;
-        if (!provider) {
+        if (!provider?.getBalance) {
           return;
         }
 
-        const info = store.getState().info;
-        if (
-          !info?.methods ||
-          info.methods.indexOf('getBalance') < 0 ||
-          !provider.getBalance
-        ) {
-          throw new Error(
-            'The current WebLN provider does not support getBalance'
-          );
-        }
-
         const balanceResponse = await provider.getBalance();
         if (balanceResponse) {
           this._balanceSats = balanceResponse.balance;
diff --git a/src/components/bc-button.ts b/src/components/bc-button.ts
index fbc5466..487984c 100644
--- a/src/components/bc-button.ts
+++ b/src/components/bc-button.ts
@@ -9,7 +9,6 @@ import {launchModal} from '../api.js';
 import './bc-balance';
 import store from '../state/store.js';
 import {waitingIcon} from './icons/waitingIcon.js';
-import {GetInfoResponse, WebLNProvider} from '@webbtc/webln-types';
 
 /**
  * A button that when clicked launches the modal.
@@ -21,33 +20,23 @@ export class Button extends withTwind()(BitcoinConnectElement) {
 
   @state()
   protected _showBalance: boolean | undefined = undefined;
-  @state()
-  protected _info: GetInfoResponse | undefined = undefined;
-  @state()
-  protected _provider: WebLNProvider | undefined = undefined;
 
   constructor() {
     super();
 
-    this._showBalance = store.getState().showBalance;
-    this._info = store.getState().info;
-    this._provider = store.getState().provider;
+    this._showBalance =
+      store.getState().bitcoinConnectConfig.showBalance &&
+      store.getState().supportsGetBalance;
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
-      this._showBalance = store.showBalance;
-      this._info = store.info;
-      this._provider = store.provider;
+      this._showBalance =
+        store.bitcoinConnectConfig.showBalance && store.supportsGetBalance;
     });
   }
 
   override render() {
     const isLoading = this._connecting || (!this._connected && this._modalOpen);
-    const showBalance =
-      !!this._showBalance &&
-      !!this._info?.methods &&
-      this._info.methods.indexOf('getBalance') > -1 &&
-      !!this._provider?.getBalance;
 
     return html`<div>
       <div
@@ -76,7 +65,7 @@ export class Button extends withTwind()(BitcoinConnectElement) {
               : html`${this.title}`}
           </span>
         </bci-button>
-        ${this._connected && showBalance
+        ${this._connected && this._showBalance
           ? html`<bc-balance class="select-none cursor-pointer"></bc-balance> `
           : null}
       </div>
diff --git a/src/components/bc-start.ts b/src/components/bc-start.ts
index a25502c..054bfe3 100644
--- a/src/components/bc-start.ts
+++ b/src/components/bc-start.ts
@@ -9,46 +9,34 @@ import {disconnectSection} from './templates/disconnectSection';
 import './bc-balance';
 import store from '../state/store';
 import './bc-currency-switcher';
-import {GetInfoResponse, WebLNProvider} from '@webbtc/webln-types';
 
 // TODO: split up this component into disconnected and connected
 @customElement('bc-start')
 export class Start extends withTwind()(BitcoinConnectElement) {
   @state()
   protected _showBalance: boolean | undefined = undefined;
-  @state()
-  protected _info: GetInfoResponse | undefined = undefined;
-  @state()
-  protected _provider: WebLNProvider | undefined = undefined;
 
   constructor() {
     super();
 
-    this._showBalance = store.getState().showBalance;
-    this._info = store.getState().info;
-    this._provider = store.getState().provider;
+    this._showBalance =
+      store.getState().bitcoinConnectConfig.showBalance &&
+      store.getState().supportsGetBalance;
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
-      this._showBalance = store.showBalance;
-      this._info = store.info;
-      this._provider = store.provider;
+      this._showBalance =
+        store.bitcoinConnectConfig.showBalance && store.supportsGetBalance;
     });
   }
 
   override render() {
-    const showBalance =
-      !!this._showBalance &&
-      !!this._info?.methods &&
-      this._info.methods.indexOf('getBalance') > -1 &&
-      !!this._provider?.getBalance;
-
     return html`<div
       class="flex flex-col justify-center items-center w-full font-sans"
     >
       ${this._connected
         ? html`
-            ${showBalance
+            ${this._showBalance
               ? html`<span
                     class="text-xs font-medium mb-2 ${classes[
                       'text-neutral-secondary'
diff --git a/src/components/connectors/bc-alby-nwc-connector.ts b/src/components/connectors/bc-alby-nwc-connector.ts
index 2855459..5cd4283 100644
--- a/src/components/connectors/bc-alby-nwc-connector.ts
+++ b/src/components/connectors/bc-alby-nwc-connector.ts
@@ -17,10 +17,10 @@ export class AlbyNWCConnector extends ConnectorElement {
 
   protected async _onClick() {
     const nwc = webln.NostrWebLNProvider.withNewSecret();
-    const providerConfig = store.getState().providerConfig;
+    const providerConfig = store.getState().bitcoinConnectConfig.providerConfig;
     await nwc.initNWC({
       ...(providerConfig?.nwc?.authorizationUrlOptions || {}),
-      name: this._appName || 'Bitcoin Connect',
+      name: this._appName,
     });
 
     this._connect({
diff --git a/src/components/pages/bc-umbrel.ts b/src/components/pages/bc-umbrel.ts
index ae8e70b..ecf7c87 100644
--- a/src/components/pages/bc-umbrel.ts
+++ b/src/components/pages/bc-umbrel.ts
@@ -33,7 +33,7 @@ export class UmbrelPage extends withTwind()(BitcoinConnectElement) {
       authorizationUrl: 'http://umbrel.local:58000/apps/new',
     });
     await nwc.initNWC({
-      name: this._appName || 'Bitcoin Connect',
+      name: this._appName,
     });
 
     await store.getState().connect({
diff --git a/src/state/store.ts b/src/state/store.ts
index 9611e47..73ad66b 100644
--- a/src/state/store.ts
+++ b/src/state/store.ts
@@ -3,36 +3,33 @@ import {ConnectorConfig} from '../types/ConnectorConfig';
 import {connectors} from '../connectors';
 import {Connector} from '../connectors/Connector';
 import {Route} from '../components/routes';
-import {ConnectorFilter} from '../types/ConnectorFilter';
 import {GetInfoResponse, WebLNProvider} from '@webbtc/webln-types';
-import {WebLNProviderConfig} from '../types/WebLNProviderConfig';
+import {
+  BitcoinConnectConfig,
+  DEFAULT_BITCOIN_CONNECT_CONFIG,
+} from '../types/BitcoinConnectConfig';
 
 interface Store {
   readonly route: Route;
   readonly routeHistory: Route[];
   readonly connected: boolean;
   readonly connecting: boolean;
-  readonly showBalance: boolean | undefined;
+  readonly supportsGetBalance: boolean | undefined;
   readonly connectorName: string | undefined;
-  readonly appName: string | undefined;
-  readonly filters: ConnectorFilter[] | undefined;
   readonly error: string | undefined;
   readonly modalOpen: boolean;
   readonly provider: WebLNProvider | undefined;
   readonly currency: string | undefined;
-  readonly providerConfig: WebLNProviderConfig | undefined;
   readonly connector: Connector | undefined;
-  readonly config: ConnectorConfig | undefined;
+  readonly connectorConfig: ConnectorConfig | undefined;
+  readonly bitcoinConnectConfig: BitcoinConnectConfig;
   readonly info: GetInfoResponse | undefined;
 
   connect(config: ConnectorConfig): void;
   disconnect(): void;
   pushRoute(route: Route): void;
   popRoute(): void;
-  setAppName(appName: string | undefined): void;
-  setShowBalance(showBalance: boolean | undefined): void;
-  setProviderConfig(providerConfig: WebLNProviderConfig | undefined): void;
-  setFilters(filters: ConnectorFilter[] | undefined): void;
+  setBitcoinConnectConfig(bitcoinConnectConfig: BitcoinConnectConfig): void;
   setError(error: string | undefined): void;
   clearRouteHistory(): void;
   setModalOpen(modalOpen: boolean): void;
@@ -48,28 +45,28 @@ const store = createStore<Store>((set, get) => ({
   routeHistory: [],
   modalOpen: false,
   currency: undefined,
-  showBalance: undefined,
+  supportsGetBalance: false,
   connected: false,
   connecting: false,
   error: undefined,
   alias: undefined,
   balance: undefined,
   connectorName: undefined,
-  appName: undefined,
-  filters: undefined,
   invoice: undefined,
   provider: undefined,
-  providerConfig: undefined,
   connector: undefined,
-  config: undefined,
+  connectorConfig: undefined,
+  bitcoinConnectConfig: DEFAULT_BITCOIN_CONNECT_CONFIG,
   info: undefined,
-  connect: async (config: ConnectorConfig) => {
+  connect: async (connectorConfig: ConnectorConfig) => {
     set({
       connecting: true,
       error: undefined,
     });
     try {
-      const connector = new connectors[config.connectorType](config);
+      const connector = new connectors[connectorConfig.connectorType](
+        connectorConfig
+      );
       const provider = await connector.init();
       await provider.enable();
       let info: GetInfoResponse | undefined;
@@ -79,17 +76,23 @@ const store = createStore<Store>((set, get) => ({
         console.error('Failed to request wallet info');
       }
 
+      const canShowBalance =
+        !!info?.methods &&
+        info.methods.indexOf('getBalance') > -1 &&
+        !!provider?.getBalance;
+
       set({
-        config,
+        connectorConfig: connectorConfig,
         connector,
         connected: true,
         connecting: false,
         info,
+        supportsGetBalance: canShowBalance,
         provider,
-        connectorName: config.connectorName,
+        connectorName: connectorConfig.connectorName,
         route: '/start',
       });
-      saveConfig(config);
+      saveConfig(connectorConfig);
     } catch (error) {
       console.error(error);
       set({
@@ -103,7 +106,7 @@ const store = createStore<Store>((set, get) => ({
   disconnect: () => {
     get().connector?.unload();
     set({
-      config: undefined,
+      connectorConfig: undefined,
       connector: undefined,
       connected: false,
       connectorName: undefined,
@@ -136,17 +139,13 @@ const store = createStore<Store>((set, get) => ({
   setModalOpen: (modalOpen) => {
     set({modalOpen});
   },
-  setAppName: (appName) => {
-    set({appName});
-  },
-  setShowBalance: (showBalance) => {
-    set({showBalance});
-  },
-  setFilters: (filters) => {
-    set({filters});
-  },
-  setProviderConfig: (providerConfig) => {
-    set({providerConfig});
+  setBitcoinConnectConfig: (bitcoinConnectConfig) => {
+    set({
+      bitcoinConnectConfig: {
+        ...DEFAULT_BITCOIN_CONNECT_CONFIG,
+        ...bitcoinConnectConfig,
+      },
+    });
   },
   setError: (error) => {
     set({error});
diff --git a/src/types/BitcoinConnectConfig.ts b/src/types/BitcoinConnectConfig.ts
new file mode 100644
index 0000000..f32594c
--- /dev/null
+++ b/src/types/BitcoinConnectConfig.ts
@@ -0,0 +1,27 @@
+import {ConnectorFilter} from './ConnectorFilter';
+import {WebLNProviderConfig} from './WebLNProviderConfig';
+export type BitcoinConnectConfig = {
+  /**
+   * Name of the application that the user is interacting with.
+   *   May be passed to the connector the user chooses to connect with (e.g. NWC)
+   */
+  appName?: string;
+  /**
+   * Limit which connectors are shown in the connect flow
+   */
+  filters?: ConnectorFilter[];
+  /**
+   * Set to false to not request or show the user's wallet balance
+   */
+  showBalance?: boolean;
+
+  /**
+   * Customize individual providers (NWC, LNC, LNbits etc)
+   */
+  providerConfig?: WebLNProviderConfig;
+};
+
+export const DEFAULT_BITCOIN_CONNECT_CONFIG: BitcoinConnectConfig = {
+  showBalance: true,
+  appName: 'Bitcoin Connect',
+};

From 60fab29ab6e36af72bde55000c55e1ae71dfdc79 Mon Sep 17 00:00:00 2001
From: Roland Bewick <roland.bewick@gmail.com>
Date: Mon, 13 May 2024 20:25:16 +0700
Subject: [PATCH 2/5] chore: minor cleanup

---
 src/state/store.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/state/store.ts b/src/state/store.ts
index 73ad66b..78d5dcd 100644
--- a/src/state/store.ts
+++ b/src/state/store.ts
@@ -76,18 +76,18 @@ const store = createStore<Store>((set, get) => ({
         console.error('Failed to request wallet info');
       }
 
-      const canShowBalance =
+      const supportsGetBalance =
         !!info?.methods &&
         info.methods.indexOf('getBalance') > -1 &&
         !!provider?.getBalance;
 
       set({
-        connectorConfig: connectorConfig,
+        connectorConfig,
         connector,
         connected: true,
         connecting: false,
         info,
-        supportsGetBalance: canShowBalance,
+        supportsGetBalance,
         provider,
         connectorName: connectorConfig.connectorName,
         route: '/start',

From 933f99cbd73761a1001d03e4aef998a76a470512 Mon Sep 17 00:00:00 2001
From: Roland Bewick <roland.bewick@gmail.com>
Date: Tue, 14 May 2024 12:23:28 +0700
Subject: [PATCH 3/5] chore: move supportsGetBalance to generic supportsMethod
 store method

---
 src/components/bc-button.ts |  5 +++--
 src/components/bc-start.ts  |  5 +++--
 src/state/store.ts          | 21 ++++++++++++---------
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/src/components/bc-button.ts b/src/components/bc-button.ts
index 487984c..3888053 100644
--- a/src/components/bc-button.ts
+++ b/src/components/bc-button.ts
@@ -26,12 +26,13 @@ export class Button extends withTwind()(BitcoinConnectElement) {
 
     this._showBalance =
       store.getState().bitcoinConnectConfig.showBalance &&
-      store.getState().supportsGetBalance;
+      store.getState().supportsMethod('getBalance');
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
       this._showBalance =
-        store.bitcoinConnectConfig.showBalance && store.supportsGetBalance;
+        store.bitcoinConnectConfig.showBalance &&
+        store.supportsMethod('getBalance');
     });
   }
 
diff --git a/src/components/bc-start.ts b/src/components/bc-start.ts
index 054bfe3..bed08bf 100644
--- a/src/components/bc-start.ts
+++ b/src/components/bc-start.ts
@@ -21,12 +21,13 @@ export class Start extends withTwind()(BitcoinConnectElement) {
 
     this._showBalance =
       store.getState().bitcoinConnectConfig.showBalance &&
-      store.getState().supportsGetBalance;
+      store.getState().supportsMethod('getBalance');
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
       this._showBalance =
-        store.bitcoinConnectConfig.showBalance && store.supportsGetBalance;
+        store.bitcoinConnectConfig.showBalance &&
+        store.supportsMethod('getBalance');
     });
   }
 
diff --git a/src/state/store.ts b/src/state/store.ts
index 78d5dcd..08226ff 100644
--- a/src/state/store.ts
+++ b/src/state/store.ts
@@ -3,7 +3,7 @@ import {ConnectorConfig} from '../types/ConnectorConfig';
 import {connectors} from '../connectors';
 import {Connector} from '../connectors/Connector';
 import {Route} from '../components/routes';
-import {GetInfoResponse, WebLNProvider} from '@webbtc/webln-types';
+import {GetInfoResponse, WebLNMethod, WebLNProvider} from '@webbtc/webln-types';
 import {
   BitcoinConnectConfig,
   DEFAULT_BITCOIN_CONNECT_CONFIG,
@@ -14,7 +14,6 @@ interface Store {
   readonly routeHistory: Route[];
   readonly connected: boolean;
   readonly connecting: boolean;
-  readonly supportsGetBalance: boolean | undefined;
   readonly connectorName: string | undefined;
   readonly error: string | undefined;
   readonly modalOpen: boolean;
@@ -34,6 +33,7 @@ interface Store {
   clearRouteHistory(): void;
   setModalOpen(modalOpen: boolean): void;
   setCurrency(currency: string | undefined): void;
+  supportsMethod(weblnMethod: WebLNMethod): boolean;
 
   // provider functions
   // getBalance(): Promise<number | undefined>;
@@ -45,7 +45,6 @@ const store = createStore<Store>((set, get) => ({
   routeHistory: [],
   modalOpen: false,
   currency: undefined,
-  supportsGetBalance: false,
   connected: false,
   connecting: false,
   error: undefined,
@@ -76,18 +75,12 @@ const store = createStore<Store>((set, get) => ({
         console.error('Failed to request wallet info');
       }
 
-      const supportsGetBalance =
-        !!info?.methods &&
-        info.methods.indexOf('getBalance') > -1 &&
-        !!provider?.getBalance;
-
       set({
         connectorConfig,
         connector,
         connected: true,
         connecting: false,
         info,
-        supportsGetBalance,
         provider,
         connectorName: connectorConfig.connectorName,
         route: '/start',
@@ -158,6 +151,16 @@ const store = createStore<Store>((set, get) => ({
     }
     set({currency});
   },
+  // TODO: move this method to Alby JS SDK NWCCLient
+  supportsMethod: (method: WebLNMethod) => {
+    const {info, provider} = get();
+
+    return (
+      !!info?.methods &&
+      info.methods.indexOf(method) > -1 &&
+      !!provider?.getBalance
+    );
+  },
 }));
 
 export default store;

From b19cc252198d3affceefc9d53688f41c367ad956 Mon Sep 17 00:00:00 2001
From: Roland Bewick <roland.bewick@gmail.com>
Date: Tue, 14 May 2024 12:24:47 +0700
Subject: [PATCH 4/5] chore: rename supportsMethod to supports

---
 src/components/bc-button.ts | 5 ++---
 src/components/bc-start.ts  | 5 ++---
 src/state/store.ts          | 4 ++--
 3 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/components/bc-button.ts b/src/components/bc-button.ts
index 3888053..6c654e3 100644
--- a/src/components/bc-button.ts
+++ b/src/components/bc-button.ts
@@ -26,13 +26,12 @@ export class Button extends withTwind()(BitcoinConnectElement) {
 
     this._showBalance =
       store.getState().bitcoinConnectConfig.showBalance &&
-      store.getState().supportsMethod('getBalance');
+      store.getState().supports('getBalance');
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
       this._showBalance =
-        store.bitcoinConnectConfig.showBalance &&
-        store.supportsMethod('getBalance');
+        store.bitcoinConnectConfig.showBalance && store.supports('getBalance');
     });
   }
 
diff --git a/src/components/bc-start.ts b/src/components/bc-start.ts
index bed08bf..4a0e6f0 100644
--- a/src/components/bc-start.ts
+++ b/src/components/bc-start.ts
@@ -21,13 +21,12 @@ export class Start extends withTwind()(BitcoinConnectElement) {
 
     this._showBalance =
       store.getState().bitcoinConnectConfig.showBalance &&
-      store.getState().supportsMethod('getBalance');
+      store.getState().supports('getBalance');
 
     // TODO: handle unsubscribe
     store.subscribe((store) => {
       this._showBalance =
-        store.bitcoinConnectConfig.showBalance &&
-        store.supportsMethod('getBalance');
+        store.bitcoinConnectConfig.showBalance && store.supports('getBalance');
     });
   }
 
diff --git a/src/state/store.ts b/src/state/store.ts
index 08226ff..9e32dcb 100644
--- a/src/state/store.ts
+++ b/src/state/store.ts
@@ -33,7 +33,7 @@ interface Store {
   clearRouteHistory(): void;
   setModalOpen(modalOpen: boolean): void;
   setCurrency(currency: string | undefined): void;
-  supportsMethod(weblnMethod: WebLNMethod): boolean;
+  supports(weblnMethod: WebLNMethod): boolean;
 
   // provider functions
   // getBalance(): Promise<number | undefined>;
@@ -152,7 +152,7 @@ const store = createStore<Store>((set, get) => ({
     set({currency});
   },
   // TODO: move this method to Alby JS SDK NWCCLient
-  supportsMethod: (method: WebLNMethod) => {
+  supports: (method: WebLNMethod) => {
     const {info, provider} = get();
 
     return (

From 64b262c4fb395d545716ccadf78e4cd0fa373855 Mon Sep 17 00:00:00 2001
From: Roland Bewick <roland.bewick@gmail.com>
Date: Tue, 14 May 2024 12:31:04 +0700
Subject: [PATCH 5/5] chore: bump patch version

---
 README.md             | 4 ++--
 demos/html/index.html | 2 +-
 react/package.json    | 4 ++--
 react/yarn.lock       | 8 ++++----
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index c2f2083..5fdc348 100644
--- a/README.md
+++ b/README.md
@@ -36,13 +36,13 @@ You can use Bitcoin Connect without any build tools:
 
 ```html
 <script type="module">
-  import {launchModal} from 'https://esm.sh/@getalby/bitcoin-connect@3.4.1'; // jsdelivr.net, skypack.dev also work
+  import {launchModal} from 'https://esm.sh/@getalby/bitcoin-connect@3.4.2'; // jsdelivr.net, skypack.dev also work
 
   // use Bitcoin connect API normally...
   launchModal();
 
   // or if you just want access to the web components:
-  import 'https://esm.sh/@getalby/bitcoin-connect@3.4.1';
+  import 'https://esm.sh/@getalby/bitcoin-connect@3.4.2';
 </script>
 
 <!-- Bitcoin Connect components are now available -->
diff --git a/demos/html/index.html b/demos/html/index.html
index 8121b08..dd05f75 100644
--- a/demos/html/index.html
+++ b/demos/html/index.html
@@ -5,7 +5,7 @@
     <meta charset="utf-8" />
     <title>Bitcoin Connect</title>
     <script type="module">
-      import {onConnected} from 'https://esm.sh/@getalby/bitcoin-connect@3.4.1';
+      import {onConnected} from 'https://esm.sh/@getalby/bitcoin-connect@3.4.2';
       onConnected((provider) => {
         console.log('Connected with provider', provider);
       });
diff --git a/react/package.json b/react/package.json
index e9745ea..2e771b8 100644
--- a/react/package.json
+++ b/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@getalby/bitcoin-connect-react",
-  "version": "3.4.1",
+  "version": "3.4.2",
   "type": "module",
   "source": "src/index.ts",
   "main": "./dist/index.cjs",
@@ -27,7 +27,7 @@
     "build": "microbundle --globals react=React --jsx React.createElement --jsxFragment React.Fragment --jsxImportSource react"
   },
   "dependencies": {
-    "@getalby/bitcoin-connect": "^3.4.1"
+    "@getalby/bitcoin-connect": "^3.4.2"
   },
   "devDependencies": {
     "@types/react": "^18.2.21",
diff --git a/react/yarn.lock b/react/yarn.lock
index 54a83eb..a645648 100644
--- a/react/yarn.lock
+++ b/react/yarn.lock
@@ -1018,10 +1018,10 @@
     "@babel/helper-validator-identifier" "^7.22.5"
     to-fast-properties "^2.0.0"
 
-"@getalby/bitcoin-connect@^3.4.1":
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/@getalby/bitcoin-connect/-/bitcoin-connect-3.4.1.tgz#b12b27ecf6c5b7ddbafd962a99880a32ce639a25"
-  integrity sha512-RLfBAMKVWcEjWFU8OidqFDpass2piTjtY/bCaDFYiB79pMCtzGpS/HjfBdqgPITgM0b5kQUySdKylDBfVAnMgw==
+"@getalby/bitcoin-connect@^3.4.2":
+  version "3.4.2"
+  resolved "https://registry.yarnpkg.com/@getalby/bitcoin-connect/-/bitcoin-connect-3.4.2.tgz#1aa3009e4f3499bab496af796b3c9aee2b71af09"
+  integrity sha512-TsIKASy/823DJLw8DEgwpnJyHGRt2Xfm4kGpot2NxuRrTD8V5s2nlMHmyZhmkuxzrKE83wA0KpIXgqse5We/xA==
   dependencies:
     "@getalby/lightning-tools" "^5.0.3"
     "@getalby/sdk" "^3.5.1"