add apibuilder widget to make api callsmore straightforward and data updateable from everywhere through providers

frontend/lib/components/dashboard/recent_builds.dart

@@ -1,10 +1,14 @@
 import 'dart:async';
 
 import 'package:aurcache/api/builds.dart';
+import 'package:aurcache/components/builds_table.dart';
 import 'package:aurcache/models/build.dart';
 import 'package:aurcache/components/dashboard/your_packages.dart';
+import 'package:aurcache/providers/APIBuilder.dart';
+import 'package:aurcache/providers/builds_provider.dart';
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
+import 'package:provider/provider.dart';
 
 import '../../api/API.dart';
 import '../../constants/color_constants.dart';
@@ -19,27 +23,6 @@ class RecentBuilds extends StatefulWidget {
 }
 
 class _RecentBuildsState extends State<RecentBuilds> {
-  late Future<List<Build>> dataFuture;
-  Timer? timer;
-
-  @override
-  void initState() {
-    super.initState();
-    dataFuture = API.listAllBuilds();
-
-    timer = Timer.periodic(
-        const Duration(seconds: 10),
-        (Timer t) => setState(() {
-              dataFuture = API.listAllBuilds();
-            }));
-  }
-
-  @override
-  void dispose() {
-    super.dispose();
-    timer?.cancel();
-  }
-
   @override
   Widget build(BuildContext context) {
     return Container(
@@ -57,57 +40,26 @@ class _RecentBuildsState extends State<RecentBuilds> {
           ),
           SizedBox(
             width: double.infinity,
-            child: FutureBuilder(
-                future: dataFuture,
-                builder: (context, snapshot) {
-                  if (snapshot.hasData) {
-                    return DataTable(
-                      horizontalMargin: 0,
-                      columnSpacing: defaultPadding,
-                      columns: const [
-                        DataColumn(
-                          label: Text("Build ID"),
-                        ),
-                        DataColumn(
-                          label: Text("Package Name"),
-                        ),
-                        DataColumn(
-                          label: Text("Version"),
-                        ),
-                        DataColumn(
-                          label: Text("Status"),
-                        ),
-                      ],
-                      rows: snapshot.data!
-                          .map((e) => recentUserDataRow(e))
-                          .toList(),
-                    );
-                  } else {
-                    return const Text("no data");
-                  }
-                }),
+            child: APIBuilder<BuildsProvider, List<Build>, BuildsDTO>(
+              dto: BuildsDTO(limit: 10),
+              interval: const Duration(seconds: 10),
+              onLoad: () => const Text("no data"),
+              onData: (t) {
+                return BuildsTable(data: t);
+              },
+            ),
           ),
+          ElevatedButton(
+            onPressed: () {
+              context.push("/builds");
+            },
+            child: Text(
+              "List all Builds",
+              style: TextStyle(color: Colors.white.withOpacity(0.8)),
+            ),
+          )
         ],
       ),
     );
   }
-
-  DataRow recentUserDataRow(Build build) {
-    return DataRow(
-      cells: [
-        DataCell(Text(build.id.toString())),
-        DataCell(Text(build.pkg_name)),
-        DataCell(Text(build.version)),
-        DataCell(IconButton(
-          icon: Icon(
-            switchSuccessIcon(build.status),
-            color: switchSuccessColor(build.status),
-          ),
-          onPressed: () {
-            context.push("/build/${build.id}");
-          },
-        )),
-      ],
-    );
-  }
 }