WIP state management loadable errorbar

lib/state/app/application/marianumMessage/marianum_message_controller.dart

@@ -19,6 +19,6 @@ class MarianumMessageController extends Controller<LoadableState<MarianumMessage
   }
 
   void error() {
-
+    emit(state.error(state: const MarianumMessageState(test: [])));
   }
 }

lib/state/infrastructure/loadable_state.dart

@@ -14,14 +14,20 @@ class LoadableState<TState> {
   LoadableState<TState> done(TState state) =>
       LoadableState<TState>(loadingState: LoadingState.none, data: state);
 
-  LoadableState<TState> error(TState state) =>
+  LoadableState<TState> error({TState? state}) =>
-      LoadableState<TState>(loadingState: LoadingState.none, data: state);
+      LoadableState<TState>(loadingState: LoadingState.failed, data: state);
 
   bool isBackgroundLoading() =>
       loadingState == LoadingState.loading && data != null;
 
+  bool hasError() =>
+      loadingState == LoadingState.failed;
+
   bool hasStateData() =>
       data != null;
+
+  bool errorBarVisible() =>
+      hasError() && hasStateData();
 }
 
 enum LoadingState {

lib/state/widgets/loadable_controller_consumer.dart

@@ -5,35 +5,77 @@ import '../infrastructure/loadable_state.dart';
 import '../infrastructure/state_extensions.dart';
 
 class LoadableControllerConsumer<TController extends Controller<TState>, TState extends LoadableState> extends StatelessWidget {
-  final Widget Function(BuildContext context, TState state) child;
+  final Widget child;
   const LoadableControllerConsumer({required this.child, super.key});
 
+  final Duration animationDuration = const Duration(milliseconds: 200);
+
   @override
   Widget build(BuildContext context) {
     var state = context.readController<TController>().state;
-    return Stack(
+
+    var loadableContent = Stack(
       children: [
-        if(!state.hasStateData()) const Center(child: CircularProgressIndicator()),
+        AnimatedOpacity(
+            opacity: !state.hasStateData() ? 1.0 : 0.0,
+            duration: animationDuration,
+            curve: Curves.easeInOut,
+            child: const Center(child: CircularProgressIndicator()),
+        ),
 
         AnimatedSwitcher(
-          duration: const Duration(milliseconds: 100),
+          duration: animationDuration,
           transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition(
-              position: Tween<Offset>(
+            position: Tween<Offset>(
-                begin: const Offset(0.0, -1.0),
+              begin: const Offset(0.0, -1.0),
-                end: Offset.zero,
+              end: Offset.zero,
-              ).animate(animation),
+            ).animate(animation),
-              child: child,
+            child: child,
-            ),
+          ),
-          child: state.isBackgroundLoading() ? const LinearProgressIndicator() : const SizedBox.shrink(),
+          child: state.isBackgroundLoading() && !state.errorBarVisible() ? const LinearProgressIndicator() : const SizedBox.shrink(),
         ),
 
         AnimatedOpacity(
-          opacity: state.hasStateData() ? 1.0 : 0.0,
+            opacity: state.hasStateData() ? 1.0 : 0.0,
-          duration: const Duration(milliseconds: 100),
+            duration: animationDuration,
-          curve: Curves.easeInOut,
+            curve: Curves.easeInOut,
-          child: state.hasStateData() ? child(context, state) : const SizedBox.shrink()
+            child: state.hasStateData() ? child : const SizedBox.shrink()
         ),
       ],
     );
+
+    var errorBar = AnimatedSwitcher(
+      duration: animationDuration,
+      transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition(
+        position: Tween<Offset>(
+          begin: const Offset(0.0, -1.0),
+          end: Offset.zero,
+        ).animate(animation),
+        child: child,
+      ),
+      child: !state.errorBarVisible()
+        ? const SizedBox.shrink()
+        : Container(
+          height: 20,
+          decoration: const BoxDecoration(
+            color: Colors.red,
+          ),
+          child: const Row(
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              Icon(Icons.wifi_find_outlined, size: 12),
+              SizedBox(width: 10),
+              Text('Keine Verbindung', style: TextStyle(fontSize: 12))
+            ],
+          ),
+        ),
+    );
+
+    return Column(
+      mainAxisAlignment: MainAxisAlignment.start,
+      crossAxisAlignment: CrossAxisAlignment.start,
+      mainAxisSize: MainAxisSize.max,
+      children: [errorBar, loadableContent],
+    );
   }
 }

lib/view/pages/more/test.dart

@@ -15,13 +15,13 @@ class Test extends StatelessWidget {
   Widget build(BuildContext context) => ControllerProvider<MarianumMessageController>(
       create: (context) => MarianumMessageController(),
       child: (context) => Scaffold(
-        appBar: AppBar(title: const Text("TEST")),
+        appBar: AppBar(title: const Text('TEST')),
         body: LoadableControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>>(
-          child: (context, data) => Column(
+          child: Column(
             children: [
               TextButton(
                   onPressed: () => context.readController<MarianumMessageController>().loading(),
-                  child: Text(data.loadingState.toString())
+                  child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
               ),
               TextButton(
                   onPressed: () => context.readController<MarianumMessageController>().backgroundLoading(),
@@ -31,6 +31,10 @@ class Test extends StatelessWidget {
                   onPressed: () => context.readController<MarianumMessageController>().done(),
                   child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
               ),
+              TextButton(
+                  onPressed: () => context.readController<MarianumMessageController>().error(),
+                  child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
+              ),
               ControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>>(child: (context, state) => Text(state.data!.test.toString())),
               SubSelectedControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>, LoadingState>(
                 subselect: (state) => state.loadingState,