WIP: integration with ledger

2026-02-04 02:01:22 +03:00
parent f1f16a30e6
commit f44ef56ff3
32 changed files with 1226 additions and 405 deletions
--- a/frontend/pweb/lib/pages/dashboard/buttons/balance/balance.dart
+++ b/frontend/pweb/lib/pages/dashboard/buttons/balance/balance.dart
@@ -16,10 +16,92 @@ import 'package:pweb/generated/i18n/app_localizations.dart';
 class BalanceWidget extends StatelessWidget {
  final ValueChanged<Wallet> onTopUp;

-  const BalanceWidget({
-    super.key,
-    required this.onTopUp,
-  });
+  const BalanceWidget({super.key, required this.onTopUp});
+
+  @override
+  Widget build(BuildContext context) => _BalanceWidgetBody(onTopUp: onTopUp);
+}
+
+class _BalanceWidgetBody extends StatefulWidget {
+  final ValueChanged<Wallet> onTopUp;
+
+  const _BalanceWidgetBody({required this.onTopUp});
+
+  @override
+  State<_BalanceWidgetBody> createState() => _BalanceWidgetBodyState();
+}
+
+class _BalanceWidgetBodyState extends State<_BalanceWidgetBody> {
+  WalletsController? _walletsController;
+  LedgerAccountsProvider? _ledgerProvider;
+  CarouselIndexController? _carouselController;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    final nextWallets = context.read<WalletsController>();
+    final nextLedger = context.read<LedgerAccountsProvider>();
+    final nextCarousel = context.read<CarouselIndexController>();
+
+    if (!identical(_walletsController, nextWallets)) {
+      _walletsController?.removeListener(_syncSelection);
+      _walletsController = nextWallets;
+      _walletsController?.addListener(_syncSelection);
+    }
+
+    if (!identical(_ledgerProvider, nextLedger)) {
+      _ledgerProvider?.removeListener(_syncSelection);
+      _ledgerProvider = nextLedger;
+      _ledgerProvider?.addListener(_syncSelection);
+    }
+
+    if (!identical(_carouselController, nextCarousel)) {
+      _carouselController?.removeListener(_syncSelection);
+      _carouselController = nextCarousel;
+      _carouselController?.addListener(_syncSelection);
+    }
+
+    WidgetsBinding.instance.addPostFrameCallback((_) => _syncSelection());
+  }
+
+  @override
+  void dispose() {
+    _walletsController?.removeListener(_syncSelection);
+    _ledgerProvider?.removeListener(_syncSelection);
+    _carouselController?.removeListener(_syncSelection);
+    super.dispose();
+  }
+
+  void _syncSelection() {
+    final walletsController = _walletsController;
+    final carousel = _carouselController;
+    final ledgerProvider = _ledgerProvider;
+    if (walletsController == null ||
+        carousel == null ||
+        ledgerProvider == null) {
+      return;
+    }
+
+    final items = <BalanceItem>[
+      ...walletsController.wallets.map(BalanceItem.wallet),
+      ...ledgerProvider.accounts.map(BalanceItem.ledger),
+      const BalanceItem.addAction(),
+    ];
+    if (items.isEmpty) return;
+
+    final safeIndex = carousel.index.clamp(0, items.length - 1);
+    if (safeIndex != carousel.index) {
+      carousel.setIndex(safeIndex, items.length);
+      return;
+    }
+
+    final current = items[safeIndex];
+    if (!current.isWallet) return;
+    final wallet = current.wallet!;
+    if (walletsController.selectedWallet?.id != wallet.id) {
+      walletsController.selectWallet(wallet);
+    }
+  }

  @override
  Widget build(BuildContext context) {
@@ -30,7 +112,8 @@ class BalanceWidget extends StatelessWidget {

    final wallets = walletsController.wallets;
    final accounts = ledgerProvider.accounts;
-    final isLoading = walletsController.isLoading &&
+    final isLoading =
+        walletsController.isLoading &&
        ledgerProvider.isLoading &&
        wallets.isEmpty &&
        accounts.isEmpty;
@@ -49,19 +132,7 @@ class BalanceWidget extends StatelessWidget {
      return const SizedBox.shrink();
    }

-    // Ensure index is always valid when list changes
-    carousel.setIndex(carousel.index, items.length);
-
-    final index = carousel.index;
-    final current = items[index];
-
-    // Single source of truth: controller
-    if (current.isWallet) {
-      final wallet = current.wallet!;
-      if (walletsController.selectedWallet?.id != wallet.id) {
-        walletsController.selectWallet(wallet);
-      }
-    }
+    final index = carousel.index.clamp(0, items.length - 1);

    final carouselWidget = BalanceCarousel(
      items: items,
@@ -73,7 +144,7 @@ class BalanceWidget extends StatelessWidget {
          walletsController.selectWallet(next.wallet!);
        }
      },
-      onTopUp: onTopUp,
+      onTopUp: widget.onTopUp,
    );

    if (wallets.isEmpty && accounts.isEmpty) {
--- a/frontend/pweb/lib/pages/dashboard/payouts/amount.dart
+++ b/frontend/pweb/lib/pages/dashboard/payouts/amount.dart
@@ -2,12 +2,13 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/models/payment/source.dart';
 import 'package:pshared/provider/payment/amount.dart';
 import 'package:pshared/utils/currency.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

-
 class PaymentAmountWidget extends StatefulWidget {
  const PaymentAmountWidget({super.key});

@@ -32,7 +33,8 @@ class _PaymentAmountWidgetState extends State<PaymentAmountWidget> {
    super.dispose();
  }

-  double? _parseAmount(String value) => double.tryParse(value.replaceAll(',', '.'));
+  double? _parseAmount(String value) =>
+      double.tryParse(value.replaceAll(',', '.'));

  void _syncTextWithAmount(double amount) {
    final parsedText = _parseAmount(_controller.text);
@@ -58,14 +60,28 @@ class _PaymentAmountWidgetState extends State<PaymentAmountWidget> {

  @override
  Widget build(BuildContext context) {
-    final amount = context.select<PaymentAmountProvider, double>((provider) => provider.amount);
+    final amount = context.select<PaymentAmountProvider, double>(
+      (provider) => provider.amount,
+    );
+    final source = context.watch<PaymentSourceController>().selectedSource;
    _syncTextWithAmount(amount);
+    final sourceCurrency = switch (source?.type) {
+      null => null,
+      PaymentSourceType.wallet => currencyCodeToString(
+        source!.wallet!.currency,
+      ),
+      PaymentSourceType.ledger =>
+        source!.ledgerAccount?.currency.trim().toUpperCase(),
+    };
+    final amountLabel = sourceCurrency == null || sourceCurrency.isEmpty
+        ? AppLocalizations.of(context)!.amount
+        : '${AppLocalizations.of(context)!.amount} ($sourceCurrency)';

    return TextField(
      controller: _controller,
      keyboardType: const TextInputType.numberWithOptions(decimal: true),
      decoration: InputDecoration(
-        labelText: AppLocalizations.of(context)!.amount,
+        labelText: amountLabel,
        border: const OutlineInputBorder(),
      ),
      onChanged: _onChanged,
--- a/frontend/pweb/lib/pages/dashboard/payouts/summary/widget.dart
+++ b/frontend/pweb/lib/pages/dashboard/payouts/summary/widget.dart
@@ -2,7 +2,9 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

-import 'package:pshared/controllers/balance_mask/wallets.dart';
+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/models/currency.dart';
+import 'package:pshared/models/payment/source.dart';
 import 'package:pshared/utils/currency.dart';

 import 'package:pweb/pages/dashboard/payouts/summary/fee.dart';
@@ -10,24 +12,43 @@ import 'package:pweb/pages/dashboard/payouts/summary/recipient_receives.dart';
 import 'package:pweb/pages/dashboard/payouts/summary/sent_amount.dart';
 import 'package:pweb/pages/dashboard/payouts/summary/total.dart';

-
 class PaymentSummary extends StatelessWidget {
  final double spacing;

  const PaymentSummary({super.key, required this.spacing});

+  Currency _currencyForSource(PaymentSource? source) {
+    if (source == null) return Currency.usdt;
+    return switch (source.type) {
+      PaymentSourceType.wallet => source.wallet!.currency,
+      PaymentSourceType.ledger => () {
+        final code = source.ledgerAccount?.currency.trim().toUpperCase() ?? '';
+        try {
+          return currencyStringToCode(code);
+        } catch (_) {
+          return Currency.rub;
+        }
+      }(),
+    };
+  }
+
  @override
-  Widget build(BuildContext context) => Align(
-    alignment: Alignment.center,
-    child: Column(
-      crossAxisAlignment: CrossAxisAlignment.stretch,
-      children: [
-        PaymentSentAmountRow(currency: currencyStringToCode(context.read<WalletsController>().selectedWallet?.tokenSymbol ?? 'USDT')),
-        const PaymentFeeRow(),
-        const PaymentRecipientReceivesRow(),
-        SizedBox(height: spacing),
-        const PaymentTotalRow(),
-      ],
-    ),
-  );
+  Widget build(BuildContext context) {
+    final source = context.watch<PaymentSourceController>().selectedSource;
+    final sentCurrency = _currencyForSource(source);
+
+    return Align(
+      alignment: Alignment.center,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          PaymentSentAmountRow(currency: sentCurrency),
+          const PaymentFeeRow(),
+          const PaymentRecipientReceivesRow(),
+          SizedBox(height: spacing),
+          const PaymentTotalRow(),
+        ],
+      ),
+    );
+  }
 }
--- a/frontend/pweb/lib/pages/invitations/widgets/form/fields.dart
+++ b/frontend/pweb/lib/pages/invitations/widgets/form/fields.dart
@@ -79,9 +79,9 @@ class InvitationFormFields extends StatelessWidget {
            SizedBox(
              width: _fieldWidth,
              child: TextFormField(
-                controller: firstNameController,
+                controller: lastNameController,
                decoration: InputDecoration(
-                  labelText: loc.firstName,
+                  labelText: loc.lastName,
                  prefixIcon: const Icon(Icons.person_outline),
                ),
              ),
@@ -89,9 +89,9 @@ class InvitationFormFields extends StatelessWidget {
            SizedBox(
              width: _fieldWidth,
              child: TextFormField(
-                controller: lastNameController,
+                controller: firstNameController,
                decoration: InputDecoration(
-                  labelText: loc.lastName,
+                  labelText: loc.firstName,
                  prefixIcon: const Icon(Icons.person_outline),
                ),
              ),
--- a/frontend/pweb/lib/pages/payment_methods/page.dart
+++ b/frontend/pweb/lib/pages/payment_methods/page.dart
@@ -2,9 +2,9 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

-import 'package:pshared/controllers/balance_mask/wallets.dart';
 import 'package:pshared/models/payment/type.dart';
 import 'package:pshared/models/recipient/recipient.dart';
+import 'package:pshared/controllers/payment/source.dart';
 import 'package:pshared/provider/payment/flow.dart';
 import 'package:pshared/provider/payment/provider.dart';
 import 'package:pshared/provider/recipient/pmethods.dart';
@@ -45,7 +45,9 @@ class _PaymentPageState extends State<PaymentPage> {
    _searchController = TextEditingController();
    _searchFocusNode = FocusNode();

-    WidgetsBinding.instance.addPostFrameCallback((_) => _initializePaymentPage());
+    WidgetsBinding.instance.addPostFrameCallback(
+      (_) => _initializePaymentPage(),
+    );
  }

  @override
@@ -126,7 +128,7 @@ class _PaymentPageState extends State<PaymentPage> {
      searchQuery: _query,
      filteredRecipients: filteredRecipients,
      methodsProvider: methodsProvider,
-      onWalletSelected: context.read<WalletsController>().selectWallet,
+      onSourceSelected: context.read<PaymentSourceController>().selectSource,
      searchController: _searchController,
      searchFocusNode: _searchFocusNode,
      onSearchChanged: _handleSearchChanged,
--- a/frontend/pweb/lib/pages/payment_methods/payment_page/body.dart
+++ b/frontend/pweb/lib/pages/payment_methods/payment_page/body.dart
@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';

 import 'package:pshared/models/recipient/recipient.dart';
-import 'package:pshared/models/payment/wallet.dart';
+import 'package:pshared/models/payment/source.dart';
 import 'package:pshared/provider/recipient/pmethods.dart';
 import 'package:pshared/provider/recipient/provider.dart';

@@ -11,7 +11,6 @@ import 'package:pweb/pages/payment_methods/payment_page/page.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

-
 class PaymentPageBody extends StatelessWidget {
  final ValueChanged<Recipient?>? onBack;
  final Recipient? recipient;
@@ -20,7 +19,7 @@ class PaymentPageBody extends StatelessWidget {
  final String searchQuery;
  final List<Recipient> filteredRecipients;
  final PaymentMethodsProvider methodsProvider;
-  final ValueChanged<Wallet> onWalletSelected;
+  final ValueChanged<PaymentSource> onSourceSelected;
  final PayoutDestination fallbackDestination;
  final TextEditingController searchController;
  final FocusNode searchFocusNode;
@@ -38,7 +37,7 @@ class PaymentPageBody extends StatelessWidget {
    required this.searchQuery,
    required this.filteredRecipients,
    required this.methodsProvider,
-    required this.onWalletSelected,
+    required this.onSourceSelected,
    required this.fallbackDestination,
    required this.searchController,
    required this.searchFocusNode,
@@ -58,7 +57,9 @@ class PaymentPageBody extends StatelessWidget {

    if (methodsProvider.error != null) {
      return PaymentMethodsErrorView(
-        message: loc.notificationError(methodsProvider.error ?? loc.noErrorInformation),
+        message: loc.notificationError(
+          methodsProvider.error ?? loc.noErrorInformation,
+        ),
      );
    }

@@ -69,7 +70,7 @@ class PaymentPageBody extends StatelessWidget {
      recipientProvider: recipientProvider,
      searchQuery: searchQuery,
      filteredRecipients: filteredRecipients,
-      onWalletSelected: onWalletSelected,
+      onSourceSelected: onSourceSelected,
      fallbackDestination: fallbackDestination,
      searchController: searchController,
      searchFocusNode: searchFocusNode,
--- a/frontend/pweb/lib/pages/payment_methods/payment_page/content.dart
+++ b/frontend/pweb/lib/pages/payment_methods/payment_page/content.dart
@@ -1,134 +0,0 @@
-import 'package:flutter/material.dart';
-
-import 'package:provider/provider.dart';
-
-import 'package:pshared/controllers/balance_mask/wallets.dart';
-import 'package:pshared/models/payment/wallet.dart';
-import 'package:pshared/models/recipient/recipient.dart';
-import 'package:pshared/provider/recipient/provider.dart';
-
-import 'package:pweb/pages/payment_methods/payment_page/back_button.dart';
-import 'package:pweb/pages/payment_methods/payment_page/header.dart';
-import 'package:pweb/pages/payment_methods/payment_page/method_selector.dart';
-import 'package:pweb/pages/payment_methods/payment_page/send_button.dart';
-import 'package:pweb/pages/dashboard/payouts/form.dart';
-import 'package:pweb/pages/payment_methods/widgets/payment_info_section.dart';
-import 'package:pweb/pages/payment_methods/widgets/recipient_section.dart';
-import 'package:pweb/pages/payment_methods/widgets/section_title.dart';
-import 'package:pweb/utils/dimensions.dart';
-import 'package:pweb/widgets/sidebar/destinations.dart';
-import 'package:pweb/widgets/refresh_balance/wallet.dart';
-
-import 'package:pweb/generated/i18n/app_localizations.dart';
-
-
-class PaymentPageContent extends StatelessWidget {
-  final ValueChanged<Recipient?>? onBack;
-  final Recipient? recipient;
-  final Recipient? previousRecipient;
-  final RecipientsProvider recipientProvider;
-  final String searchQuery;
-  final List<Recipient> filteredRecipients;
-  final ValueChanged<Wallet> onWalletSelected;
-  final PayoutDestination fallbackDestination;
-  final TextEditingController searchController;
-  final FocusNode searchFocusNode;
-  final ValueChanged<String> onSearchChanged;
-  final ValueChanged<Recipient> onRecipientSelected;
-  final VoidCallback onRecipientCleared;
-  final VoidCallback onSend;
-
-  const PaymentPageContent({
-    super.key,
-    required this.onBack,
-    required this.recipient,
-    required this.previousRecipient,
-    required this.recipientProvider,
-    required this.searchQuery,
-    required this.filteredRecipients,
-    required this.onWalletSelected,
-    required this.fallbackDestination,
-    required this.searchController,
-    required this.searchFocusNode,
-    required this.onSearchChanged,
-    required this.onRecipientSelected,
-    required this.onRecipientCleared,
-    required this.onSend,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    final dimensions = AppDimensions();
-    final loc = AppLocalizations.of(context)!;
-   
-    return Align(
-      alignment: Alignment.topCenter,
-      child: ConstrainedBox(
-        constraints: BoxConstraints(maxWidth: dimensions.maxContentWidth),
-        child: Material(
-          elevation: dimensions.elevationSmall,
-          borderRadius: BorderRadius.circular(dimensions.borderRadiusMedium),
-          color: Theme.of(context).colorScheme.onSecondary,
-          child: Padding(
-            padding: EdgeInsets.all(dimensions.paddingLarge),
-            child: SingleChildScrollView(
-              child: Column(
-                mainAxisSize: MainAxisSize.min,
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  PaymentBackButton(
-                    onBack: onBack,
-                    recipient: recipient,
-                    fallbackDestination: fallbackDestination,
-                  ),
-                  SizedBox(height: dimensions.paddingSmall),
-                  PaymentHeader(),
-                  SizedBox(height: dimensions.paddingXXLarge),
-                  Row(
-                    children: [
-                      Expanded(child: SectionTitle(loc.sourceOfFunds)),
-                      Consumer<WalletsController>(
-                        builder: (context, provider, _) {
-                          final selectedWalletId = provider.selectedWallet?.id;
-                          if (selectedWalletId == null) {
-                            return const SizedBox.shrink();
-                          }
-                          return WalletBalanceRefreshButton(walletRef: selectedWalletId);
-                        },
-                      ),
-                    ],
-                  ),
-                  SizedBox(height: dimensions.paddingSmall),
-                  PaymentMethodSelector(
-                    onMethodChanged: onWalletSelected,
-                  ),
-                  SizedBox(height: dimensions.paddingXLarge),
-                  RecipientSection(
-                    recipient: recipient,
-                    previousRecipient: previousRecipient,
-                    dimensions: dimensions,
-                    recipientProvider: recipientProvider,
-                    searchQuery: searchQuery,
-                    filteredRecipients: filteredRecipients,
-                    searchController: searchController,
-                    searchFocusNode: searchFocusNode,
-                    onSearchChanged: onSearchChanged,
-                    onRecipientSelected: onRecipientSelected,
-                    onRecipientCleared: onRecipientCleared,
-                  ),
-                  SizedBox(height: dimensions.paddingXLarge),
-                  PaymentInfoSection(dimensions: dimensions),
-                  SizedBox(height: dimensions.paddingLarge),
-                  const PaymentFormWidget(),
-                  SizedBox(height: dimensions.paddingXXXLarge),
-                  SendButton(onPressed: onSend),
-                  SizedBox(height: dimensions.paddingLarge),
-                ],
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}
--- a/frontend/pweb/lib/pages/payment_methods/payment_page/method_selector.dart
+++ b/frontend/pweb/lib/pages/payment_methods/payment_page/method_selector.dart
@@ -2,26 +2,74 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

-import 'package:pshared/controllers/balance_mask/wallets.dart';
-import 'package:pshared/models/payment/wallet.dart';
-
-import 'package:pweb/utils/payment/dropdown.dart';
+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/models/payment/source.dart';

+import 'package:pweb/generated/i18n/app_localizations.dart';

 class PaymentMethodSelector extends StatelessWidget {
-  final ValueChanged<Wallet> onMethodChanged;
+  final ValueChanged<PaymentSource> onMethodChanged;

-  const PaymentMethodSelector({
+  const PaymentMethodSelector({super.key, required this.onMethodChanged});
+
+  @override
+  Widget build(BuildContext context) => Consumer<PaymentSourceController>(
+    builder: (context, provider, _) => PaymentMethodDropdown(
+      methods: provider.sources,
+      selectedMethod: provider.selectedSource,
+      onChanged: onMethodChanged,
+    ),
+  );
+}
+
+class PaymentMethodDropdown extends StatelessWidget {
+  final List<PaymentSource> methods;
+  final ValueChanged<PaymentSource> onChanged;
+  final PaymentSource? selectedMethod;
+
+  const PaymentMethodDropdown({
    super.key,
-    required this.onMethodChanged,
+    required this.methods,
+    required this.onChanged,
+    this.selectedMethod,
  });

  @override
-  Widget build(BuildContext context) => Consumer<WalletsController>(
-        builder: (context, provider, _) => PaymentMethodDropdown(
-          methods: provider.wallets,
-          selectedMethod: provider.selectedWallet,
-          onChanged: onMethodChanged,
-        ),
-      );
+  Widget build(BuildContext context) => DropdownButtonFormField<PaymentSource>(
+    dropdownColor: Theme.of(context).colorScheme.onSecondary,
+    initialValue: _getSelectedMethod(),
+    decoration: InputDecoration(
+      labelText: AppLocalizations.of(context)!.whereGetMoney,
+      border: OutlineInputBorder(borderRadius: BorderRadius.circular(8)),
+    ),
+    items: methods
+        .map(
+          (method) => DropdownMenuItem<PaymentSource>(
+            value: method,
+            child: Text(_labelForSource(context, method)),
+          ),
+        )
+        .toList(),
+    onChanged: (value) {
+      if (value != null) {
+        onChanged(value);
+      }
+    },
+  );
+
+  PaymentSource? _getSelectedMethod() {
+    if (selectedMethod != null) return selectedMethod;
+    if (methods.isEmpty) return null;
+    return methods.first;
+  }
+
+  String _labelForSource(BuildContext context, PaymentSource source) {
+    final name = source.name.trim();
+    final loc = AppLocalizations.of(context)!;
+    if (name.isNotEmpty) return name;
+    return switch (source.type) {
+      PaymentSourceType.wallet => loc.paymentTypeManagedWallet,
+      PaymentSourceType.ledger => loc.paymentTypeLedger,
+    };
+  }
 }
--- a/frontend/pweb/lib/pages/payment_methods/payment_page/page.dart
+++ b/frontend/pweb/lib/pages/payment_methods/payment_page/page.dart
@@ -1,6 +1,6 @@
 import 'package:flutter/material.dart';

-import 'package:pshared/models/payment/wallet.dart';
+import 'package:pshared/models/payment/source.dart';
 import 'package:pshared/models/recipient/recipient.dart';
 import 'package:pshared/provider/recipient/provider.dart';

@@ -17,7 +17,6 @@ import 'package:pweb/widgets/sidebar/destinations.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

-
 class PaymentPageContent extends StatelessWidget {
  final ValueChanged<Recipient?>? onBack;
  final Recipient? recipient;
@@ -25,7 +24,7 @@ class PaymentPageContent extends StatelessWidget {
  final RecipientsProvider recipientProvider;
  final String searchQuery;
  final List<Recipient> filteredRecipients;
-  final ValueChanged<Wallet> onWalletSelected;
+  final ValueChanged<PaymentSource> onSourceSelected;
  final PayoutDestination fallbackDestination;
  final TextEditingController searchController;
  final FocusNode searchFocusNode;
@@ -42,7 +41,7 @@ class PaymentPageContent extends StatelessWidget {
    required this.recipientProvider,
    required this.searchQuery,
    required this.filteredRecipients,
-    required this.onWalletSelected,
+    required this.onSourceSelected,
    required this.fallbackDestination,
    required this.searchController,
    required this.searchFocusNode,
@@ -56,7 +55,7 @@ class PaymentPageContent extends StatelessWidget {
  Widget build(BuildContext context) {
    final dimensions = AppDimensions();
    final loc = AppLocalizations.of(context)!;
-    
+
    return Align(
      alignment: Alignment.topCenter,
      child: ConstrainedBox(
@@ -82,9 +81,7 @@ class PaymentPageContent extends StatelessWidget {
                  SizedBox(height: dimensions.paddingXXLarge),
                  SectionTitle(loc.sourceOfFunds),
                  SizedBox(height: dimensions.paddingSmall),
-                  PaymentMethodSelector(
-                    onMethodChanged: onWalletSelected,
-                  ),
+                  PaymentMethodSelector(onMethodChanged: onSourceSelected),
                  SizedBox(height: dimensions.paddingXLarge),
                  RecipientSection(
                    recipient: recipient,
--- a/frontend/pweb/lib/pages/payout_page/page.dart
+++ b/frontend/pweb/lib/pages/payout_page/page.dart
@@ -10,11 +10,15 @@ import 'package:pweb/pages/payout_page/wallet/wigets.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

-
 class PaymentConfigPage extends StatelessWidget {
  final Function(Wallet) onWalletTap;
+  final Function(String ledgerAccountRef) onLedgerTap;

-  const PaymentConfigPage({super.key, required this.onWalletTap});
+  const PaymentConfigPage({
+    super.key,
+    required this.onWalletTap,
+    required this.onLedgerTap,
+  });

  @override
  Widget build(BuildContext context) {
@@ -26,14 +30,21 @@ class PaymentConfigPage extends StatelessWidget {
    }

    if (provider.error != null) {
-      return Center(child: Text(loc.notificationError(provider.error ?? loc.noErrorInformation)));
+      return Center(
+        child: Text(
+          loc.notificationError(provider.error ?? loc.noErrorInformation),
+        ),
+      );
    }

    return Column(
      children: [
        MethodsWidget(),
        Expanded(
-          child: WalletWidgets(onWalletTap: onWalletTap),
+          child: WalletWidgets(
+            onWalletTap: onWalletTap,
+            onLedgerTap: onLedgerTap,
+          ),
        ),
      ],
    );
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/buttons.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/buttons.dart
@@ -1,10 +1,7 @@
 import 'package:flutter/material.dart';

-import 'package:provider/provider.dart';
-
 import 'package:pweb/pages/payout_page/wallet/edit/buttons/send.dart';
 import 'package:pweb/pages/payout_page/wallet/edit/buttons/top_up.dart';
-import 'package:pshared/provider/payment/wallets.dart';


 class ButtonsWalletWidget extends StatelessWidget {
@@ -12,25 +9,17 @@ class ButtonsWalletWidget extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    final provider = context.watch<WalletsProvider>();
-    
-    if (provider.wallets.isEmpty) return const SizedBox.shrink();
-
    return Row(
-        mainAxisAlignment: MainAxisAlignment.spaceAround,
-        children: [
-          Expanded(
-            child: SendPayoutButton(),
-          ),
-          VerticalDivider(
-            color: Theme.of(context).colorScheme.primary,
-            thickness: 1,
-            width: 10,
-          ),
-          Expanded(
-            child: TopUpButton(),
-          ),
-        ],
+      mainAxisAlignment: MainAxisAlignment.spaceAround,
+      children: [
+        Expanded(child: SendPayoutButton()),
+        VerticalDivider(
+          color: Theme.of(context).colorScheme.primary,
+          thickness: 1,
+          width: 10,
+        ),
+        Expanded(child: TopUpButton()),
+      ],
    );
  }
-}
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/send.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/send.dart
@@ -2,7 +2,8 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

-import 'package:pshared/controllers/balance_mask/wallets.dart';
+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/models/payment/source.dart';
 import 'package:pshared/models/payment/type.dart';

 import 'package:pweb/app/router/payout_routes.dart';
@@ -18,20 +19,18 @@ class SendPayoutButton extends StatelessWidget {
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context)!;
    return ElevatedButton(
-      style: ElevatedButton.styleFrom(
-        shadowColor: null,
-        elevation: 0,
-      ),
+      style: ElevatedButton.styleFrom(shadowColor: null, elevation: 0),
      onPressed: () {
-        final wallets = context.read<WalletsController>();
-        final wallet = wallets.selectedWallet;
-        
-        if (wallet != null) {
-          context.pushToPayment(
-            paymentType: PaymentType.wallet,
-            returnTo: PayoutDestination.editwallet,
-          );
-        }
+        final source = context.read<PaymentSourceController>().selectedSource;
+        if (source == null) return;
+        final paymentType = switch (source.type) {
+          PaymentSourceType.wallet => PaymentType.wallet,
+          PaymentSourceType.ledger => PaymentType.ledger,
+        };
+        context.pushToPayment(
+          paymentType: paymentType,
+          returnTo: PayoutDestination.editwallet,
+        );
      },
      child: Text(loc.payoutNavSendPayout),
    );
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/top_up.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/buttons/top_up.dart
@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';

 import 'package:provider/provider.dart';

-import 'package:pshared/controllers/balance_mask/wallets.dart';
+import 'package:pshared/controllers/payment/source.dart';

 import 'package:pweb/app/router/payout_routes.dart';
 import 'package:pweb/widgets/sidebar/destinations.dart';
@@ -10,23 +10,20 @@ import 'package:pweb/widgets/sidebar/destinations.dart';
 import 'package:pweb/generated/i18n/app_localizations.dart';


-class TopUpButton extends StatelessWidget{
+class TopUpButton extends StatelessWidget {
  const TopUpButton({super.key});

  @override
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context)!;
    return ElevatedButton(
-      style: ElevatedButton.styleFrom(
-        shadowColor: null,
-        elevation: 0,
-      ),
+      style: ElevatedButton.styleFrom(shadowColor: null, elevation: 0),
      onPressed: () {
-        final wallet = context.read<WalletsController>().selectedWallet;
-        if (wallet == null) {
-          ScaffoldMessenger.of(context).showSnackBar(
-            SnackBar(content: Text(loc.noWalletSelected)),
-          );
+        final source = context.read<PaymentSourceController>().selectedSource;
+        if (source == null) {
+          ScaffoldMessenger.of(
+            context,
+          ).showSnackBar(SnackBar(content: Text(loc.noWalletSelected)));
          return;
        }
        context.pushToWalletTopUp(returnTo: PayoutDestination.editwallet);
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/balance_row.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/balance_row.dart
@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+
+import 'package:provider/provider.dart';
+
+import 'package:pshared/controllers/balance_mask/ledger_accounts.dart';
+import 'package:pshared/models/ledger/account.dart';
+
+import 'package:pweb/pages/payout_page/wallet/ledger/format.dart';
+import 'package:pweb/widgets/refresh_balance/ledger.dart';
+
+
+class LedgerEditBalanceRow extends StatelessWidget {
+  final LedgerAccount account;
+
+  const LedgerEditBalanceRow({super.key, required this.account});
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
+    return Consumer<LedgerBalanceMaskController>(
+      builder: (context, controller, _) {
+        final isMasked = controller.isBalanceMasked(account.ledgerAccountRef);
+        final money = account.balance?.balance;
+        final displayBalance = money == null
+            ? '--'
+            : isMasked
+            ? formatMaskedLedgerBalance(money.currency)
+            : formatLedgerBalance(
+                amount: money.amount,
+                currency: money.currency,
+              );
+
+        return Row(
+          children: [
+            Expanded(
+              child: Row(
+                children: [
+                  Text(
+                    displayBalance,
+                    style: theme.textTheme.headlineSmall?.copyWith(
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                  const SizedBox(width: 12),
+                  GestureDetector(
+                    onTap: () =>
+                        controller.toggleBalanceMask(account.ledgerAccountRef),
+                    child: Icon(
+                      isMasked ? Icons.visibility_off : Icons.visibility,
+                      size: 24,
+                    ),
+                  ),
+                ],
+              ),
+            ),
+            LedgerBalanceRefreshButton(
+              ledgerAccountRef: account.ledgerAccountRef,
+            ),
+          ],
+        );
+      },
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/copyable_row.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/copyable_row.dart
@@ -0,0 +1,40 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+
+
+class LedgerEditCopyableRow extends StatelessWidget {
+  final String title;
+  final String value;
+
+  const LedgerEditCopyableRow({
+    super.key,
+    required this.title,
+    required this.value,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      children: [
+        Expanded(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(title, style: theme.textTheme.bodySmall),
+              const SizedBox(height: 2),
+              Text(value, style: theme.textTheme.bodyLarge),
+            ],
+          ),
+        ),
+        IconButton(
+          icon: const Icon(Icons.copy),
+          iconSize: 18,
+          onPressed: () => Clipboard.setData(ClipboardData(text: value)),
+        ),
+      ],
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/view.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger/view.dart
@@ -0,0 +1,83 @@
+import 'package:flutter/material.dart';
+
+import 'package:pshared/models/ledger/account.dart';
+
+import 'package:pweb/pages/payout_page/wallet/edit/buttons/buttons.dart';
+import 'package:pweb/pages/payout_page/wallet/edit/ledger/balance_row.dart';
+import 'package:pweb/pages/payout_page/wallet/edit/ledger/copyable_row.dart';
+import 'package:pweb/utils/dimensions.dart';
+
+import 'package:pweb/generated/i18n/app_localizations.dart';
+
+
+class LedgerEditView extends StatelessWidget {
+  final LedgerAccount account;
+  final VoidCallback onBack;
+
+  const LedgerEditView({
+    super.key,
+    required this.account,
+    required this.onBack,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final dimensions = AppDimensions();
+    final loc = AppLocalizations.of(context)!;
+    final theme = Theme.of(context);
+
+    return Align(
+      alignment: Alignment.topCenter,
+      child: ConstrainedBox(
+        constraints: BoxConstraints(maxWidth: dimensions.maxContentWidth),
+        child: Material(
+          elevation: dimensions.elevationSmall,
+          color: theme.colorScheme.onSecondary,
+          borderRadius: BorderRadius.circular(dimensions.borderRadiusMedium),
+          child: Padding(
+            padding: EdgeInsets.all(dimensions.paddingLarge),
+            child: SingleChildScrollView(
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  IconButton(
+                    icon: const Icon(Icons.arrow_back),
+                    onPressed: onBack,
+                  ),
+                  Text(
+                    loc.paymentTypeLedger,
+                    style: theme.textTheme.headlineMedium?.copyWith(
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                  const SizedBox(height: 8),
+                  if (account.currency.trim().isNotEmpty)
+                    Text(
+                      account.currency,
+                      style: theme.textTheme.bodyMedium?.copyWith(
+                        color: theme.colorScheme.onSurfaceVariant,
+                      ),
+                    ),
+                  const SizedBox(height: 24),
+                  LedgerEditBalanceRow(account: account),
+                  const SizedBox(height: 12),
+                  LedgerEditCopyableRow(
+                    title: loc.ledgerAccountRef,
+                    value: account.ledgerAccountRef,
+                  ),
+                  const SizedBox(height: 8),
+                  LedgerEditCopyableRow(
+                    title: 'Account code',
+                    value: account.accountCode,
+                  ),
+                  const SizedBox(height: 24),
+                  const ButtonsWalletWidget(),
+                ],
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger_page.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/edit/ledger_page.dart
@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+
+import 'package:collection/collection.dart';
+import 'package:provider/provider.dart';
+
+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/provider/ledger.dart';
+
+import 'package:pweb/pages/payout_page/wallet/edit/ledger/view.dart';
+
+import 'package:pweb/generated/i18n/app_localizations.dart';
+
+class LedgerEditPage extends StatelessWidget {
+  final VoidCallback onBack;
+
+  const LedgerEditPage({super.key, required this.onBack});
+
+  @override
+  Widget build(BuildContext context) {
+    final loc = AppLocalizations.of(context)!;
+    final source = context.watch<PaymentSourceController>().selectedSource;
+
+    if (source == null || source.ledgerAccount == null) {
+      return Center(child: Text(loc.noWalletSelected));
+    }
+
+    final accountRef = source.ledgerAccount!.ledgerAccountRef;
+
+    return Consumer<LedgerAccountsProvider>(
+      builder: (context, provider, _) {
+        final account = provider.accounts.firstWhereOrNull(
+          (item) => item.ledgerAccountRef == accountRef,
+        );
+        if (account == null) {
+          return Center(child: Text(loc.noWalletSelected));
+        }
+
+        return LedgerEditView(account: account, onBack: onBack);
+      },
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/ledger/card.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/ledger/card.dart
@@ -0,0 +1,46 @@
+import 'package:flutter/material.dart';
+
+import 'package:pshared/models/ledger/account.dart';
+
+import 'package:pweb/pages/payout_page/wallet/ledger/card_body.dart';
+
+
+class LedgerWalletCard extends StatelessWidget {
+  final LedgerAccount account;
+  final VoidCallback onTap;
+
+  const LedgerWalletCard({
+    super.key,
+    required this.account,
+    required this.onTap,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
+    return Card(
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+      elevation: theme.cardTheme.elevation ?? 4,
+      color: theme.colorScheme.onSecondary,
+      child: InkWell(
+        borderRadius: BorderRadius.circular(12),
+        onTap: onTap,
+        child: Container(
+          padding: const EdgeInsets.only(left: 50, top: 16, bottom: 16),
+          child: Row(
+            spacing: 3,
+            children: [
+              const CircleAvatar(
+                radius: 24,
+                child: Icon(Icons.account_balance, size: 28),
+              ),
+              const SizedBox(width: 16),
+              Expanded(child: LedgerCardBody(account: account)),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/ledger/card_body.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/ledger/card_body.dart
@@ -0,0 +1,90 @@
+import 'package:flutter/material.dart';
+
+import 'package:provider/provider.dart';
+
+import 'package:pshared/controllers/balance_mask/ledger_accounts.dart';
+import 'package:pshared/models/ledger/account.dart';
+
+import 'package:pweb/pages/payout_page/wallet/ledger/format.dart';
+import 'package:pweb/widgets/refresh_balance/ledger.dart';
+
+import 'package:pweb/generated/i18n/app_localizations.dart';
+
+
+class LedgerCardBody extends StatelessWidget {
+  final LedgerAccount account;
+
+  const LedgerCardBody({super.key, required this.account});
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final loc = AppLocalizations.of(context)!;
+
+    return Consumer<LedgerBalanceMaskController>(
+      builder: (context, controller, _) {
+        final isMasked = controller.isBalanceMasked(account.ledgerAccountRef);
+        final money = account.balance?.balance;
+        final displayBalance = money == null
+            ? '--'
+            : isMasked
+            ? formatMaskedLedgerBalance(money.currency)
+            : formatLedgerBalance(
+                amount: money.amount,
+                currency: money.currency,
+              );
+
+        return Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Row(
+                  children: [
+                    Text(
+                      displayBalance,
+                      style: theme.textTheme.headlineSmall?.copyWith(
+                        fontWeight: FontWeight.bold,
+                        color: theme.colorScheme.onSurface,
+                      ),
+                    ),
+                    const SizedBox(width: 12),
+                    GestureDetector(
+                      onTap: () => controller.toggleBalanceMask(
+                        account.ledgerAccountRef,
+                      ),
+                      child: Icon(
+                        isMasked ? Icons.visibility_off : Icons.visibility,
+                        size: 24,
+                        color: theme.colorScheme.onSurface,
+                      ),
+                    ),
+                  ],
+                ),
+                LedgerBalanceRefreshButton(
+                  ledgerAccountRef: account.ledgerAccountRef,
+                ),
+              ],
+            ),
+            Text(
+              loc.paymentTypeLedger,
+              style: theme.textTheme.bodyLarge!.copyWith(
+                fontWeight: FontWeight.w600,
+                color: theme.colorScheme.onSurface,
+              ),
+            ),
+            const SizedBox(height: 4),
+            Text(
+              account.accountCode,
+              style: theme.textTheme.bodyMedium?.copyWith(
+                color: theme.colorScheme.onSurfaceVariant,
+              ),
+            ),
+          ],
+        );
+      },
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/ledger/format.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/ledger/format.dart
@@ -0,0 +1,27 @@
+import 'package:pshared/utils/currency.dart';
+
+
+String formatLedgerBalance({required String amount, required String currency}) {
+  final parsed = double.tryParse(amount);
+  if (parsed == null) return '$amount $currency';
+
+  try {
+    final symbol = currencyCodeToSymbol(currencyStringToCode(currency));
+    if (symbol.trim().isEmpty) return '${amountToString(parsed)} $currency';
+    return '${amountToString(parsed)} $symbol';
+  } catch (_) {
+    return '${amountToString(parsed)} $currency';
+  }
+}
+
+String formatMaskedLedgerBalance(String currency) {
+  final normalized = currency.trim();
+  if (normalized.isEmpty) return '••••';
+  try {
+    final symbol = currencyCodeToSymbol(currencyStringToCode(normalized));
+    if (symbol.trim().isEmpty) return '•••• $normalized';
+    return '•••• $symbol';
+  } catch (_) {
+    return '•••• $normalized';
+  }
+}
--- a/frontend/pweb/lib/pages/payout_page/wallet/wigets.dart
+++ b/frontend/pweb/lib/pages/payout_page/wallet/wigets.dart
@@ -3,42 +3,58 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';

 import 'package:pshared/models/payment/wallet.dart';
+import 'package:pshared/provider/ledger.dart';
 import 'package:pshared/provider/payment/wallets.dart';

 import 'package:pweb/pages/payout_page/wallet/card.dart';
-
+import 'package:pweb/pages/payout_page/wallet/ledger/card.dart';

 class WalletWidgets extends StatelessWidget {
  final void Function(Wallet) onWalletTap;
+  final void Function(String ledgerAccountRef) onLedgerTap;

-  const WalletWidgets({super.key, required this.onWalletTap});
+  const WalletWidgets({
+    super.key,
+    required this.onWalletTap,
+    required this.onLedgerTap,
+  });

  @override
  Widget build(BuildContext context) {
    final provider = context.watch<WalletsProvider>();
+    final ledgerProvider = context.watch<LedgerAccountsProvider>();

    final wallets = provider.wallets;
+    final accounts = ledgerProvider.accounts;

    return GridView.builder(
      scrollDirection: Axis.vertical,
-      physics: AlwaysScrollableScrollPhysics(),
+      physics: const AlwaysScrollableScrollPhysics(),
      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
        mainAxisSpacing: 12,
        crossAxisSpacing: 12,
        childAspectRatio: 3,
      ),
-      itemCount: wallets.length,
+      itemCount: wallets.length + accounts.length,
      itemBuilder: (context, index) {
-        final wallet = wallets[index];
+        if (index < wallets.length) {
+          final wallet = wallets[index];
+          return Padding(
+            padding: const EdgeInsets.symmetric(vertical: 6.0),
+            child: WalletCard(wallet: wallet, onTap: () => onWalletTap(wallet)),
+          );
+        }
+
+        final account = accounts[index - wallets.length];
        return Padding(
          padding: const EdgeInsets.symmetric(vertical: 6.0),
-          child: WalletCard(
-            wallet: wallet,
-            onTap: () => onWalletTap(wallet),
+          child: LedgerWalletCard(
+            account: account,
+            onTap: () => onLedgerTap(account.ledgerAccountRef),
          ),
        );
      },
    );
  }
-}
+}
--- a/frontend/pweb/lib/pages/wallet_top_up/header.dart
+++ b/frontend/pweb/lib/pages/wallet_top_up/header.dart
@@ -2,15 +2,16 @@ import 'package:flutter/material.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

-
 class WalletTopUpHeader extends StatelessWidget {
  final VoidCallback onBack;
  final String? tokenSymbol;
+  final String? sourceLabel;

  const WalletTopUpHeader({
    super.key,
    required this.onBack,
    this.tokenSymbol,
+    this.sourceLabel,
  });

  @override
@@ -20,24 +21,18 @@ class WalletTopUpHeader extends StatelessWidget {
    final symbol = tokenSymbol?.trim();

    final subtitle = [
-      loc.paymentTypeCryptoWallet,
+      sourceLabel ?? loc.paymentTypeCryptoWallet,
      if (symbol != null && symbol.isNotEmpty) symbol,
    ].join(' · ');

    return Row(
      children: [
-        IconButton(
-          icon: const Icon(Icons.arrow_back),
-          onPressed: onBack,
-        ),
+        IconButton(icon: const Icon(Icons.arrow_back), onPressed: onBack),
        const SizedBox(width: 8),
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
-            Text(
-              loc.walletTopUpTitle,
-              style: theme.textTheme.titleLarge,
-            ),
+            Text(loc.walletTopUpTitle, style: theme.textTheme.titleLarge),
            const SizedBox(height: 4),
            Text(
              subtitle,
--- a/frontend/pweb/lib/pages/wallet_top_up/ledger_content.dart
+++ b/frontend/pweb/lib/pages/wallet_top_up/ledger_content.dart
@@ -0,0 +1,72 @@
+import 'package:flutter/material.dart';
+
+import 'package:pshared/models/ledger/account.dart';
+
+import 'package:pweb/pages/wallet_top_up/details.dart';
+import 'package:pweb/pages/wallet_top_up/header.dart';
+import 'package:pweb/pages/wallet_top_up/meta.dart';
+import 'package:pweb/utils/dimensions.dart';
+
+import 'package:pweb/generated/i18n/app_localizations.dart';
+
+
+class LedgerTopUpContent extends StatelessWidget {
+  final LedgerAccount account;
+  final VoidCallback onBack;
+
+  const LedgerTopUpContent({
+    super.key,
+    required this.account,
+    required this.onBack,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final dimensions = AppDimensions();
+    final theme = Theme.of(context);
+    final loc = AppLocalizations.of(context)!;
+
+    return Align(
+      alignment: Alignment.topCenter,
+      child: SingleChildScrollView(
+        child: ConstrainedBox(
+          constraints: const BoxConstraints(maxWidth: 960),
+          child: Padding(
+            padding: EdgeInsets.symmetric(vertical: dimensions.paddingLarge),
+            child: Material(
+              elevation: dimensions.elevationSmall,
+              color: theme.colorScheme.onSecondary,
+              borderRadius: BorderRadius.circular(
+                dimensions.borderRadiusMedium,
+              ),
+              child: Padding(
+                padding: EdgeInsets.all(dimensions.paddingXLarge),
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    WalletTopUpHeader(
+                      onBack: onBack,
+                      tokenSymbol: account.currency,
+                      sourceLabel: loc.paymentTypeLedger,
+                    ),
+                    SizedBox(height: dimensions.paddingLarge),
+                    WalletTopUpMeta(
+                      assetLabel: account.currency,
+                      walletId: account.accountCode,
+                      idLabel: loc.ledgerAccountRef,
+                    ),
+                    SizedBox(height: dimensions.paddingXLarge),
+                    WalletTopUpDetails(
+                      address: account.ledgerAccountRef,
+                      dimensions: dimensions,
+                    ),
+                  ],
+                ),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
--- a/frontend/pweb/lib/pages/wallet_top_up/meta.dart
+++ b/frontend/pweb/lib/pages/wallet_top_up/meta.dart
@@ -10,12 +10,14 @@ class WalletTopUpMeta extends StatelessWidget {
  final String assetLabel;
  final String walletId;
  final String? network;
+  final String? idLabel;

  const WalletTopUpMeta({
    super.key,
    required this.assetLabel,
    required this.walletId,
    this.network,
+    this.idLabel,
  });

  @override
@@ -27,10 +29,16 @@ class WalletTopUpMeta extends StatelessWidget {
      spacing: dimensions.paddingLarge,
      runSpacing: dimensions.paddingLarge,
      children: [
-        WalletTopUpInfoChip(label: loc.walletTopUpAssetLabel, value: assetLabel),
+        WalletTopUpInfoChip(
+          label: loc.walletTopUpAssetLabel,
+          value: assetLabel,
+        ),
        if (network != null && network!.isNotEmpty)
-          WalletTopUpInfoChip(label: loc.walletTopUpNetworkLabel, value: network!),
-        WalletTopUpInfoChip(label: loc.walletId, value: walletId),
+          WalletTopUpInfoChip(
+            label: loc.walletTopUpNetworkLabel,
+            value: network!,
+          ),
+        WalletTopUpInfoChip(label: idLabel ?? loc.walletId, value: walletId),
      ],
    );
  }
--- a/frontend/pweb/lib/pages/wallet_top_up/page.dart
+++ b/frontend/pweb/lib/pages/wallet_top_up/page.dart
@@ -1,10 +1,15 @@
 import 'package:flutter/material.dart';

+import 'package:collection/collection.dart';
 import 'package:provider/provider.dart';

 import 'package:pshared/controllers/balance_mask/wallets.dart';
+import 'package:pshared/controllers/payment/source.dart';
+import 'package:pshared/models/payment/source.dart';
+import 'package:pshared/provider/ledger.dart';

 import 'package:pweb/pages/wallet_top_up/content.dart';
+import 'package:pweb/pages/wallet_top_up/ledger_content.dart';

 import 'package:pweb/generated/i18n/app_localizations.dart';

@@ -17,27 +22,55 @@ class WalletTopUpPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context)!;
+    final source = context.watch<PaymentSourceController>().selectedSource;

-    return Consumer<WalletsController>(builder: (context, provider, child) {
-      if (provider.isLoading) {
-        return const Center(child: CircularProgressIndicator());
-      }
+    if (source == null) {
+      return Center(child: Text(loc.noWalletSelected));
+    }

-      if (provider.error != null) {
-        return Center(
-          child: Text(loc.notificationError(provider.error.toString())),
-        );
-      }
+    return switch (source.type) {
+      PaymentSourceType.wallet => Consumer<WalletsController>(
+        builder: (context, provider, child) {
+          if (provider.isLoading) {
+            return const Center(child: CircularProgressIndicator());
+          }

-      final wallet = provider.selectedWallet;
-      if (wallet == null) {
-        return Center(child: Text(loc.noWalletSelected));
-      }
+          if (provider.error != null) {
+            return Center(
+              child: Text(loc.notificationError(provider.error.toString())),
+            );
+          }

-      return WalletTopUpContent(
-        wallet: wallet,
-        onBack: onBack,
-      );
-    });
+          final wallet = provider.selectedWallet;
+          if (wallet == null) {
+            return Center(child: Text(loc.noWalletSelected));
+          }
+
+          return WalletTopUpContent(wallet: wallet, onBack: onBack);
+        },
+      ),
+      PaymentSourceType.ledger => Consumer<LedgerAccountsProvider>(
+        builder: (context, provider, child) {
+          if (provider.isLoading) {
+            return const Center(child: CircularProgressIndicator());
+          }
+
+          if (provider.error != null) {
+            return Center(
+              child: Text(loc.notificationError(provider.error.toString())),
+            );
+          }
+
+          final account = provider.accounts.firstWhereOrNull(
+            (item) => item.ledgerAccountRef == source.id,
+          );
+          if (account == null) {
+            return Center(child: Text(loc.noWalletSelected));
+          }
+
+          return LedgerTopUpContent(account: account, onBack: onBack);
+        },
+      ),
+    };
  }
 }