fix: modal not updating (#181)

* fix: modal not updating * chore: add code coverage
vechain · Jan 23, 2024 · 251e8d5 · 251e8d5
1 parent d3f4208
commit 251e8d5
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 3 deletions.
diff --git a/packages/dapp-kit-ui/src/components/modals/modal.ts b/packages/dapp-kit-ui/src/components/modals/modal.ts
@@ -1,21 +1,32 @@
 import { html, LitElement, type TemplateResult, nothing } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { type WalletManager } from '@vechain/dapp-kit';
-import { subscribeKey } from 'valtio/vanilla/utils';
 import { DAppKitUI } from '../../client';
 import {
     defaultI18n,
     type I18n,
     type SourceInfo,
     type ThemeMode,
 } from '../../constants';
+import { subscribeToCustomEvent } from '../../utils';
 
 @customElement('vdk-modal')
 export class Modal extends LitElement {
     constructor() {
         super();
-        subscribeKey(DAppKitUI.wallet.state, 'address', (v) => {
-            this.address = v ?? '';
+        if (DAppKitUI.initialized) {
+            this.init();
+        } else {
+            subscribeToCustomEvent('vdk-dapp-kit-configured', () => {
+                this.init();
+            });
+        }
+    }
+
+    private init(): void {
+        this.address = DAppKitUI.wallet.state.address ?? '';
+        this.wallet.subscribeToKey('address', (addr) => {
+            this.address = addr ?? '';
             this.requestUpdate();
         });
     }
@@ -45,6 +56,10 @@ export class Modal extends LitElement {
     };
 
     override render(): TemplateResult {
+        if (!DAppKitUI.initialized) {
+            return html``;
+        }
+
         return html`
             <div>
                 ${this.address

diff --git a/packages/dapp-kit-ui/test/classes/connect-modal-manager.test.ts b/packages/dapp-kit-ui/test/classes/connect-modal-manager.test.ts
@@ -0,0 +1,21 @@
+import { ConnectModalManager, DAppKitUI } from '../../src';
+
+DAppKitUI.configure({
+    nodeUrl: 'https://mainnet.vechain.org/',
+});
+
+describe('ConnectModalManager', () => {
+    it('should be a singleton', () => {
+        const instance1 = ConnectModalManager.getInstance(DAppKitUI.wallet);
+        const instance2 = ConnectModalManager.getInstance(DAppKitUI.wallet);
+        expect(instance1).toBe(instance2);
+    });
+
+    it('should not throw', () => {
+        const instance = ConnectModalManager.getInstance(DAppKitUI.wallet);
+        instance.open();
+        instance.close();
+        instance.closeWalletConnect();
+        instance.closeConnectionCertificateRequest();
+    });
+});