feat: add withdraw from l2 popup

packages/desktop/components/modals/AccountActionsMenu.svelte

@@ -34,6 +34,11 @@
         modal?.close()
     }
 
+    function onWithdrawFromL2Click(): void {
+        openPopup({ id: PopupId.WithdrawFromL2 })
+        modal?.close()
+    }
+
     function onVerifyAddressClick(): void {
         const ADDRESS_INDEX = 0
         checkOrConnectLedger(() => {
@@ -79,6 +84,9 @@
                 onClick={onViewAddressHistoryClick}
             />
         {/if}
+        {#if $activeProfile?.network?.id === NetworkId.Shimmer || $activeProfile?.network?.id === NetworkId.Testnet}
+            <MenuItem icon={Icon.Transfer} title={localize('actions.withdrawFromL2')} onClick={onWithdrawFromL2Click} />
+        {/if}
         <MenuItem icon={Icon.Customize} title={localize('actions.customizeAcount')} onClick={onCustomiseAccountClick} />
         {#if $isActiveLedgerProfile}
             <MenuItem

packages/desktop/components/popups/Popup.svelte

@@ -57,6 +57,7 @@
     import VestingCollectPopup from './VestingCollectPopup.svelte'
     import PayoutDetailsPopup from './PayoutDetailsPopup.svelte'
     import VestingRewardsFinderPopup from './VestingRewardsFinderPopup.svelte'
+    import WithdrawFromL2Popup from './WithdrawFromL2Popup.svelte'
 
     export let id: PopupId
     export let props: any
@@ -144,6 +145,7 @@
         [PopupId.VestingCollect]: VestingCollectPopup,
         [PopupId.PayoutDetails]: PayoutDetailsPopup,
         [PopupId.VestingRewardsFinder]: VestingRewardsFinderPopup,
+        [PopupId.WithdrawFromL2]: WithdrawFromL2Popup,
     }
 
     function onKey(event: KeyboardEvent): void {

packages/desktop/components/popups/WithdrawFromL2Popup.svelte

@@ -0,0 +1,62 @@
+<script lang="ts">
+    import { closePopup } from '@auxiliary/popup'
+    import { getSelectedAccount } from '@core/account'
+    import { localize } from '@core/i18n'
+    import { getArchivedBaseTokens } from '@core/layer-2/helpers/getArchivedBaseTokens'
+    import { getBaseToken } from '@core/profile'
+    import { truncateString } from '@core/utils'
+    import { formatTokenAmountPrecise } from '@core/wallet'
+    import { Button, FontWeight, KeyValueBox, Spinner, Text, TextType } from 'shared/components'
+    import { onMount } from 'svelte'
+
+    let address: string | undefined = undefined
+    let withdrawableAmount: number | undefined = undefined
+    const isBusy = false
+    const isWithdrawing = false
+
+    function onCancelClick(): void {
+        closePopup()
+    }
+
+    async function onWithdrawFromL2Click(): Promise<void> {
+        // todo: implement withdrawing
+        // await withdrawFunds(address)
+    }
+
+    onMount(async () => {
+        address = getSelectedAccount().depositAddress
+        withdrawableAmount = await getArchivedBaseTokens(address)
+    })
+</script>
+
+<div class="flex flex-col space-y-6">
+    <Text type={TextType.h3} fontWeight={FontWeight.semibold} lineHeight="6">
+        {localize('popups.withdrawFromL2.title')}
+    </Text>
+    <Text fontSize="15" color="gray-700" classes="text-left">{localize('popups.withdrawFromL2.body')}</Text>
+    {#if address}
+        <KeyValueBox
+            classes="flex items-center w-full py-4"
+            keyText={truncateString(address, 15, 15)}
+            valueText={formatTokenAmountPrecise(withdrawableAmount, getBaseToken())}
+        />
+    {:else}
+        <div class="flex items-center justify-center">
+            <Spinner />
+        </div>
+    {/if}
+    <div class="flex flex-row flex-nowrap w-full space-x-4 mt-6">
+        <Button classes="w-full" outline onClick={onCancelClick} disabled={isBusy}>
+            {localize('actions.cancel')}
+        </Button>
+        <Button
+            classes="w-full"
+            onClick={onWithdrawFromL2Click}
+            disabled={isBusy || isWithdrawing || !withdrawableAmount}
+            {isBusy}
+            busyMessage={localize('popups.withdrawFromL2.withdrawing')}
+        >
+            {localize('popups.withdrawFromL2.withdraw')}
+        </Button>
+    </div>
+</div>

packages/shared/lib/auxiliary/popup/enums/popup-id.enum.ts

@@ -49,4 +49,5 @@ export enum PopupId {
     VestingCollect = 'vestingCollect',
     PayoutDetails = 'payoutDetails',
     VestingRewardsFinder = 'vestingRewardsFinder',
+    WithdrawFromL2 = 'withdrawFromL2',
 }

packages/shared/lib/core/layer-2/constants/withdraw.constant.ts

@@ -1 +1 @@
-export const WITHDRAW = 0x9dcc0f41;
+export const WITHDRAW = 0x9dcc0f41

packages/shared/lib/core/layer-2/helpers/getArchivedBaseTokens.ts

@@ -1,18 +1,20 @@
-const URL =
-  "https://archive.evm.shimmer.shimmer.network/v1/chains/smr1prxvwqvwf7nru5q5xvh5thwg54zsm2y4wfnk6yk56hj3exxkg92mx20wl3s/core/accounts/account/{address}/balance";
+import { get } from 'svelte/store'
+import { activeProfile } from '@core/profile'
+import { DEFAULT_CHAIN_CONFIGURATIONS } from '@core/network'
 
 interface Response {
-  baseTokens: number;
+    baseTokens: number
 }
 
 export async function getArchivedBaseTokens(address: string): Promise<number> {
-  const url = URL.replace("{address}", address);
-  try {
-    const res: Response = await fetch(url)
-      .then((r) => r.json());
+    const defaultChainConfig = DEFAULT_CHAIN_CONFIGURATIONS[get(activeProfile)?.network?.id]
+    const URL = `${defaultChainConfig?.archiveEndpoint}/core/accounts/account/${address}/balance`
 
-    return res.baseTokens;
-  } catch (_) {
-    return 0;
-  }
+    try {
+        const res: Response = await fetch(URL).then((r) => r.json())
+
+        return res.baseTokens
+    } catch (_) {
+        return 0
+    }
 }

packages/shared/lib/core/layer-2/helpers/widthdrawL2Funds.ts

@@ -1,19 +1,21 @@
-const URL =
-  "https://archive.evm.shimmer.shimmer.network/v1/chains/smr1prxvwqvwf7nru5q5xvh5thwg54zsm2y4wfnk6yk56hj3exxkg92mx20wl3s/core/accounts/account/{address}/balance";
+import { get } from 'svelte/store'
+import { activeProfile } from '@core/profile'
+import { DEFAULT_CHAIN_CONFIGURATIONS } from '@core/network'
 
 interface Response {
-  baseTokens: number;
+    baseTokens: number
 }
 
+export async function withdrawFunds(address: string): Promise<number> {
+    const defaultChainConfig = DEFAULT_CHAIN_CONFIGURATIONS[get(activeProfile)?.network?.id]
+    // todo: change to withdraw endpoint
+    const URL = `${defaultChainConfig?.archiveEndpoint}/core/accounts/account/${address}/balance`
 
-export async function withdrawFunds(address: string) {
-  const url = URL.replace("{address}", address);
-  try {
-    const res: Response = await fetch(url)
-      .then((r) => r.json());
+    try {
+        const res: Response = await fetch(URL).then((r) => r.json())
 
-    return res.baseTokens;
-  } catch (_) {
-    return 0;
-  }
+        return res.baseTokens
+    } catch (_) {
+        return 0
+    }
 }

packages/shared/lib/core/network/constants/default-chain-configurations.constant.ts

@@ -11,6 +11,8 @@ export const DEFAULT_CHAIN_CONFIGURATIONS: Readonly<{ [id in NetworkId]?: ChainM
         aliasAddress: 'smr1prxvwqvwf7nru5q5xvh5thwg54zsm2y4wfnk6yk56hj3exxkg92mx20wl3s',
         iscpEndpoint:
             'https://api.evm.shimmer.network/v1/chains/smr1prxvwqvwf7nru5q5xvh5thwg54zsm2y4wfnk6yk56hj3exxkg92mx20wl3s',
+        archiveEndpoint:
+            'https://archive.evm.shimmer.network/v1/chains/smr1prxvwqvwf7nru5q5xvh5thwg54zsm2y4wfnk6yk56hj3exxkg92mx20wl3s',
     },
     [NetworkId.Testnet]: {
         type: ChainType.Iscp,
@@ -19,5 +21,7 @@ export const DEFAULT_CHAIN_CONFIGURATIONS: Readonly<{ [id in NetworkId]?: ChainM
         aliasAddress: 'rms1ppp00k5mmd2m8my8ukkp58nd3rskw6rx8l09aj35984k74uuc5u2cywn3ex',
         iscpEndpoint:
             'https://api.evm.testnet.shimmer.network/v1/chains/rms1ppp00k5mmd2m8my8ukkp58nd3rskw6rx8l09aj35984k74uuc5u2cywn3ex',
+        archiveEndpoint:
+            'https://archive.evm.testnet.shimmer.network/v1/chains/rms1ppp00k5mmd2m8my8ukkp58nd3rskw6rx8l09aj35984k74uuc5u2cywn3ex',
     },
 }

packages/shared/lib/core/network/interfaces/chain-metadata.interface.ts

@@ -11,4 +11,5 @@ export interface IIscpChainMetadata extends IBaseChainMetadata {
     type: ChainType.Iscp
     aliasAddress: string
     iscpEndpoint: string
+    archiveEndpoint: string
 }

packages/shared/locales/en.json

@@ -1188,6 +1188,12 @@
             "disclaimer": "List of addresses with funds or known by this profile",
             "indexAndType": "{internal, select, true {Internal address} other {Deposit address}} {index}",
             "internal": "Internal"
+        },
+        "withdrawFromL2": {
+            "title": "Withdraw from L2",
+            "body": "List of addresses with withdrawable funds",
+            "withdraw": "Withdraw",
+            "withdrawing": "Withdrawing..."
         }
     },
     "charts": {
@@ -1340,6 +1346,7 @@
         "viewStatus": "View status",
         "viewAddressHistory": "View address history",
         "viewBalanceBreakdown": "View balance breakdown",
+        "withdrawFromL2": "Withdraw from L2",
         "verifyDepositAddress": "Verify deposit address",
         "showHiddenAccounts": "Show hidden wallets",
         "confirm": "Confirm",