Used Provider-Package to encapsulate state management

devtools_options.yaml

@@ -0,0 +1,3 @@
+description: This file stores settings for Dart & Flutter DevTools.
+documentation: https://docs.flutter.dev/tools/devtools/extensions#configure-extension-enablement-states
+extensions:

lib/Widgets/flood_station_list_view.dart

@@ -1,13 +1,16 @@
 import 'package:flutter/material.dart';
 
 import '../model/flood_station.dart';
-import '../pages/flood_station_page.dart';
 
 class FloodStationListView extends StatelessWidget {
-  const FloodStationListView({super.key, required List<FloodStation> stations})
+  const FloodStationListView(
+      {super.key,
+      required List<FloodStation> stations,
+      required this.onItemTapped})
       : _stations = stations;
 
   final List<FloodStation> _stations;
+  final void Function(FloodStation) onItemTapped;
 
   @override
   Widget build(BuildContext context) {
@@ -20,9 +23,7 @@ class FloodStationListView extends StatelessWidget {
         final item = _stations.elementAt(index);
         return ListTile(
           isThreeLine: true,
-          onTap: () => Navigator.of(context).push(MaterialPageRoute(
+          onTap: () => onItemTapped(item),
-            builder: (context) => FloodStationPage(floodStation: item),
-          )),
           title: Text(item.label),
           subtitle: Column(
             crossAxisAlignment: CrossAxisAlignment.start,

lib/main.dart

@@ -1,9 +1,17 @@
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 
+import 'pages/flood_station_page.dart';
 import 'pages/landing_page.dart';
+import 'services/flood_station_provider.dart';
 
 void main() {
-  runApp(const MyApp());
+  runApp(
+    ChangeNotifierProvider(
+      create: (context) => FloodStationProvider(),
+      child: const MyApp(),
+    ),
+  );
 }
 
 class MyApp extends StatelessWidget {
@@ -20,6 +28,7 @@ class MyApp extends StatelessWidget {
       initialRoute: LandingPage.routeName,
       routes: {
         LandingPage.routeName: (context) => LandingPage(),
+        FloodStationPage.routeName: (context) => FloodStationPage(),
       },
     );
   }

lib/pages/flood_station_page.dart

@@ -1,22 +1,37 @@
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 
 import '../Widgets/reading_graph.dart';
 import '../model/flood_station.dart';
 import '../model/reading.dart';
 import '../services/api.dart';
+import '../services/flood_station_provider.dart';
+
+class FloodStationPage extends StatefulWidget {
+  const FloodStationPage({super.key});
+  static const String routeName = '/station';
+
+  @override
+  State<FloodStationPage> createState() => _FloodStationPageState();
+}
+
+class _FloodStationPageState extends State<FloodStationPage> {
+  @override
+  void deactivate() {
+    context.read<FloodStationProvider>().selectedStation = null;
+    super.deactivate();
+  }
 
-class FloodStationPage extends StatelessWidget {
-  const FloodStationPage({super.key, required FloodStation floodStation})
-      : _floodStation = floodStation;
-  final FloodStation _floodStation;
   @override
   Widget build(BuildContext context) {
+    final FloodStation? station =
+        context.read<FloodStationProvider>().selectedStation;
     return Scaffold(
       appBar: AppBar(
-        title: Text(_floodStation.label),
+        title: Text(station?.label ?? ''),
       ),
       body: FutureBuilder<List<Reading>>(
-          future: Api.fetchReadingsFromStation(_floodStation.id),
+          future: Api.fetchReadingsFromStation(station?.id ?? ''),
           builder: (context, snapshot) {
             if (snapshot.hasData) {
               if (snapshot.data!.isEmpty) {

lib/pages/landing_page.dart

@@ -1,33 +1,39 @@
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 
 import '../Widgets/flood_station_list_view.dart';
-import '../model/flood_station.dart';
+import '../services/flood_station_provider.dart';
-import '../services/api.dart';
+import 'flood_station_page.dart';
 
-class LandingPage extends StatelessWidget {
+class LandingPage extends StatefulWidget {
   const LandingPage({super.key});
 
   static const routeName = '/';
 
-  Widget builder(
+  @override
-      BuildContext context, AsyncSnapshot<List<FloodStation>> snapshot) {
+  State<LandingPage> createState() => _LandingPageState();
-    if (!snapshot.hasData) {
+}
-      return CircularProgressIndicator();
+
-    } else if (snapshot.hasData) {
+class _LandingPageState extends State<LandingPage> {
-      return FloodStationListView(stations: snapshot.data!);
+  late FloodStationProvider floodStationProvider;
-    } else if (snapshot.hasError) {
+
-      return Text(snapshot.error.toString());
+  @override
-    } else {
+  initState() {
-      return Text('An unknown error occured.');
+    super.initState();
-    }
+    WidgetsBinding.instance
+        .addPostFrameCallback((_) => floodStationProvider.loadAllStations());
   }
 
   @override
   Widget build(BuildContext context) {
+    floodStationProvider = context.watch<FloodStationProvider>();
     return Scaffold(
-      body: FutureBuilder<List<FloodStation>>(
+      body: FloodStationListView(
-        future: Api.fetchStations(),
+        stations: floodStationProvider.allStations,
-        builder: builder,
+        onItemTapped: (station) {
+          floodStationProvider.selectedStation = station;
+          Navigator.of(context).pushNamed(FloodStationPage.routeName);
+        },
       ),
     );
   }

lib/services/flood_station_provider.dart

@@ -0,0 +1,22 @@
+import 'package:flutter/material.dart';
+
+import '../model/flood_station.dart';
+import 'api.dart';
+
+class FloodStationProvider extends ChangeNotifier {
+  List<FloodStation> _allStations = [];
+  FloodStation? selectedStation;
+
+  List<FloodStation> get allStations => _allStations;
+
+  Future loadAllStations({silent = false}) {
+    return Api.fetchStations().then(
+      (value) {
+        _allStations = value;
+        if (!silent) {
+          notifyListeners();
+        }
+      },
+    );
+  }
+}

pubspec.yaml

@@ -14,6 +14,7 @@ dependencies:
   fl_chart: ^0.70.2
   http: ^1.3.0
   intl: ^0.20.2
+  provider: ^6.1.2
 
 dev_dependencies:
   flutter_test: