From e01248033a9b095de45ed7416c6ce6ed388cf122 Mon Sep 17 00:00:00 2001
From: Dawid Sowa <dawid.sowa@rdx.works>
Date: Fri, 7 Jun 2024 14:35:17 +0200
Subject: [PATCH] feat: empty connect button module for non-browser env

---
 .../dapp-toolkit/src/helpers/is-browser.ts    |  2 +
 .../connect-button-noop.module.ts             | 30 ++++++++++++++
 .../connect-button/connect-button.module.ts   | 40 ++++---------------
 .../src/modules/connect-button/types.ts       | 37 +++++++++++++++++
 4 files changed, 77 insertions(+), 32 deletions(-)
 create mode 100644 packages/dapp-toolkit/src/helpers/is-browser.ts
 create mode 100644 packages/dapp-toolkit/src/modules/connect-button/connect-button-noop.module.ts

diff --git a/packages/dapp-toolkit/src/helpers/is-browser.ts b/packages/dapp-toolkit/src/helpers/is-browser.ts
new file mode 100644
index 00000000..88de98f5
--- /dev/null
+++ b/packages/dapp-toolkit/src/helpers/is-browser.ts
@@ -0,0 +1,2 @@
+export const isBrowser = () =>
+  ![typeof window, typeof document].includes('undefined')
diff --git a/packages/dapp-toolkit/src/modules/connect-button/connect-button-noop.module.ts b/packages/dapp-toolkit/src/modules/connect-button/connect-button-noop.module.ts
new file mode 100644
index 00000000..9f25b805
--- /dev/null
+++ b/packages/dapp-toolkit/src/modules/connect-button/connect-button-noop.module.ts
@@ -0,0 +1,30 @@
+import { NEVER } from 'rxjs'
+import { ConnectButtonModuleOutput } from './types'
+
+export const ConnectButtonNoopModule = (): ConnectButtonModuleOutput => {
+  return {
+    status$: NEVER,
+    onConnect$: NEVER,
+    onDisconnect$: NEVER,
+    onUpdateSharedData$: NEVER,
+    onShowPopover$: NEVER,
+    onCancelRequestItem$: NEVER,
+    onLinkClick$: NEVER,
+    setStatus: () => {},
+    setMode: () => {},
+    setTheme: () => {},
+    setActiveTab: () => {},
+    setIsMobile: () => {},
+    setIsWalletLinked: () => {},
+    setIsExtensionAvailable: () => {},
+    setConnected: () => {},
+    setLoggedInTimestamp: () => {},
+    setRequestItems: () => {},
+    setAccounts: () => {},
+    setPersonaData: () => {},
+    setPersonaLabel: () => {},
+    setDappName: () => {},
+    destroy: () => {},
+    disconnect: () => {},
+  }
+}
diff --git a/packages/dapp-toolkit/src/modules/connect-button/connect-button.module.ts b/packages/dapp-toolkit/src/modules/connect-button/connect-button.module.ts
index 61d055da..9274d28c 100644
--- a/packages/dapp-toolkit/src/modules/connect-button/connect-button.module.ts
+++ b/packages/dapp-toolkit/src/modules/connect-button/connect-button.module.ts
@@ -6,14 +6,13 @@ import {
   map,
   merge,
   mergeMap,
-  Observable,
   of,
   Subscription,
   switchMap,
   tap,
   timer,
 } from 'rxjs'
