Release/desktop 1.2.0

packages/desktop/components/popup/popups/TransakFramePopup.svelte

@@ -2,8 +2,7 @@
     import { TransakCryptoCurrency } from '@auxiliary/transak'
     import { Button, Icon, IconName, Spinner, Text } from '@bloomwalletio/ui'
     import { DISCORD_URL } from '@contexts/settings'
-    import { selectedAccountIndex } from '@core/account/stores'
-    import { openUrlInBrowser, Platform } from '@core/app'
+    import { IS_MAC, openUrlInBrowser, Platform } from '@core/app'
     import { localize } from '@core/i18n'
     import { FiatCurrency } from '@core/market'
     import { SupportedNetworkId } from '@core/network'
@@ -25,9 +24,6 @@
     let isTransakOpen: boolean = false
     let isTransakLoading: boolean = false
 
-    $: if ($selectedAccountIndex !== undefined) {
-        void closeTransak()
-    }
     $: isTransakOpen, void handleOverlayChanges($popupState)
 
     Platform.onEvent('transak-loaded', () => (isTransakLoading = false))
@@ -87,11 +83,6 @@
         await updateTransakBounds()
     }
 
-    async function closeTransak(): Promise<void> {
-        await Platform.closeTransak()
-        isTransakOpen = false
-    }
-
     function onButtonClick(): void {
         openUrlInBrowser(DISCORD_URL)
     }
@@ -127,11 +118,14 @@
             </div>
         {/if}
     </div>
+    {#if IS_MAC}
+        <div class="h-8 w-full"></div>
+    {/if}
 </div>
 
 <style>
     .transak-container {
         width: 30rem;
-        height: min(70vh, 700px);
+        height: min(80vh, 750px);
     }
 </style>

packages/desktop/lib/electron/preloads/transak.preload.ts

@@ -30,11 +30,14 @@ function observeStyleChanges(targetNode: Element): void {
 window.addEventListener('DOMContentLoaded', () => {
     observeStyleChanges(window.document.documentElement)
 
-    const appRoot = window.document.getElementById('appRoot')
-    if (appRoot) {
-        appRoot.style.borderBottomLeftRadius = '32px'
-        appRoot.style.borderBottomRightRadius = '32px'
-        appRoot.style.overflow = 'hidden'
+    // TODO: Potential bug in electron means that the page is not rendered properly on Mac when the background is transparent
+    if (process.platform !== 'darwin') {
+        const appRoot = window.document.getElementById('appRoot')
+        if (appRoot) {
+            appRoot.style.borderBottomLeftRadius = '32px'
+            appRoot.style.borderBottomRightRadius = '32px'
+            appRoot.style.overflow = 'hidden'
+        }
+        window.document.documentElement.style.backgroundColor = 'transparent'
     }
-    window.document.documentElement.style.backgroundColor = 'transparent'
 })

packages/desktop/package.json

@@ -1,7 +1,7 @@
 {
     "name": "desktop",
     "productName": "Bloom",
-    "version": "1.1.3",
+    "version": "1.2.0",
     "description": "Simple and secure web3 wallet for the IOTA and Shimmer ecosystem",
     "main": "public/build/main.process.js",
     "repository": "[email protected]:bloomwalletio/bloom.git",

packages/desktop/views/dashboard/buy-sell/components/TransakQuotationTile.svelte

@@ -26,7 +26,7 @@
                 data-label="transak-logo"
                 width="90"
                 height="28"
-                src="assets/logos/transak.svg"
+                src="assets/logos/transak-full.svg"
                 alt="Transak"
                 class:opacity-0={isLoading}
             />

packages/shared/package.json

@@ -1,6 +1,6 @@
 {
     "name": "shared",
-    "version": "1.1.3",
+    "version": "1.2.0",
     "description": "TypeScript library for the Bloom application",
     "author": "Bloom Labs Ltd <[email protected]>",
     "license": "PolyForm Strict License 1.0.0",

packages/shared/src/lib/core/utils/ui.ts

@@ -28,7 +28,13 @@ export function debounce<T extends UiEventFunction>(callback: T, wait = 500): Ui
  */
 export const clickOutside: Action<HTMLElement> = function (node) {
     const onClick: (event: Event) => void = (event) => {
-        if (node && !node.contains(event.target as Node) && !event.defaultPrevented) {
+        if (!node) {
+            return
+        }
+
+        const hasClickedInNavbar = document.querySelector('body > app > navbar')?.contains(event.target as Node)
+        const hasClickedOutside = !node.contains(event.target as Node)
+        if (hasClickedOutside && !hasClickedInNavbar && !event.defaultPrevented) {
             node.dispatchEvent(new CustomEvent('clickOutside', { detail: event }))
         }
     }