Simple NavigationBar and placeholder map view

lib/main.dart

@@ -3,6 +3,7 @@ import 'package:provider/provider.dart';
 
 import 'pages/flood_station_page.dart';
 import 'pages/landing_page.dart';
+import 'pages/main_navigation_scaffold.dart';
 import 'services/flood_station_provider.dart';
 import 'package:timezone/data/latest.dart' as tz;
 
@@ -27,9 +28,9 @@ class MyApp extends StatelessWidget {
         colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
         useMaterial3: true,
       ),
-      initialRoute: LandingPage.routeName,
+      initialRoute: MainNavigationScaffold.routeName,
       routes: {
-        LandingPage.routeName: (context) => LandingPage(),
+        MainNavigationScaffold.routeName: (context) => MainNavigationScaffold(),
         FloodStationPage.routeName: (context) => FloodStationPage(),
       },
     );

lib/pages/landing_page.dart

@@ -10,56 +10,79 @@ import 'flood_station_page.dart';
 class LandingPage extends StatefulWidget {
   const LandingPage({super.key});
 
-  static const routeName = '/';
-
   @override
   State<LandingPage> createState() => _LandingPageState();
 }
 
 class _LandingPageState extends State<LandingPage> {
   late FloodStationProvider floodStationProvider;
-  bool _isLoading = false;
   OverlayEntry? _overlayEntry;
-
-  @override
-  initState() {
-    super.initState();
-    WidgetsBinding.instance.addPostFrameCallback((_) {
-      _isLoading = true;
-      showLoadingNotifier(context: context, message: 'Loading');
-      floodStationProvider
-          .loadAllStations()
-          .whenComplete(() => removeLoadingNotifier());
-    });
-  }
+  int loadingTimes = 0;
 
   @override
   Widget build(BuildContext context) {
     floodStationProvider = context.watch<FloodStationProvider>();
-    return Scaffold(
-      body: Column(
+    return Column(
       children: [
         StationFilter(
-            onEditingComplete: (filterText) {},
+          onChanged: (filterText) {
+            if (filterText.isEmpty) {
+              floodStationProvider.filtered = false;
+              setState(() {});
+              return;
+            }
+            showLoadingNotifier(context: context, message: 'Loading');
+            floodStationProvider.loadFilteredStations(filterText);
+            floodStationProvider.filteredStationsFuture
+                ?.then((_) => removeLoadingNotifier());
+            floodStationProvider.filtered = true;
+          },
         ),
-          Expanded(
+        _shouldShowList()
+            ? Expanded(
                 child: FloodStationListView(
-              stations: floodStationProvider.allStations,
+                  stations: floodStationProvider.filtered
+                      ? floodStationProvider.filteredStations
+                      : floodStationProvider.allStations,
                   onItemTapped: (station) {
                     floodStationProvider.selectedStation = station;
                     Navigator.of(context).pushNamed(FloodStationPage.routeName);
                   },
                 ),
+              )
+            : Expanded(
+                child: Center(
+                  child: ElevatedButton(
+                    onPressed: () {
+                      showLoadingNotifier(context: context, message: 'Loading');
+                      floodStationProvider
+                          .loadAllStations()
+                          .whenComplete(() => removeLoadingNotifier());
+                    },
+                    child: Text('Load all Stations'),
+                  ),
+                ),
               ),
       ],
-      ),
     );
   }
 
+  bool _shouldShowList() {
+    if (!floodStationProvider.filtered &&
+        floodStationProvider.allStations.isNotEmpty) {
+      return true;
+    }
+    if (floodStationProvider.filtered) {
+      return true;
+    }
+    return false;
+  }
+
   Future<void> showLoadingNotifier({
     required BuildContext context,
     required String message,
   }) async {
+    if (_overlayEntry != null) return;
     OverlayState? overlayState = Overlay.of(context);
     _overlayEntry = OverlayEntry(
       builder: (c) {
@@ -70,7 +93,10 @@ class _LandingPageState extends State<LandingPage> {
           child: Center(
             child: LoadingNotifier(
               message: 'Loading',
-              onDismissed: () => removeLoadingNotifier(),
+              onDismissed: () {
+                floodStationProvider.cancelFilterLoading();
+                removeLoadingNotifier();
+              },
             ),
           ),
         );

lib/pages/main_navigation_scaffold.dart

@@ -0,0 +1,41 @@
+import 'package:flutter/material.dart';
+
+import 'landing_page.dart';
+import 'map_page.dart';
+
+class MainNavigationScaffold extends StatefulWidget {
+  const MainNavigationScaffold({super.key});
+  static const routeName = '/';
+
+  @override
+  State<MainNavigationScaffold> createState() => _MainNavigationScaffoldState();
+}
+
+class _MainNavigationScaffoldState extends State<MainNavigationScaffold> {
+  int _selectedPageIndex = 0;
+
+  final List<Widget> _pages = [
+    const LandingPage(),
+    const MapPage(),
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      bottomNavigationBar: NavigationBar(
+        selectedIndex: _selectedPageIndex,
+        onDestinationSelected: (value) => setState(() {
+          _selectedPageIndex = value;
+        }),
+        destinations: [
+          NavigationDestination(icon: Icon(Icons.list), label: 'List'),
+          NavigationDestination(icon: Icon(Icons.map_outlined), label: 'Map'),
+        ],
+      ),
+      body: IndexedStack(
+        index: _selectedPageIndex,
+        children: _pages,
+      ),
+    );
+  }
+}

lib/pages/map_page.dart

@@ -0,0 +1,11 @@
+import 'package:flutter/material.dart';
+
+class MapPage extends StatelessWidget {
+  const MapPage({super.key});
+  static const routeName = '/map';
+
+  @override
+  Widget build(BuildContext context) {
+    return const Placeholder();
+  }
+}

lib/services/api.dart

@@ -21,6 +21,20 @@ class Api {
     return stations;
   }
 
+  /// Fetches all stations whose label contain [label]
+  static Future<List<FloodStation>> fetchFilteredStations(String label) async {
+    List<FloodStation> stations = [];
+    final response =
+        await http.get(Uri.parse('$_rootUrl/id/stations?search=$label'));
+    if (response.statusCode == 200) {
+      final Map<String, dynamic> jsonStr = jsonDecode(response.body);
+      for (final str in jsonStr['items']) {
+        stations.add(FloodStation.fromMap(str));
+      }
+    }
+    return stations;
+  }
+
   /// [limit] limits the number of entries that are requested from the API and [offset] returns the
   /// list starting from the specified number
 

lib/services/flood_station_provider.dart

@@ -1,14 +1,22 @@
 import 'package:flutter/material.dart';
+import 'package:async/async.dart';
 
 import '../model/flood_station.dart';
 import 'api.dart';
 
 class FloodStationProvider extends ChangeNotifier {
   FloodStation? selectedStation;
+  bool filtered = false;
 
   List<FloodStation> _allStations = [];
+  List<FloodStation> _filteredStations = [];
 
   List<FloodStation> get allStations => _allStations;
+  List<FloodStation> get filteredStations => _filteredStations;
+
+  CancelableOperation? _filteredStationsFuture;
+
+  CancelableOperation? get filteredStationsFuture => _filteredStationsFuture;
 
   Future loadAllStationsInBatches({silent = false}) {
     int offset = 0;
@@ -37,4 +45,26 @@ class FloodStationProvider extends ChangeNotifier {
       },
     );
   }
+
+  Future loadFilteredStations(String filter, {silent = false}) {
+    if (_filteredStationsFuture != null) {
+      _filteredStationsFuture!.cancel();
+    }
+    final future = Api.fetchFilteredStations(filter);
+    _filteredStationsFuture = CancelableOperation.fromFuture(future).then(
+      (value) {
+        _filteredStations = value;
+        if (!silent) {
+          notifyListeners();
+        }
+      },
+    );
+    return future;
+  }
+
+  void cancelFilterLoading() {
+    if (_filteredStationsFuture != null) {
+      _filteredStationsFuture!.cancel();
+    }
+  }
 }

lib/widgets/reading_graph.dart

@@ -70,6 +70,7 @@ class ReadingGraph extends StatelessWidget {
         reservedSize: 40,
         showTitles: true,
         maxIncluded: false,
+        minIncluded: false,
         getTitlesWidget: (value, meta) => SideTitleWidget(
           meta: meta,
           child: Text(getDate(value)),

lib/widgets/station_filter.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
 
 class StationFilter extends StatefulWidget {
-  const StationFilter({super.key, required this.onEditingComplete});
-  final void Function(String filterText) onEditingComplete;
+  const StationFilter({super.key, required this.onChanged});
+  final void Function(String filterText) onChanged;
 
   @override
   State<StationFilter> createState() => StationFilterState();
@@ -22,15 +22,15 @@ class StationFilterState extends State<StationFilter> {
           child: IconButton(
             onPressed: () {
               filterController.clear();
-              setState(() {});
+
+              widget.onChanged(filterController.text);
             },
             icon: Icon(Icons.delete),
           ),
         ),
         label: Text('Filter'),
       ),
-      onChanged: (_) => setState(() {}),
-      onEditingComplete: () => widget.onEditingComplete(filterController.text),
+      onChanged: (_) => widget.onChanged(filterController.text),
     );
   }
 }

pubspec.yaml

@@ -16,6 +16,8 @@ dependencies:
   intl: ^0.20.2
   provider: ^6.1.2
   timezone: ^0.10.0
+  async: ^2.11.0
+  flutter_osm_plugin: ^1.3.6
 
 dev_dependencies:
   flutter_test: