add providers per page

show only 10 packages
new page for all packages

frontend/lib/components/api/APIBuilder.dart

@@ -2,7 +2,6 @@ import 'dart:async';
 
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
-import 'package:visibility_detector/visibility_detector.dart';
 
 import '../../providers/BaseProvider.dart';
 
@@ -26,7 +25,6 @@ class APIBuilder<T extends BaseProvider, K, DTO> extends StatefulWidget {
 class _APIBuilderState<T extends BaseProvider, K, DTO>
     extends State<APIBuilder<T, K, DTO>> {
   Timer? timer;
-  bool visible = true;
 
   @override
   void initState() {
@@ -35,10 +33,8 @@ class _APIBuilderState<T extends BaseProvider, K, DTO>
 
     if (widget.interval != null) {
       timer = Timer.periodic(widget.interval!, (Timer t) {
-        if (visible) {
-          Provider.of<T>(context, listen: false)
-              .refresh(context, dto: widget.dto);
-        }
+        Provider.of<T>(context, listen: false)
+            .refresh(context, dto: widget.dto);
       });
     }
   }
@@ -53,30 +49,15 @@ class _APIBuilderState<T extends BaseProvider, K, DTO>
   Widget build(BuildContext context) {
     final Future<K> fut = Provider.of<T>(context).data as Future<K>;
 
-    return VisibilityDetector(
-      key: widget.key ?? const Key("APIBuilder"),
-      onVisibilityChanged: (visibilityInfo) {
-        var visiblePercentage = visibilityInfo.visibleFraction * 100;
-
-        if (mounted) {
-          setState(() {
-            visible = visiblePercentage != 0;
-          });
+    return FutureBuilder<K>(
+      future: fut,
+      builder: (context, snapshot) {
+        if (snapshot.hasData) {
+          return widget.onData(snapshot.data!);
+        } else {
+          return widget.onLoad();
         }
-
-        debugPrint(
-            'Widget ${visibilityInfo.key} is ${visiblePercentage}% visible');
       },
-      child: FutureBuilder<K>(
-        future: fut,
-        builder: (context, snapshot) {
-          if (snapshot.hasData) {
-            return widget.onData(snapshot.data!);
-          } else {
-            return widget.onLoad();
-          }
-        },
-      ),
     );
   }
 }

frontend/lib/components/dashboard/recent_builds.dart

@@ -1,16 +1,9 @@
-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/components/api/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';
 
 class RecentBuilds extends StatefulWidget {

frontend/lib/components/dashboard/your_packages.dart

@@ -1,18 +1,10 @@
-import 'dart:async';
-
-import 'package:aurcache/api/packages.dart';
 import 'package:aurcache/components/api/APIBuilder.dart';
+import 'package:aurcache/components/packages_table.dart';
 import 'package:aurcache/providers/packages_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';
 import '../../models/package.dart';
-import '../../providers/builds_provider.dart';
-import '../../providers/stats_provider.dart';
-import '../confirm_popup.dart';
 
 class YourPackages extends StatefulWidget {
   const YourPackages({
@@ -39,113 +31,33 @@ class _YourPackagesState extends State<YourPackages> {
             "Your Packages",
             style: Theme.of(context).textTheme.subtitle1,
           ),
-          SingleChildScrollView(
-            //scrollDirection: Axis.horizontal,
-            child: SizedBox(
+          Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
+            SizedBox(
               width: double.infinity,
-              child: APIBuilder<PackagesProvider, List<Package>, Object>(
-                key: Key("Packages on dashboard"),
+              child: APIBuilder<PackagesProvider, List<Package>, PackagesDTO>(
+                key: const Key("Packages on dashboard"),
                 interval: const Duration(seconds: 10),
+                dto: PackagesDTO(limit: 10),
                 onData: (data) {
-                  return DataTable(
-                      horizontalMargin: 0,
-                      columnSpacing: defaultPadding,
-                      columns: const [
-                        DataColumn(
-                          label: Text("Package ID"),
-                        ),
-                        DataColumn(
-                          label: Text("Package Name"),
-                        ),
-                        DataColumn(
-                          label: Text("Version"),
-                        ),
-                        DataColumn(
-                          label: Text("Up-To-Date"),
-                        ),
-                        DataColumn(
-                          label: Text("Status"),
-                        ),
-                        DataColumn(
-                          label: Text("Action"),
-                        ),
-                      ],
-                      rows: data
-                          .map((e) => buildDataRow(e))
-                          .toList(growable: false));
+                  return PackagesTable(data: data);
                 },
                 onLoad: () => const Text("No data"),
               ),
             ),
-          ),
+            ElevatedButton(
+              onPressed: () {
+                context.push("/packages");
+              },
+              child: Text(
+                "List all Packages",
+                style: TextStyle(color: Colors.white.withOpacity(0.8)),
+              ),
+            )
+          ]),
         ],
       ),
     );
   }
-
-  DataRow buildDataRow(Package package) {
-    return DataRow(
-      cells: [
-        DataCell(Text(package.id.toString())),
-        DataCell(Text(package.name)),
-        DataCell(Text(package.latest_version.toString())),
-        DataCell(IconButton(
-          icon: Icon(
-            package.outofdate ? Icons.update : Icons.verified,
-            color: package.outofdate ? Color(0xFF6B43A4) : Color(0xFF0A6900),
-          ),
-          onPressed: package.outofdate
-              ? () {
-                  // todo open build info with logs
-                }
-              : null,
-        )),
-        DataCell(IconButton(
-          icon: Icon(
-            switchSuccessIcon(package.status),
-            color: switchSuccessColor(package.status),
-          ),
-          onPressed: () {
-            //context.push("/build/${package.latest_version_id}");
-          },
-        )),
-        DataCell(
-          Row(
-            children: [
-              TextButton(
-                child: const Text('View', style: TextStyle(color: greenColor)),
-                onPressed: () {
-                  context.push("/package/${package.id}");
-                },
-              ),
-              const SizedBox(
-                width: 6,
-              ),
-              TextButton(
-                child: const Text("Delete",
-                    style: TextStyle(color: Colors.redAccent)),
-                onPressed: () async {
-                  final confirmResult =
-                      await showDeleteConfirmationDialog(context);
-                  if (!confirmResult) return;
-
-                  final succ = await API.deletePackage(package.id);
-                  if (succ) {
-                    Provider.of<PackagesProvider>(context, listen: false)
-                        .refresh(context);
-                    Provider.of<BuildsProvider>(context, listen: false)
-                        .refresh(context);
-                    Provider.of<StatsProvider>(context, listen: false)
-                        .refresh(context);
-                  }
-                },
-              ),
-            ],
-          ),
-        ),
-      ],
-    );
-  }
 }
 
 IconData switchSuccessIcon(int status) {

frontend/lib/components/packages_table.dart

@@ -0,0 +1,111 @@
+import 'package:aurcache/api/packages.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';
+import '../models/package.dart';
+import '../providers/builds_provider.dart';
+import '../providers/packages_provider.dart';
+import '../providers/stats_provider.dart';
+import 'confirm_popup.dart';
+import 'dashboard/your_packages.dart';
+
+class PackagesTable extends StatelessWidget {
+  const PackagesTable({super.key, required this.data});
+  final List<Package> data;
+
+  @override
+  Widget build(BuildContext context) {
+    return DataTable(
+        horizontalMargin: 0,
+        columnSpacing: defaultPadding,
+        columns: const [
+          DataColumn(
+            label: Text("Package ID"),
+          ),
+          DataColumn(
+            label: Text("Package Name"),
+          ),
+          DataColumn(
+            label: Text("Version"),
+          ),
+          DataColumn(
+            label: Text("Up-To-Date"),
+          ),
+          DataColumn(
+            label: Text("Status"),
+          ),
+          DataColumn(
+            label: Text("Action"),
+          ),
+        ],
+        rows:
+            data.map((e) => buildDataRow(e, context)).toList(growable: false));
+  }
+
+  DataRow buildDataRow(Package package, BuildContext context) {
+    return DataRow(
+      cells: [
+        DataCell(Text(package.id.toString())),
+        DataCell(Text(package.name)),
+        DataCell(Text(package.latest_version.toString())),
+        DataCell(IconButton(
+          icon: Icon(
+            package.outofdate ? Icons.update : Icons.verified,
+            color: package.outofdate ? Color(0xFF6B43A4) : Color(0xFF0A6900),
+          ),
+          onPressed: package.outofdate
+              ? () {
+                  // todo open build info with logs
+                }
+              : null,
+        )),
+        DataCell(IconButton(
+          icon: Icon(
+            switchSuccessIcon(package.status),
+            color: switchSuccessColor(package.status),
+          ),
+          onPressed: () {
+            //context.push("/build/${package.latest_version_id}");
+          },
+        )),
+        DataCell(
+          Row(
+            children: [
+              TextButton(
+                child: const Text('View', style: TextStyle(color: greenColor)),
+                onPressed: () {
+                  context.push("/package/${package.id}");
+                },
+              ),
+              const SizedBox(
+                width: 6,
+              ),
+              TextButton(
+                child: const Text("Delete",
+                    style: TextStyle(color: Colors.redAccent)),
+                onPressed: () async {
+                  final confirmResult =
+                      await showDeleteConfirmationDialog(context);
+                  if (!confirmResult) return;
+
+                  final succ = await API.deletePackage(package.id);
+                  if (succ) {
+                    Provider.of<PackagesProvider>(context, listen: false)
+                        .refresh(context);
+                    Provider.of<BuildsProvider>(context, listen: false)
+                        .refresh(context);
+                    Provider.of<StatsProvider>(context, listen: false)
+                        .refresh(context);
+                  }
+                },
+              ),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}

frontend/lib/components/routing/router.dart

@@ -3,6 +3,7 @@ import 'package:aurcache/screens/builds_screen.dart';
 import 'package:aurcache/screens/dashboard_screen.dart';
 import 'package:aurcache/components/routing/menu_shell.dart';
 import 'package:aurcache/screens/package_screen.dart';
+import 'package:aurcache/screens/packages_screen.dart';
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 
@@ -35,6 +36,10 @@ final appRouter = GoRouter(
           path: '/builds',
           builder: (context, state) => const BuildsScreen(),
         ),
+        GoRoute(
+          path: '/packages',
+          builder: (context, state) => const PackagesScreen(),
+        ),
         GoRoute(
           path: '/package/:id',
           builder: (context, state) {