bringing account dataconnect

apps/mobile/packages/features/client/billing/lib/src/presentation/widgets/payment_method_card.dart

@@ -1,14 +1,54 @@
 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<PaymentMethodCard> createState() => _PaymentMethodCardState();
+}
+
+class _PaymentMethodCardState extends State<PaymentMethodCard> {
+  late final Future<dc.GetAccountsByOwnerIdData?> _accountsFuture =
+      _loadAccounts();
+
+  Future<dc.GetAccountsByOwnerIdData?> _loadAccounts() async {
+    final String? businessId =
+        dc.ClientSessionStore.instance.session?.business?.id;
+    if (businessId == null || businessId.isEmpty) {
+      return null;
+    }
+
+    final fdc.QueryResult<dc.GetAccountsByOwnerIdData,
+            dc.GetAccountsByOwnerIdVariables> result =
+        await dc.ExampleConnector.instance
+            .getAccountsByOwnerId(ownerId: businessId)
+            .execute();
+    return result.data;
+  }
+
   @override
   Widget build(BuildContext context) {
+    return FutureBuilder<dc.GetAccountsByOwnerIdData?>(
+      future: _accountsFuture,
+      builder: (BuildContext context,
+          AsyncSnapshot<dc.GetAccountsByOwnerIdData?> snapshot) {
+        final List<dc.GetAccountsByOwnerIdAccounts> accounts =
+            snapshot.data?.accounts ??
+                <dc.GetAccountsByOwnerIdAccounts>[];
+        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(
@@ -36,7 +76,11 @@ class PaymentMethodCard extends StatelessWidget {
                     onTap: () {},
                     child: Row(
                       children: <Widget>[
-                    const Icon(UiIcons.add, size: 14, color: UiColors.primary),
+                        const Icon(
+                          UiIcons.add,
+                          size: 14,
+                          color: UiColors.primary,
+                        ),
                         const SizedBox(width: 4),
                         Text(
                           t.client_billing.add_payment,
@@ -47,6 +91,7 @@ class PaymentMethodCard extends StatelessWidget {
                   ),
                 ],
               ),
+              if (account != null) ...<Widget>[
                 const SizedBox(height: UiConstants.space3),
                 Container(
                   padding: const EdgeInsets.all(UiConstants.space3),
@@ -63,14 +108,16 @@ class PaymentMethodCard extends StatelessWidget {
                           color: UiColors.primary,
                           borderRadius: BorderRadius.circular(4),
                         ),
-                  child: const Center(
+                        child: Center(
                           child: Text(
-                      'VISA',
+                            bankLabel,
-                      style: TextStyle(
+                            style: const TextStyle(
                               color: UiColors.white,
                               fontSize: 10,
                               fontWeight: FontWeight.bold,
                             ),
+                            maxLines: 1,
+                            overflow: TextOverflow.ellipsis,
                           ),
                         ),
                       ),
@@ -79,7 +126,10 @@ class PaymentMethodCard extends StatelessWidget {
                         child: Column(
                           crossAxisAlignment: CrossAxisAlignment.start,
                           children: <Widget>[
-                      Text('•••• 4242', style: UiTypography.body2b.textPrimary),
+                            Text(
+                              '•••• $last4',
+                              style: UiTypography.body2b.textPrimary,
+                            ),
                             Text(
                               t.client_billing.expires(date: '12/25'),
                               style: UiTypography.footnote2r.textSecondary,
@@ -87,6 +137,7 @@ class PaymentMethodCard extends StatelessWidget {
                           ],
                         ),
                       ),
+                      if (isPrimary)
                         Container(
                           padding: const EdgeInsets.symmetric(
                             horizontal: 6,
@@ -105,7 +156,10 @@ class PaymentMethodCard extends StatelessWidget {
                   ),
                 ),
               ],
+            ],
           ),
         );
+      },
+    );
   }
 }