-import type { ConnectButton } from '@radixdlt/connect-button'
+import { ConnectButton } from '@radixdlt/connect-button'
 import type {
   Account,
   RadixButtonStatus,
@@ -30,39 +29,12 @@ import {
 import { GatewayModule, RadixNetworkConfigById } from '../gateway'
 import { StateModule } from '../state'
 import { StorageModule } from '../storage'
-import { ConnectButtonStatus } from './types'
+import { ConnectButtonModuleOutput, ConnectButtonStatus } from './types'
+import { isBrowser } from '../../helpers/is-browser'
+import { ConnectButtonNoopModule } from './connect-button-noop.module'
 
 export type ConnectButtonModule = ReturnType<typeof ConnectButtonModule>
 
-export type ConnectButtonModuleOutput = {
-  status$: Observable<RadixButtonStatus>
-  onConnect$: Observable<{ challenge: string } | undefined>
-  onDisconnect$: Observable<void>
-  onUpdateSharedData$: Observable<void>
-  onShowPopover$: Observable<void>
-  onCancelRequestItem$: Observable<string>
-  onLinkClick$: Observable<{
-    type: 'account' | 'transaction' | 'showQrCode' | 'setupGuide'
-    data: string
-  }>
-  setStatus: (value: RadixButtonStatus) => void
-  setMode: (value: 'light' | 'dark') => void
-  setTheme: (value: RadixButtonTheme) => void
-  setActiveTab: (value: 'sharing' | 'requests') => void
-  setIsMobile: (value: boolean) => void
-  setIsWalletLinked: (value: boolean) => void
-  setIsExtensionAvailable: (value: boolean) => void
-  setConnected: (value: boolean) => void
-  setLoggedInTimestamp: (value: string) => void
-  setRequestItems: (value: RequestItem[]) => void
-  setAccounts: (value: Account[]) => void
-  setPersonaData: (value: { value: string; field: string }[]) => void
-  setPersonaLabel: (value: string) => void
-  setDappName: (value: string) => void
-  destroy: () => void
-  disconnect: () => void
-}
-
 export type ConnectButtonModuleInput = {
   networkId: number
   environment?: string
@@ -86,6 +58,10 @@ export type ConnectButtonModuleInput = {
 export const ConnectButtonModule = (
   input: ConnectButtonModuleInput,
 ): ConnectButtonModuleOutput => {
+  if (!isBrowser()) {
+    return ConnectButtonNoopModule()
+  }
+  
   import('@radixdlt/connect-button')
   const logger = input?.logger?.getSubLogger({ name: 'ConnectButtonModule' })
   const subjects = input.subjects || ConnectButtonSubjects()
diff --git a/packages/dapp-toolkit/src/modules/connect-button/types.ts b/packages/dapp-toolkit/src/modules/connect-button/types.ts
index cd4fe479..a8b111d1 100644
--- a/packages/dapp-toolkit/src/modules/connect-button/types.ts
+++ b/packages/dapp-toolkit/src/modules/connect-button/types.ts
@@ -1,3 +1,11 @@
+import {
+  RadixButtonStatus,
+  RadixButtonTheme,
+  RequestItem,
+  Account,
+} from 'radix-connect-common'
+import { Observable } from 'rxjs'
+
 export type ConnectButtonStatus =
   (typeof ConnectButtonStatus)[keyof typeof ConnectButtonStatus]
 export const ConnectButtonStatus = {
@@ -6,3 +14,32 @@ export const ConnectButtonStatus = {
   default: 'default',
   error: 'error',
 } as const
+
+export type ConnectButtonModuleOutput = {
+  status$: Observable<RadixButtonStatus>
+  onConnect$: Observable<{ challenge: string } | undefined>
+  onDisconnect$: Observable<void>
+  onUpdateSharedData$: Observable<void>
+  onShowPopover$: Observable<void>
+  onCancelRequestItem$: Observable<string>
+  onLinkClick$: Observable<{
+    type: 'account' | 'transaction' | 'showQrCode' | 'setupGuide'
+    data: string
+  }>
+  setStatus: (value: RadixButtonStatus) => void
+  setMode: (value: 'light' | 'dark') => void
+  setTheme: (value: RadixButtonTheme) => void
+  setActiveTab: (value: 'sharing' | 'requests') => void
+  setIsMobile: (value: boolean) => void
+  setIsWalletLinked: (value: boolean) => void
+  setIsExtensionAvailable: (value: boolean) => void
+  setConnected: (value: boolean) => void
+  setLoggedInTimestamp: (value: string) => void
+  setRequestItems: (value: RequestItem[]) => void
+  setAccounts: (value: Account[]) => void
+  setPersonaData: (value: { value: string; field: string }[]) => void
+  setPersonaLabel: (value: string) => void
+  setDappName: (value: string) => void
+  destroy: () => void
+  disconnect: () => void
+}