Update navigation and clean up widgets in vyuh_feature_developer package

This commit refactors the routing system in the vyuh_feature_developer package for simplicity and improves the readability of the code. It also optimizes the file organization by renaming certain components for consistency and extracting repeated patterns as reusable parts. Changes include the simplification of the widgets using built-in Flutter widget equivalents and an improved display of the plugin types with icons. It also restructures how plugin details are defined and displayed. The modifications ultimately enhance code maintainability.

packages/system/vyuh_feature_developer/lib/analytics_plugin_details.dart → packages/system/vyuh_feature_developer/lib/analytics_plugin_detail.dart

@@ -1,11 +1,12 @@
 import 'package:flutter/material.dart';
 import 'package:vyuh_core/vyuh_core.dart';
+import 'package:vyuh_feature_developer/components/standard_plugin_view.dart';
 import 'package:vyuh_feature_developer/components/sticky_section.dart';
 
-class AnalyticsPluginDetailsView extends StatelessWidget {
+class AnalyticsPluginDetail extends StatelessWidget {
   final AnalyticsPlugin plugin;
 
-  const AnalyticsPluginDetailsView({super.key, required this.plugin});
+  const AnalyticsPluginDetail({super.key, required this.plugin});
 
   @override
   Widget build(BuildContext context) {
@@ -18,6 +19,11 @@ class AnalyticsPluginDetailsView extends StatelessWidget {
               pinned: true,
               primary: true,
             ),
+            SliverToBoxAdapter(
+              child: Padding(
+                  padding: const EdgeInsets.all(8.0),
+                  child: StandardPluginItem(plugin: plugin)),
+            ),
             StickySection(
               title: 'Providers [${plugin.providers.length}]',
               sliver: SliverPadding(

packages/system/vyuh_feature_developer/lib/components/routes_detail.dart → packages/system/vyuh_feature_developer/lib/components/route_list.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart' as g;
 import 'package:go_router/go_router.dart';
 import 'package:vyuh_core/vyuh_core.dart';
+import 'package:vyuh_feature_developer/components/items.dart';
 
 class RoutesList extends StatefulWidget {
   final FeatureDescriptor feature;
@@ -62,12 +63,9 @@ class _RoutesListState extends State<RoutesList> {
       builder: (_, snapshot) {
         if (snapshot.connectionState == ConnectionState.done) {
           final paths = snapshot.data!;
-          return SliverPadding(
-            padding: const EdgeInsets.all(8),
-            sliver: _PathList(paths: paths),
-          );
+          return _PathList(paths: paths);
         } else {
-          return const SliverToBoxAdapter(child: SizedBox.shrink());
+          return const SliverToBoxAdapter(child: EmptyItemTile());
         }
       },
     );
@@ -83,30 +81,36 @@ class _PathList extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return SliverList.builder(
-      itemBuilder: (_, index) {
-        final path = paths[index];
-
-        return Row(
-          mainAxisAlignment: MainAxisAlignment.start,
-          children: [
-            SizedBox(width: path.$2 * 10),
-            if (path.$2 > 0)
-              Transform.flip(
-                  flipY: true, child: const Icon(Icons.turn_right_rounded)),
-            Expanded(
-              child: Text(
-                path.$1,
-                style: Theme.of(context)
-                    .textTheme
-                    .bodyMedium
-                    ?.apply(fontFamily: 'Courier'),
-              ),
+    return paths.isNotEmpty
+        ? SliverPadding(
+            padding: const EdgeInsets.all(8.0),
+            sliver: SliverList.builder(
+              itemBuilder: (_, index) {
+                final path = paths[index];
+
+                return Row(
+                  mainAxisAlignment: MainAxisAlignment.start,
+                  children: [
+                    SizedBox(width: path.$2 * 10),
+                    if (path.$2 > 0)
+                      Transform.flip(
+                          flipY: true,
+                          child: const Icon(Icons.turn_right_rounded)),
+                    Expanded(
+                      child: Text(
+                        path.$1,
+                        style: Theme.of(context)
+                            .textTheme
+                            .bodyMedium
+                            ?.apply(fontFamily: 'Courier'),
+                      ),
+                    ),
+                  ],
+                );
+              },
+              itemCount: paths.length,
             ),
-          ],
-        );
-      },
-      itemCount: paths.length,
-    );
+          )
+        : const SliverToBoxAdapter(child: EmptyItemTile());
   }
 }

packages/system/vyuh_feature_developer/lib/components/standard_plugin_view.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:vyuh_core/vyuh_core.dart';
 
-class StandardPluginView extends StatelessWidget {
+class StandardPluginItem extends StatelessWidget {
   final Plugin plugin;
 
-  const StandardPluginView({super.key, required this.plugin});
+  const StandardPluginItem({super.key, required this.plugin});
 
   @override
   Widget build(BuildContext context) {
@@ -22,7 +22,10 @@ class StandardPluginView extends StatelessWidget {
             style:
                 theme.textTheme.labelMedium?.apply(color: theme.disabledColor)),
         const SizedBox(height: 4),
-        Text('${plugin.runtimeType}'),
+        Text(
+          '${plugin.runtimeType}',
+          style: theme.textTheme.labelLarge,
+        ),
       ],
     );
   }

packages/system/vyuh_feature_developer/lib/components/sticky_section.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_sticky_header/flutter_sticky_header.dart';
+import 'package:vyuh_feature_developer/components/items.dart';
 
 class StickySection extends StatelessWidget {
   final String title;
@@ -22,7 +23,7 @@ class StickySection extends StatelessWidget {
                 ?.apply(color: theme.colorScheme.onInverseSurface),
             textAlign: TextAlign.center),
       ),
-      sliver: sliver ?? const SliverToBoxAdapter(child: Text('None defined.')),
+      sliver: sliver ?? const SliverToBoxAdapter(child: EmptyItemTile()),
     );
   }
 }

packages/system/vyuh_feature_developer/lib/content_extension_detail.dart

@@ -4,10 +4,10 @@ import 'package:vyuh_extension_content/vyuh_extension_content.dart';
 import 'package:vyuh_feature_developer/components/items.dart';
 import 'package:vyuh_feature_developer/components/sticky_section.dart';
 
-class ContentExtensionDetailsView extends StatelessWidget {
+class ContentExtensionDetail extends StatelessWidget {
   final ContentExtensionDescriptor extension;
 
-  const ContentExtensionDetailsView({super.key, required this.extension});
+  const ContentExtensionDetail({super.key, required this.extension});
 
   @override
   Widget build(BuildContext context) {

packages/system/vyuh_feature_developer/lib/content_plugin_details.dart → packages/system/vyuh_feature_developer/lib/content_plugin_detail.dart

@@ -77,17 +77,29 @@ class _ContentPluginHeader extends StatelessWidget {
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          StandardPluginView(plugin: plugin),
+          StandardPluginItem(plugin: plugin),
           const SizedBox(height: 8),
-          Text(
-            plugin.provider.title,
-            style: theme.textTheme.titleMedium,
-          ),
-          const SizedBox(width: 8),
-          Text(
-            '(${plugin.provider.name})',
-            style:
-                theme.textTheme.labelMedium?.apply(color: theme.disabledColor),
+          Row(
+            children: [
+              const Icon(Icons.check_circle_rounded),
+              const SizedBox(width: 8),
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Text(
+                      plugin.provider.title,
+                      style: theme.textTheme.labelLarge,
+                    ),
+                    Text(
+                      '(${plugin.provider.name})',
+                      style: theme.textTheme.labelMedium
+                          ?.apply(color: theme.disabledColor),
+                    ),
+                  ],
+                ),
+              ),
+            ],
           ),
         ],
       ),

packages/system/vyuh_feature_developer/lib/feature_detail.dart

@@ -4,7 +4,7 @@ import 'package:vyuh_core/vyuh_core.dart';
 import 'package:vyuh_extension_content/vyuh_extension_content.dart';
 import 'package:vyuh_feature_developer/components/feature_hero_card.dart';
 import 'package:vyuh_feature_developer/components/items.dart';
-import 'package:vyuh_feature_developer/components/routes_detail.dart';
+import 'package:vyuh_feature_developer/components/route_list.dart';
 import 'package:vyuh_feature_developer/components/sticky_section.dart';
 
 class FeatureItem extends StatelessWidget {
@@ -20,7 +20,7 @@ class FeatureItem extends StatelessWidget {
     final theme = Theme.of(context);
 
     return GestureDetector(
-      onTap: () => context.push('/developer/detail', extra: feature),
+      onTap: () => context.push('/developer/features/${feature.name}'),
       child: ListTile(
         titleAlignment: ListTileTitleAlignment.center,
         contentPadding:
@@ -109,7 +109,7 @@ class FeatureDetail extends StatelessWidget {
   }
 }
 
-extension ExtensionDescriptorWidgetBuilder on ExtensionDescriptor {
+extension WidgetBuilder on ExtensionDescriptor {
   Widget build(BuildContext context) {
     switch (this) {
       case ContentExtensionDescriptor():

packages/system/vyuh_feature_developer/lib/plugin_detail.dart

@@ -1,56 +1,63 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
+import 'package:vyuh_core/plugin_types/plugin.dart';
 import 'package:vyuh_core/vyuh_core.dart';
 import 'package:vyuh_feature_developer/components/standard_plugin_view.dart';
 
 extension WidgetBuilder on Plugin {
   Widget build(BuildContext context) {
     switch (pluginType) {
-      case PluginType.analytics:
-        final analytics = this as AnalyticsPlugin;
-        return _AnalyticsPluginView(analytics: analytics);
-      case PluginType.content:
-        final content = this as ContentPlugin;
-        return _ContentPluginView(content: content);
+      case PluginType.analytics || PluginType.content:
+        return _PluginWithDetailsItem(plugin: this);
       default:
         return ListTile(
-          title: StandardPluginView(plugin: this),
+          leading: Icon(pluginType.icon),
+          title: StandardPluginItem(plugin: this),
         );
     }
   }
 }
 
-class _ContentPluginView extends StatelessWidget {
-  final ContentPlugin content;
-
-  const _ContentPluginView({required this.content});
-
-  @override
-  Widget build(BuildContext context) {
-    return ListTile(
-      onTap: () {
-        context.push('/developer/plugins/content');
-      },
-      title: StandardPluginView(plugin: content),
-      trailing: const Icon(Icons.chevron_right),
-    );
+extension on PluginType {
+  IconData get icon {
+    switch (this) {
+      case PluginType.analytics:
+        return Icons.show_chart;
+      case PluginType.content:
+        return Icons.category;
+      case PluginType.logger:
+        return Icons.line_style;
+      case PluginType.di:
+        return Icons.insert_link;
+      case PluginType.network:
+        return Icons.network_check;
+      case PluginType.storage:
+        return Icons.data_object;
+      case PluginType.secureStorage:
+        return Icons.dataset;
+      case PluginType.featureFlag:
+        return Icons.flag;
+      case PluginType.auth:
+        return Icons.account_circle;
+      default:
+        return Icons.extension;
+    }
   }
 }
 
-class _AnalyticsPluginView extends StatelessWidget {
-  const _AnalyticsPluginView({
-    required this.analytics,
-  });
+class _PluginWithDetailsItem extends StatelessWidget {
+  final Plugin plugin;
 
-  final AnalyticsPlugin analytics;
+  const _PluginWithDetailsItem({required this.plugin});
 
   @override
   Widget build(BuildContext context) {
     return ListTile(
+      leading: Icon(plugin.pluginType.icon),
       onTap: () {
-        context.push('/developer/plugins/analytics');
+        context.push('/developer/plugins/${plugin.pluginType}');
       },
-      title: StandardPluginView(plugin: analytics),
+      title: StandardPluginItem(plugin: plugin),
       trailing: const Icon(Icons.chevron_right),
     );
   }