From 499ec30428ca1e127ae34b4b5846eb9871a56e7f Mon Sep 17 00:00:00 2001 From: Jean Ribeiro Date: Wed, 17 Jan 2024 07:12:50 -0300 Subject: [PATCH] feat: fiat on ramp (#1670) * feat: adds Transak support * WIP UI * enhancement: position of transak window and browser window options Co-authored-by: Jean Ribeiro * ui: layout and panes for buy view * fix: only call function if darwin * fix: use integers to set position * remove buy sell router * isolate most of transak code into a manager * improve UI * removes unused code * disable feature flag * add only available network --------- Co-authored-by: Nicole O'Brien Co-authored-by: Tuditi Co-authored-by: Mark Nardi --- .github/workflows/reusable_build.yml | 1 + .../desktop/components/AccountSwitcher.svelte | 3 +- .../desktop/features/analytics.features.ts | 3 + .../desktop/features/buy-sell.features.ts | 7 + packages/desktop/features/features.ts | 2 + .../analytics-features.interface.ts | 1 + .../desktop/lib/electron/apis/electron.api.ts | 11 +- .../electron/constants/windows.constant.ts | 2 + .../lib/electron/managers/transak.manager.ts | 142 ++++++++++++++++++ .../lib/electron/preloads/transak.preload.ts | 50 ++++++ .../lib/electron/processes/main.process.ts | 42 ++++-- packages/desktop/public/transak.html | 10 ++ .../desktop/views/dashboard/Dashboard.svelte | 2 + .../views/dashboard/buy-sell/BuySell.svelte | 14 ++ .../desktop/views/dashboard/buy-sell/index.ts | 1 + .../buy-sell/views/BuySellMainView.svelte | 99 ++++++++++++ .../views/dashboard/buy-sell/views/index.ts | 1 + .../components/DashboardSidebar.svelte | 19 +++ packages/desktop/webpack.config.ts | 2 + .../src/lib/core/app/interfaces/index.ts | 1 + .../lib/core/app/interfaces/managers/index.ts | 1 + .../managers/transak-manager.interface.ts | 8 + .../platform-event-map.interface.ts | 1 + .../core/app/interfaces/platform.interface.ts | 6 + .../transak-window-data.interface.ts | 5 + .../core/router/enums/dashboard-route.enum.ts | 1 + .../features/interfaces/features.interface.ts | 2 + packages/shared/src/locales/en.json | 3 +- packages/shared/test/mocks/platform.mock.ts | 11 +- 29 files changed, 438 insertions(+), 13 deletions(-) create mode 100644 packages/desktop/features/buy-sell.features.ts create mode 100644 packages/desktop/lib/electron/managers/transak.manager.ts create mode 100644 packages/desktop/lib/electron/preloads/transak.preload.ts create mode 100644 packages/desktop/public/transak.html create mode 100644 packages/desktop/views/dashboard/buy-sell/BuySell.svelte create mode 100644 packages/desktop/views/dashboard/buy-sell/index.ts create mode 100644 packages/desktop/views/dashboard/buy-sell/views/BuySellMainView.svelte create mode 100644 packages/desktop/views/dashboard/buy-sell/views/index.ts create mode 100644 packages/shared/src/lib/core/app/interfaces/managers/transak-manager.interface.ts create mode 100644 packages/shared/src/lib/core/app/interfaces/transak-window-data.interface.ts diff --git a/.github/workflows/reusable_build.yml b/.github/workflows/reusable_build.yml index e6fb1f58a4..bbe171b6e7 100644 --- a/.github/workflows/reusable_build.yml +++ b/.github/workflows/reusable_build.yml @@ -137,6 +137,7 @@ jobs: env: HARDCODE_NODE_ENV: true AMPLITUDE_API_KEY: ${{ secrets.AMPLITUDE_API_KEY }} + TRANSAK_API_KEY: ${{ secrets.TRANSAK_API_KEY }} - name: Build signed Electron app (MacOS) run: yarn compile:${STAGE}:mac diff --git a/packages/desktop/components/AccountSwitcher.svelte b/packages/desktop/components/AccountSwitcher.svelte index b1180fc5cb..c13131d027 100644 --- a/packages/desktop/components/AccountSwitcher.svelte +++ b/packages/desktop/components/AccountSwitcher.svelte @@ -9,6 +9,7 @@ import { PopupId, openPopup } from '@desktop/auxiliary/popup' export let navbar: boolean = false + export let placement: 'bottom-start' | 'bottom-end' = 'bottom-start' const menu: Menu | undefined = undefined @@ -42,7 +43,7 @@ {items} compact={navbar} {...!navbar && { button: { text: localize('general.newAccount'), onClick: onCreateAccountClick } }} - placement="bottom-start" + {placement} >
diff --git a/packages/desktop/features/analytics.features.ts b/packages/desktop/features/analytics.features.ts index 6cd07dd222..3cff6bd6f6 100644 --- a/packages/desktop/features/analytics.features.ts +++ b/packages/desktop/features/analytics.features.ts @@ -32,6 +32,9 @@ const analyticsFeatures: IAnalyticsFeatures = { enabled: true, }, }, + buySell: { + enabled: true, + }, }, loginRoute: { enabled: true, diff --git a/packages/desktop/features/buy-sell.features.ts b/packages/desktop/features/buy-sell.features.ts new file mode 100644 index 0000000000..826f1fa5f7 --- /dev/null +++ b/packages/desktop/features/buy-sell.features.ts @@ -0,0 +1,7 @@ +import { IFeatureFlag } from '@lib/features/interfaces' + +const buySellFeatures: IFeatureFlag = { + enabled: false, +} + +export default buySellFeatures diff --git a/packages/desktop/features/features.ts b/packages/desktop/features/features.ts index c75954958a..e82fbd12c3 100644 --- a/packages/desktop/features/features.ts +++ b/packages/desktop/features/features.ts @@ -11,6 +11,7 @@ import settingsFeatures from './settings.features' import walletFeatures from './wallet.features' import walletConnectFeatures from './wallet-connect.features' import analyticsFeatures from './analytics.features' +import buySellFeatures from './buy-sell.features' import { IDesktopFeatures } from './interfaces' const features: IDesktopFeatures = { @@ -27,6 +28,7 @@ const features: IDesktopFeatures = { settings: settingsFeatures, wallet: walletFeatures, walletConnect: walletConnectFeatures, + buySell: buySellFeatures, } export default features diff --git a/packages/desktop/features/interfaces/analytics-features.interface.ts b/packages/desktop/features/interfaces/analytics-features.interface.ts index fc10feab5f..ec972a4d81 100644 --- a/packages/desktop/features/interfaces/analytics-features.interface.ts +++ b/packages/desktop/features/interfaces/analytics-features.interface.ts @@ -14,6 +14,7 @@ export interface IAnalyticsFeatures extends IFeatureFlag { wallet: { sendFlow: IFeatureFlag } + buySell: IFeatureFlag } loginRoute: IFeatureFlag onboardingRoute: IFeatureFlag diff --git a/packages/desktop/lib/electron/apis/electron.api.ts b/packages/desktop/lib/electron/apis/electron.api.ts index 70686a2691..4b66312d35 100644 --- a/packages/desktop/lib/electron/apis/electron.api.ts +++ b/packages/desktop/lib/electron/apis/electron.api.ts @@ -8,7 +8,7 @@ import NotificationManager from '../managers/notification.manager' import PincodeManager from '../managers/pincode.manager' import { bindMethodsAcrossContextBridge } from '../utils/context-bridge.utils' -import type { IAppSettings } from '@core/app/interfaces' +import type { IAppSettings, ITransakWindowData } from '@core/app/interfaces' import type { IFeatureFlag } from '@lib/features/interfaces' import { AppTheme } from '@core/app/enums' @@ -250,4 +250,13 @@ export default { killLedgerProcess(): void { return ipcRenderer.send('kill-ledger-process') }, + openTransak(data: ITransakWindowData): Promise { + return ipcRenderer.invoke('open-transak', data) + }, + closeTransak(): Promise { + return ipcRenderer.invoke('close-transak') + }, + isSidebarExpanded(expanded: boolean): Promise { + return ipcRenderer.invoke('is-sidebar-expanded', expanded) + }, } diff --git a/packages/desktop/lib/electron/constants/windows.constant.ts b/packages/desktop/lib/electron/constants/windows.constant.ts index bc941fa6ee..b37ad4cc46 100644 --- a/packages/desktop/lib/electron/constants/windows.constant.ts +++ b/packages/desktop/lib/electron/constants/windows.constant.ts @@ -7,10 +7,12 @@ export const windows: Window = { main: null, about: null, error: null, + transak: null, } type Window = { main: BrowserWindow | null about: BrowserWindow | null error: BrowserWindow | null + transak: BrowserWindow | null } diff --git a/packages/desktop/lib/electron/managers/transak.manager.ts b/packages/desktop/lib/electron/managers/transak.manager.ts new file mode 100644 index 0000000000..44ffdd0a94 --- /dev/null +++ b/packages/desktop/lib/electron/managers/transak.manager.ts @@ -0,0 +1,142 @@ +import { BrowserWindow, app } from 'electron' +import { windows } from '../constants/windows.constant' +import features from '@features/features' +import { ITransakManager, ITransakWindowData } from '@core/app' +import path from 'path' + +const SIDEBAR_WIDTH_EXPANDED = 256 +const SIDEBAR_WIDTH_CLOSED = 80 +const BORDER_HEIGHT = 1 +const WINDOWS_TITLEBAR_HEIGHT = 28 +const NAVBAR_HEIGHT = 40 +const DASHBOARD_CONTAINER_PADDING = 32 + +export default class TransakManager implements ITransakManager { + private sidebarExpanded = false + private htmlPath = app.isPackaged + ? path.join(app.getAppPath(), '/public/transak.html') + : path.join(__dirname, '../transak.html') + private preloadPath = app.isPackaged + ? path.join(app.getAppPath(), '/public/build/transak.preload.js') + : path.join(__dirname, 'transak.preload.js') + + public setSidebarExpanded(isOpen: boolean): void { + this.sidebarExpanded = isOpen + } + + public closeWindow(): void { + if (windows.transak) { + windows.transak.close() + windows.transak = null + } + } + + public openWindow(data: ITransakWindowData): BrowserWindow { + if (windows.transak !== null) { + return windows.transak + } + + windows.transak = new BrowserWindow({ + parent: windows.main, + width: 480, + height: this.getWindowHeight(), + useContentSize: true, + titleBarStyle: 'hidden', + frame: false, + show: true, + fullscreenable: false, + transparent: true, + movable: false, + resizable: false, + minimizable: false, + skipTaskbar: true, + acceptFirstMouse: true, + hasShadow: false, + thickFrame: false, + roundedCorners: false, + webPreferences: { + nodeIntegration: false, + contextIsolation: true, + disableBlinkFeatures: 'Auxclick', + webviewTag: false, + enableWebSQL: false, + devTools: !app.isPackaged || features?.electron?.developerTools?.enabled, + preload: this.preloadPath, + }, + }) + + if (process.platform === 'darwin') { + windows.transak.setWindowButtonVisibility(false) + } + + this.positionWindow() + this.sizeWindow() + windows.main.on('move', () => this.positionWindow()) + windows.main.on('resize', () => { + this.positionWindow() + this.sizeWindow() + }) + + windows.transak.once('closed', () => { + windows.transak = null + }) + + windows.transak.webContents.session.setPermissionRequestHandler((webContents, permission, callback) => { + if (permission === 'media') { + callback(true) + } else { + callback(false) + } + }) + + void windows.transak.loadFile(this.htmlPath) + windows.transak.webContents.on('did-finish-load', () => { + const _data = { + currency: data.currency, + address: data.address, + stage: app.isPackaged ? 'production' : 'staging', + apiKey: process.env.TRANSAK_API_KEY, + service: data.service, + } + windows.transak.webContents.send('transak-data', _data) + }) + + windows.transak.setMenu(null) + + return windows.transak + } + + public positionWindow(): void { + if (windows.transak && windows.transak) { + const [mainWindowX, mainWindowY] = windows.main.getPosition() + const [mainWindowWidth] = windows.main.getSize() + const [transakWidth] = windows.transak.getSize() + + const sidebarWidth = this.sidebarExpanded ? SIDEBAR_WIDTH_EXPANDED : SIDEBAR_WIDTH_CLOSED + const dashboardWidth = mainWindowWidth - sidebarWidth + const transakX = Math.floor(mainWindowX + sidebarWidth + dashboardWidth / 2 - transakWidth / 2) + const topBarHeight = this.getTopBarHeight() + const transakY = mainWindowY + topBarHeight + DASHBOARD_CONTAINER_PADDING + BORDER_HEIGHT + + windows.transak.setPosition(transakX, transakY) + } + } + + private sizeWindow(): void { + const [transakWidth] = windows.transak.getSize() + const transakHeight = this.getWindowHeight() + windows.transak.setSize(transakWidth, transakHeight) + } + + private getTopBarHeight(): number { + const titleBarHeight = process.platform === 'win32' ? WINDOWS_TITLEBAR_HEIGHT + BORDER_HEIGHT : 0 + const topBarHeight = NAVBAR_HEIGHT + BORDER_HEIGHT + titleBarHeight + return topBarHeight + } + + private getWindowHeight(): number { + const [, mainWindowHeight] = windows.main.getSize() + const topBarHeight = this.getTopBarHeight() + return mainWindowHeight - topBarHeight - (DASHBOARD_CONTAINER_PADDING + BORDER_HEIGHT) * 2 + } +} diff --git a/packages/desktop/lib/electron/preloads/transak.preload.ts b/packages/desktop/lib/electron/preloads/transak.preload.ts new file mode 100644 index 0000000000..f5924ddfe6 --- /dev/null +++ b/packages/desktop/lib/electron/preloads/transak.preload.ts @@ -0,0 +1,50 @@ +import { IpcRendererEvent, ipcRenderer } from 'electron' + +interface TransakData { + apiKey: string + currency: string + address: string + stage: 'production' | 'staging' + service: 'BUY' | 'SELL' +} + +window.addEventListener('DOMContentLoaded', () => { + ipcRenderer.on('transak-data', (_: IpcRendererEvent, data: TransakData) => { + window.document.documentElement.style.height = '100%' + window.document.body.style.margin = '0' + window.document.body.style.padding = '0' + window.document.body.style.width = '100dvw' + window.document.body.style.height = '100dvh' + window.document.body.style.borderRadius = '16px' + window.document.body.style.display = 'flex' + window.document.body.style.alignItems = 'center' + window.document.body.style.justifyContent = 'center' + + if (window.document.getElementById('transakIframe')) { + return + } + + const { apiKey, currency, address, stage, service } = data + const transakUrl = stage === 'production' ? 'https://global.transak.com' : 'https://global-stg.transak.com' + + const iframe = window.document.createElement('iframe') + iframe.id = 'transakIframe' + iframe.src = `${transakUrl}/?apiKey=${apiKey}&defaultFiatCurrency=${currency}&walletAddress=${address}&productsAvailed=${service}&cryptoCurrencyCode=IOTA&network=miota&themeColor=7C41C9&hideMenu=true` + iframe.style.width = '100%' + iframe.style.height = '100%' + iframe.style.border = 'none' + iframe.style.borderRadius = '16px' + iframe.allow = 'camera;microphone;payment' + iframe.sandbox.add('allow-scripts', 'allow-same-origin') + + window.document.body.appendChild(iframe) + + window.addEventListener('message', (message) => { + if (message.source !== iframe.contentWindow) return + + if (message?.data?.event_id === 'TRANSAK_ORDER_SUCCESSFUL') { + void ipcRenderer.invoke('close-transak') + } + }) + }) +}) diff --git a/packages/desktop/lib/electron/processes/main.process.ts b/packages/desktop/lib/electron/processes/main.process.ts index a554089b94..71583cdfea 100644 --- a/packages/desktop/lib/electron/processes/main.process.ts +++ b/packages/desktop/lib/electron/processes/main.process.ts @@ -24,6 +24,7 @@ import { windows } from '../constants/windows.constant' import AutoUpdateManager from '../managers/auto-update.manager' import KeychainManager from '../managers/keychain.manager' import NftDownloadManager from '../managers/nft-download.manager' +import TransakManager from '../managers/transak.manager' import { contextMenu } from '../menus/context.menu' import { initMenu } from '../menus/menu' import { initialiseAnalytics } from '../utils/analytics.utils' @@ -337,16 +338,21 @@ ipcMain.on(LedgerApiMethod.SignMessage, (_e, messageHex, bip32Path) => { ledgerProcess?.postMessage({ method: LedgerApiMethod.SignMessage, payload: [messageHex, bip32Path] }) }) -export function getOrInitWindow(windowName: string): BrowserWindow { +export function getOrInitWindow(windowName: string, ...args: unknown[]): BrowserWindow { if (!windows[windowName]) { - if (windowName === 'main') { - return createMainWindow() - } - if (windowName === 'about') { - return openAboutWindow() - } - if (windowName === 'error') { - return openErrorWindow() + switch (windowName) { + case 'main': + return createMainWindow() + case 'about': + return openAboutWindow() + case 'error': + return openErrorWindow() + case 'transak': + return transakManager?.openWindow( + args[0] as { currency: string; address: string; service: 'BUY' | 'SELL' } + ) + default: + throw Error(`Window ${windowName} not found`) } } return windows[windowName] @@ -496,6 +502,24 @@ ipcMain.on('notification-activated', (ev, contextData) => { windows.main.webContents.send('notification-activated', contextData) }) +// Transak + +const transakManager = features?.buySell?.enabled ? new TransakManager() : null +ipcMain.handle('open-transak', (_, data) => { + getOrInitWindow('transak', data) +}) + +ipcMain.handle('close-transak', () => { + transakManager?.closeWindow() +}) + +ipcMain.handle('is-sidebar-expanded', (_, expanded) => { + if (transakManager) { + transakManager.setSidebarExpanded(expanded) + transakManager.positionWindow() + } +}) + /** * Create about window * @returns {BrowserWindow} About window diff --git a/packages/desktop/public/transak.html b/packages/desktop/public/transak.html new file mode 100644 index 0000000000..dd5c237cca --- /dev/null +++ b/packages/desktop/public/transak.html @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/packages/desktop/views/dashboard/Dashboard.svelte b/packages/desktop/views/dashboard/Dashboard.svelte index bcbbaa0cfa..c309b57ab4 100644 --- a/packages/desktop/views/dashboard/Dashboard.svelte +++ b/packages/desktop/views/dashboard/Dashboard.svelte @@ -24,6 +24,7 @@ import { Wallet } from './wallet' import { Settings } from '../settings' import { Background } from '@views/components' + import { BuySell } from './buy-sell' const tabs = { wallet: Wallet, @@ -31,6 +32,7 @@ collectibles: Collectibles, governance: Governance, developer: Developer, + buySell: BuySell, } let previousAccountIndex = get(selectedAccountIndex) diff --git a/packages/desktop/views/dashboard/buy-sell/BuySell.svelte b/packages/desktop/views/dashboard/buy-sell/BuySell.svelte new file mode 100644 index 0000000000..d3185a10b6 --- /dev/null +++ b/packages/desktop/views/dashboard/buy-sell/BuySell.svelte @@ -0,0 +1,14 @@ + + +
+ +
diff --git a/packages/desktop/views/dashboard/buy-sell/index.ts b/packages/desktop/views/dashboard/buy-sell/index.ts new file mode 100644 index 0000000000..582919669d --- /dev/null +++ b/packages/desktop/views/dashboard/buy-sell/index.ts @@ -0,0 +1 @@ +export { default as BuySell } from './BuySell.svelte' diff --git a/packages/desktop/views/dashboard/buy-sell/views/BuySellMainView.svelte b/packages/desktop/views/dashboard/buy-sell/views/BuySellMainView.svelte new file mode 100644 index 0000000000..697bd4200c --- /dev/null +++ b/packages/desktop/views/dashboard/buy-sell/views/BuySellMainView.svelte @@ -0,0 +1,99 @@ + + +
+ +
+ +
+
+ +
+
+ + diff --git a/packages/desktop/views/dashboard/buy-sell/views/index.ts b/packages/desktop/views/dashboard/buy-sell/views/index.ts new file mode 100644 index 0000000000..12e9d4b856 --- /dev/null +++ b/packages/desktop/views/dashboard/buy-sell/views/index.ts @@ -0,0 +1 @@ +export { default as BuySellMainView } from './BuySellMainView.svelte' diff --git a/packages/desktop/views/dashboard/components/DashboardSidebar.svelte b/packages/desktop/views/dashboard/components/DashboardSidebar.svelte index 62565e92f3..de6f296c05 100644 --- a/packages/desktop/views/dashboard/components/DashboardSidebar.svelte +++ b/packages/desktop/views/dashboard/components/DashboardSidebar.svelte @@ -12,12 +12,16 @@ import StrongholdStatusTile from './StrongholdStatusTile.svelte' import { AutoUpdateToast, BackupToast, VersionToast } from './toasts' import { dashboardRoute } from '@core/router' + import { StardustNetworkId } from '@core/network' + import { Platform } from '@core/app' let expanded = true function toggleExpand(): void { expanded = !expanded } + $: void Platform.isSidebarExpanded(expanded) + let sidebarTabs: IDashboardSidebarTab[] $: sidebarTabs = [ { @@ -56,6 +60,16 @@ }, ] : []), + ...(features?.buySell?.enabled && $activeProfile?.network?.id === StardustNetworkId.Iota + ? [ + { + icon: IconName.CoinSwap, + label: localize('tabs.buySell'), + route: DashboardRoute.BuySell, + onClick: openBuySell, + }, + ] + : []), ] function openWallet(): void { @@ -77,6 +91,11 @@ $dashboardRouter.goTo(DashboardRoute.Developer) } + function openBuySell(): void { + resetAllRouters() + $dashboardRouter.goTo(DashboardRoute.BuySell) + } + function resetAllRouters(): void { $dashboardRouter.reset() $collectiblesRouter.reset() diff --git a/packages/desktop/webpack.config.ts b/packages/desktop/webpack.config.ts index c74cfdde25..e65550b0fd 100644 --- a/packages/desktop/webpack.config.ts +++ b/packages/desktop/webpack.config.ts @@ -147,6 +147,7 @@ const mainPlugins = [ 'process.env.STAGE': JSON.stringify(stage), 'process.env.APP_PROTOCOL': JSON.stringify(appProtocol), 'process.env.AMPLITUDE_API_KEY': JSON.stringify(process.env.AMPLITUDE_API_KEY), + 'process.env.TRANSAK_API_KEY': JSON.stringify(process.env.TRANSAK_API_KEY), }), new CopyPlugin({ patterns: [ @@ -271,6 +272,7 @@ const webpackConfig: Configuration[] = [ 'build/preload': ['./lib/electron/preloads/preload.ts'], 'build/about.preload': ['./lib/electron/preloads/about.preload.ts'], 'build/error.preload': ['./lib/electron/preloads/error.preload.ts'], + 'build/transak.preload': ['./lib/electron/preloads/transak.preload.ts'], }, resolve, output, diff --git a/packages/shared/src/lib/core/app/interfaces/index.ts b/packages/shared/src/lib/core/app/interfaces/index.ts index 8d00e06ec2..5d30a15442 100644 --- a/packages/shared/src/lib/core/app/interfaces/index.ts +++ b/packages/shared/src/lib/core/app/interfaces/index.ts @@ -7,3 +7,4 @@ export * from './app-version-details.interface' export * from './nft-download-state.interface' export * from './platform.interface' export * from './platform-event-map.interface' +export * from './transak-window-data.interface' diff --git a/packages/shared/src/lib/core/app/interfaces/managers/index.ts b/packages/shared/src/lib/core/app/interfaces/managers/index.ts index 1249839a7c..02d522b757 100644 --- a/packages/shared/src/lib/core/app/interfaces/managers/index.ts +++ b/packages/shared/src/lib/core/app/interfaces/managers/index.ts @@ -1,3 +1,4 @@ export * from './deep-link-manager.interface' export * from './notification-manager.interface' export * from './pincode-manager.interface' +export * from './transak-manager.interface' diff --git a/packages/shared/src/lib/core/app/interfaces/managers/transak-manager.interface.ts b/packages/shared/src/lib/core/app/interfaces/managers/transak-manager.interface.ts new file mode 100644 index 0000000000..82950cf500 --- /dev/null +++ b/packages/shared/src/lib/core/app/interfaces/managers/transak-manager.interface.ts @@ -0,0 +1,8 @@ +import { ITransakWindowData } from '../transak-window-data.interface' + +export interface ITransakManager { + openWindow(data: ITransakWindowData): void + closeWindow(): void + positionWindow(): void + setSidebarExpanded(expanded: boolean): void +} diff --git a/packages/shared/src/lib/core/app/interfaces/platform-event-map.interface.ts b/packages/shared/src/lib/core/app/interfaces/platform-event-map.interface.ts index 4730f876f5..9773ce2d8f 100644 --- a/packages/shared/src/lib/core/app/interfaces/platform-event-map.interface.ts +++ b/packages/shared/src/lib/core/app/interfaces/platform-event-map.interface.ts @@ -25,4 +25,5 @@ export interface IPlatformEventMap { 'ledger-error': Error 'lock-screen': void 'native-theme-updated': void + 'transak-data': void } diff --git a/packages/shared/src/lib/core/app/interfaces/platform.interface.ts b/packages/shared/src/lib/core/app/interfaces/platform.interface.ts index 6d462d9528..179eeea77c 100644 --- a/packages/shared/src/lib/core/app/interfaces/platform.interface.ts +++ b/packages/shared/src/lib/core/app/interfaces/platform.interface.ts @@ -5,6 +5,7 @@ import { IAppSettings } from './app-settings.interface' import { IAppVersionDetails } from './app-version-details.interface' import { IPlatformEventMap } from './platform-event-map.interface' import { AppTheme } from '../enums' +import { ITransakWindowData } from './transak-window-data.interface' export interface IPlatform { getStrongholdBackupDestination(defaultPath: string): Promise @@ -61,4 +62,9 @@ export interface IPlatform { startLedgerProcess(): void killLedgerProcess(): void + + openTransak(data: ITransakWindowData): Promise + closeTransak(): Promise + + isSidebarExpanded(expanded: boolean): Promise } diff --git a/packages/shared/src/lib/core/app/interfaces/transak-window-data.interface.ts b/packages/shared/src/lib/core/app/interfaces/transak-window-data.interface.ts new file mode 100644 index 0000000000..c60397178d --- /dev/null +++ b/packages/shared/src/lib/core/app/interfaces/transak-window-data.interface.ts @@ -0,0 +1,5 @@ +export interface ITransakWindowData { + currency: string + address: string + service: 'BUY' | 'SELL' +} diff --git a/packages/shared/src/lib/core/router/enums/dashboard-route.enum.ts b/packages/shared/src/lib/core/router/enums/dashboard-route.enum.ts index e50e878e01..bd53606f5b 100644 --- a/packages/shared/src/lib/core/router/enums/dashboard-route.enum.ts +++ b/packages/shared/src/lib/core/router/enums/dashboard-route.enum.ts @@ -3,5 +3,6 @@ export enum DashboardRoute { Collectibles = 'collectibles', Developer = 'developer', Governance = 'governance', + BuySell = 'buySell', Settings = 'settings', } diff --git a/packages/shared/src/lib/features/interfaces/features.interface.ts b/packages/shared/src/lib/features/interfaces/features.interface.ts index 6b6b374fc4..36fbd8428b 100644 --- a/packages/shared/src/lib/features/interfaces/features.interface.ts +++ b/packages/shared/src/lib/features/interfaces/features.interface.ts @@ -9,6 +9,7 @@ import { ISettingsFeatures } from './settings-features.interface' import { IWalletFeatures } from './wallet-features.interface' import { IWalletConnectFeatures } from './wallet-connect-features.interface' import { OnboardingFeatures } from '../types/onboarding-features.type' +import { IFeatureFlag } from './feature-flag.interface' export interface IFeatures { app: IAppFeatures @@ -22,4 +23,5 @@ export interface IFeatures { settings: ISettingsFeatures wallet: IWalletFeatures walletConnect: IWalletConnectFeatures + buySell: IFeatureFlag } diff --git a/packages/shared/src/locales/en.json b/packages/shared/src/locales/en.json index 2d4bd1b0a7..ea10ad36ec 100644 --- a/packages/shared/src/locales/en.json +++ b/packages/shared/src/locales/en.json @@ -2008,7 +2008,8 @@ "governance": "Governance", "developer": "Developer", "tokens": "Tokens", - "settings": "Settings" + "settings": "Settings", + "buySell": "Buy & Sell" }, "pills": { "asyncStatus": { diff --git a/packages/shared/test/mocks/platform.mock.ts b/packages/shared/test/mocks/platform.mock.ts index ee7a2749a0..75e2ea1b59 100644 --- a/packages/shared/test/mocks/platform.mock.ts +++ b/packages/shared/test/mocks/platform.mock.ts @@ -1,6 +1,6 @@ /* eslint-disable @typescript-eslint/no-unused-vars */ -import { IAppSettings, IAppVersionDetails, IPlatform, IPlatformEventMap } from '@core/app' +import { IAppSettings, IAppVersionDetails, IPlatform, IPlatformEventMap, ITransakWindowData } from '@core/app' import { IError } from '@core/error' const Platform: IPlatform = { @@ -103,6 +103,15 @@ const Platform: IPlatform = { shouldBeDarkMode(): boolean { return true }, + openTransak(data: ITransakWindowData): Promise { + return Promise.resolve() + }, + closeTransak(): Promise { + return Promise.resolve() + }, + isSidebarExpanded(expanded: boolean): Promise { + return Promise.resolve() + }, } window['__CAPACITOR__'] = Platform