Implemented Loading Overlay

lib/pages/flood_station_page.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
-import '../Widgets/reading_graph.dart';
+import '../widgets/reading_graph.dart';
 import '../model/flood_station.dart';
 import '../model/reading.dart';
 import '../services/api.dart';

lib/pages/landing_page.dart

@@ -1,8 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
-import '../Widgets/flood_station_list_view.dart';
+import '../widgets/flood_station_list_view.dart';
 import '../services/flood_station_provider.dart';
+import '../widgets/loading_notifier.dart';
+import '../widgets/station_filter.dart';
 import 'flood_station_page.dart';
 
 class LandingPage extends StatefulWidget {
@@ -16,25 +18,72 @@ class LandingPage extends StatefulWidget {
 
 class _LandingPageState extends State<LandingPage> {
   late FloodStationProvider floodStationProvider;
+  bool _isLoading = false;
+  OverlayEntry? _overlayEntry;
 
   @override
   initState() {
     super.initState();
-    WidgetsBinding.instance
-        .addPostFrameCallback((_) => floodStationProvider.loadAllStations());
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      _isLoading = true;
+      showLoadingNotifier(context: context, message: 'Loading');
+      floodStationProvider
+          .loadAllStations()
+          .whenComplete(() => removeLoadingNotifier());
+    });
   }
 
   @override
   Widget build(BuildContext context) {
     floodStationProvider = context.watch<FloodStationProvider>();
     return Scaffold(
-      body: FloodStationListView(
+      body: Column(
+        children: [
+          StationFilter(
+            onEditingComplete: (filterText) {},
+          ),
+          Expanded(
+            child: FloodStationListView(
               stations: floodStationProvider.allStations,
               onItemTapped: (station) {
                 floodStationProvider.selectedStation = station;
                 Navigator.of(context).pushNamed(FloodStationPage.routeName);
               },
             ),
+          ),
+        ],
+      ),
     );
   }
+
+  Future<void> showLoadingNotifier({
+    required BuildContext context,
+    required String message,
+  }) async {
+    OverlayState? overlayState = Overlay.of(context);
+    _overlayEntry = OverlayEntry(
+      builder: (c) {
+        return Positioned(
+          bottom: 16,
+          left: 0,
+          right: 0,
+          child: Center(
+            child: LoadingNotifier(
+              message: 'Loading',
+              onDismissed: () => removeLoadingNotifier(),
+            ),
+          ),
+        );
+      },
+    );
+    overlayState.insert(_overlayEntry!);
+    overlayState.setState(() {});
+  }
+
+  void removeLoadingNotifier() {
+    if (_overlayEntry != null) {
+      _overlayEntry?.remove();
+      _overlayEntry = null;
+    }
+  }
 }

lib/widgets/loading_notifier.dart

@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+
+class LoadingNotifier extends StatelessWidget {
+  const LoadingNotifier(
+      {super.key, required this.onDismissed, required this.message});
+  final void Function() onDismissed;
+  final String message;
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      color: Theme.of(context).colorScheme.primaryContainer,
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(45)),
+      child: SizedBox(
+        width: 500,
+        height: 60,
+        child: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 20),
+          child: Row(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            mainAxisSize: MainAxisSize.max,
+            children: [
+              SizedBox(
+                width: 25,
+                height: 25,
+                child: CircularProgressIndicator(),
+              ),
+              Text(
+                message,
+                style: Theme.of(context).textTheme.titleSmall,
+              ),
+              IconButton(
+                onPressed: () => onDismissed(),
+                icon: Icon(Icons.close),
+              )
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/widgets/station_filter.dart

@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+
+class StationFilter extends StatefulWidget {
+  const StationFilter({super.key, required this.onEditingComplete});
+  final void Function(String filterText) onEditingComplete;
+
+  @override
+  State<StationFilter> createState() => StationFilterState();
+}
+
+class StationFilterState extends State<StationFilter> {
+  TextEditingController filterController = TextEditingController();
+
+  @override
+  Widget build(BuildContext context) {
+    return TextField(
+      controller: filterController,
+      decoration: InputDecoration(
+        prefixIcon: Icon(Icons.search),
+        suffixIcon: Opacity(
+          opacity: filterController.text.isEmpty ? 0 : 1,
+          child: IconButton(
+            onPressed: () {
+              filterController.clear();
+              setState(() {});
+            },
+            icon: Icon(Icons.delete),
+          ),
+        ),
+        label: Text('Filter'),
+      ),
+      onChanged: (_) => setState(() {}),
+      onEditingComplete: () => widget.onEditingComplete(filterController.text),
+    );
+  }
+}