From f65121a26fc76026b561ed446f21f4bf3f90940d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jos=C3=A9=20Salazar?= <73718835+joshrs23@users.noreply.github.com> Date: Mon, 26 Jan 2026 16:48:32 -0500 Subject: [PATCH] bringing account dataconnect --- .../widgets/payment_method_card.dart | 224 +++++++++++------- 1 file changed, 139 insertions(+), 85 deletions(-) diff --git a/apps/mobile/packages/features/client/billing/lib/src/presentation/widgets/payment_method_card.dart b/apps/mobile/packages/features/client/billing/lib/src/presentation/widgets/payment_method_card.dart index 531dc4cf..7836ed08 100644 --- a/apps/mobile/packages/features/client/billing/lib/src/presentation/widgets/payment_method_card.dart +++ b/apps/mobile/packages/features/client/billing/lib/src/presentation/widgets/payment_method_card.dart @@ -1,111 +1,165 @@ import 'package:core_localization/core_localization.dart'; import 'package:design_system/design_system.dart'; import 'package:flutter/material.dart'; +import 'package:firebase_data_connect/firebase_data_connect.dart' as fdc; +import 'package:krow_data_connect/krow_data_connect.dart' as dc; /// Card showing the current payment method. -class PaymentMethodCard extends StatelessWidget { +class PaymentMethodCard extends StatefulWidget { /// Creates a [PaymentMethodCard]. const PaymentMethodCard({super.key}); + @override + State createState() => _PaymentMethodCardState(); +} + +class _PaymentMethodCardState extends State { + late final Future _accountsFuture = + _loadAccounts(); + + Future _loadAccounts() async { + final String? businessId = + dc.ClientSessionStore.instance.session?.business?.id; + if (businessId == null || businessId.isEmpty) { + return null; + } + + final fdc.QueryResult result = + await dc.ExampleConnector.instance + .getAccountsByOwnerId(ownerId: businessId) + .execute(); + return result.data; + } + @override Widget build(BuildContext context) { - return Container( - padding: const EdgeInsets.all(UiConstants.space4), - decoration: BoxDecoration( - color: UiColors.white, - borderRadius: UiConstants.radiusLg, - border: Border.all(color: UiColors.border), - boxShadow: [ - BoxShadow( - color: UiColors.black.withValues(alpha: 0.04), - blurRadius: 8, - offset: const Offset(0, 2), - ), - ], - ), - child: Column( - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Text( - t.client_billing.payment_method, - style: UiTypography.title2b.textPrimary, - ), - GestureDetector( - onTap: () {}, - child: Row( - children: [ - const Icon(UiIcons.add, size: 14, color: UiColors.primary), - const SizedBox(width: 4), - Text( - t.client_billing.add_payment, - style: UiTypography.footnote2b.textPrimary, - ), - ], - ), + return FutureBuilder( + future: _accountsFuture, + builder: (BuildContext context, + AsyncSnapshot snapshot) { + final List accounts = + snapshot.data?.accounts ?? + []; + final dc.GetAccountsByOwnerIdAccounts? account = + accounts.isNotEmpty ? accounts.first : null; + final String bankLabel = + account?.bank.isNotEmpty == true ? account!.bank : '----'; + final String last4 = + account?.last4.isNotEmpty == true ? account!.last4 : '----'; + final bool isPrimary = account?.isPrimary ?? false; + + return Container( + padding: const EdgeInsets.all(UiConstants.space4), + decoration: BoxDecoration( + color: UiColors.white, + borderRadius: UiConstants.radiusLg, + border: Border.all(color: UiColors.border), + boxShadow: [ + BoxShadow( + color: UiColors.black.withValues(alpha: 0.04), + blurRadius: 8, + offset: const Offset(0, 2), ), ], ), - const SizedBox(height: UiConstants.space3), - Container( - padding: const EdgeInsets.all(UiConstants.space3), - decoration: BoxDecoration( - color: UiColors.bgSecondary, - borderRadius: UiConstants.radiusMd, - ), - child: Row( - children: [ - Container( - width: 40, - height: 28, - decoration: BoxDecoration( - color: UiColors.primary, - borderRadius: BorderRadius.circular(4), + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + t.client_billing.payment_method, + style: UiTypography.title2b.textPrimary, ), - child: const Center( - child: Text( - 'VISA', - style: TextStyle( - color: UiColors.white, - fontSize: 10, - fontWeight: FontWeight.bold, - ), + GestureDetector( + onTap: () {}, + child: Row( + children: [ + const Icon( + UiIcons.add, + size: 14, + color: UiColors.primary, + ), + const SizedBox(width: 4), + Text( + t.client_billing.add_payment, + style: UiTypography.footnote2b.textPrimary, + ), + ], ), ), - ), - const SizedBox(width: UiConstants.space3), - Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, + ], + ), + if (account != null) ...[ + const SizedBox(height: UiConstants.space3), + Container( + padding: const EdgeInsets.all(UiConstants.space3), + decoration: BoxDecoration( + color: UiColors.bgSecondary, + borderRadius: UiConstants.radiusMd, + ), + child: Row( children: [ - Text('•••• 4242', style: UiTypography.body2b.textPrimary), - Text( - t.client_billing.expires(date: '12/25'), - style: UiTypography.footnote2r.textSecondary, + Container( + width: 40, + height: 28, + decoration: BoxDecoration( + color: UiColors.primary, + borderRadius: BorderRadius.circular(4), + ), + child: Center( + child: Text( + bankLabel, + style: const TextStyle( + color: UiColors.white, + fontSize: 10, + fontWeight: FontWeight.bold, + ), + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + ), ), + const SizedBox(width: UiConstants.space3), + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + '•••• $last4', + style: UiTypography.body2b.textPrimary, + ), + Text( + t.client_billing.expires(date: '12/25'), + style: UiTypography.footnote2r.textSecondary, + ), + ], + ), + ), + if (isPrimary) + Container( + padding: const EdgeInsets.symmetric( + horizontal: 6, + vertical: 2, + ), + decoration: BoxDecoration( + color: UiColors.accent, + borderRadius: BorderRadius.circular(4), + ), + child: Text( + t.client_billing.default_badge, + style: UiTypography.titleUppercase4b.textPrimary, + ), + ), ], ), ), - Container( - padding: const EdgeInsets.symmetric( - horizontal: 6, - vertical: 2, - ), - decoration: BoxDecoration( - color: UiColors.accent, - borderRadius: BorderRadius.circular(4), - ), - child: Text( - t.client_billing.default_badge, - style: UiTypography.titleUppercase4b.textPrimary, - ), - ), ], - ), + ], ), - ], - ), + ); + }, ); } }