Implement retrieval of historical telemetry data using FutureBuilder

- Use stateful widget instead and implement FutureBuilder to retrieve historical telemetry data
- Remove readPreviousReading() method and its related invocation code since the process is automatic
- Add length property for LineChartSpots

lib/data/IoT/models/line_chart_spots.dart

@@ -29,5 +29,6 @@ class LineChartSpots {
  }
  }
 
+ int get length => _spots.length;
  List<FlSpot> toList() => _spots.toList();
 }

lib/data/IoT/repositories/telemetry_data_repository.dart

@@ -22,38 +22,17 @@ class TelemetryDataRepository {
  .map((event) => TelemetryData.fromRealtimeDatabase(event.snapshot));
  }
 
- TelemetryData readPreviousReading(String data) {
- TelemetryData telemetryData;
- _telemetryDb
- .child(data)
- .orderByKey()
- .limitToLast(1)
- .onChildAdded
- .forEach((event) {
- if (event.snapshot != null) {
- telemetryData = TelemetryData.fromRealtimeDatabase(event.snapshot);
- }
- });
- return telemetryData;
- }
+ Future<List<TelemetryData>> readPrevReadings(String data, int num) async {
+ List<TelemetryData> dataList = List();
+ DataSnapshot snapshot =
+ await _telemetryDb.child(data).orderByKey().limitToLast(num).once();
 
- List<TelemetryData> readPreviousReadings(String data, int num) {
- List<TelemetryData> telemetryDataList = List();
- _telemetryDb
- .child(data)
- .orderByKey()
- .limitToLast(num)
- .onValue
- .forEach((event) {
- if (event.snapshot != null && event.snapshot.value != null) {
- Map<dynamic, dynamic> map = event.snapshot.value;
- map = Map.fromEntries(map.entries.toList()
- ..sort((e1, e2) => int.parse(e1.key).compareTo(int.parse(e2.key))));
- map.forEach((key, value) {
- telemetryDataList.add(TelemetryData.from(key, value));
- });
- }
- });
- return telemetryDataList;
+ if (snapshot != null && snapshot.value != null) {
+ Map<dynamic, dynamic> map = snapshot.value;
+ map.entries.toList()
+ ..sort((d1, d2) => int.parse(d1.key).compareTo(int.parse(d2.key)))
+ ..forEach((d) => dataList.add(TelemetryData.from(d.key, d.value)));
+ }
+ return dataList;
  }
 }

lib/ui/IoT/telemetry_data_chart.dart

@@ -6,7 +6,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:intl/intl.dart';
 
-class TelemetryDataChart extends StatelessWidget {
+class TelemetryDataChart extends StatefulWidget {
  TelemetryDataChart({
  Key key,
  @required this.data,
@@ -25,58 +25,88 @@ class TelemetryDataChart extends StatelessWidget {
  final TelemetryDataCardItem cardItem;
 
  @override
- Widget build(BuildContext context) {
- TelemetryData telemetryData = context.watch<TelemetryData>();
+ _TelemetryDataChartState createState() => _TelemetryDataChartState();
+}
 
- // If real-time telemetry data is not available,
- if (telemetryData == null) {
- // Tries to read previous telemetry data.
- // Use Provider.of() method due to stricter restrictions imposed by
- // context.read() method when it is called inside a build function.
- List<TelemetryData> telemetryDataList =
- RepositoryProvider.of<TelemetryDataRepository>(
- context,
- listen: false,
- ).readPreviousReadings(data, numData);
+class _TelemetryDataChartState extends State<TelemetryDataChart> {
+ bool _hasReadPrev = false;
+ DateTime _prevTimestamp = DateTime.fromMillisecondsSinceEpoch(0);
 
- // Returns an empty container if previous telemetry data is also not available.
- if (telemetryDataList.length == 0) {
- return Container();
- }
- // Adds previous data into line chart points.
- else {
- telemetryDataList.forEach((telemetryData) {
- spots.add(telemetryData.value);
- bottomTitles.add(DateFormat.ms().format(telemetryData.timestamp));
- });
- }
+ @override
+ Widget build(BuildContext context) {
+ // Tries to read previous telemetry data.
+ if (!_hasReadPrev) {
+ return FutureBuilder<List<TelemetryData>>(
+ // Use Provider.of() method due to stricter restrictions imposed by
+ // context.read() method when it is called inside a build function.
+ future: RepositoryProvider.of<TelemetryDataRepository>(
+ context,
+ listen: false,
+ ).readPrevReadings(widget.data, widget.numData),
+ builder: (_, snapshot) {
+ if (snapshot.hasData) {
+ // Adds previous data into line chart points.
+ snapshot.data.forEach((data) {
+ widget.spots.add(data.value);
+ widget.bottomTitles.add(DateFormat.ms().format(data.timestamp));
+ // Saves timestamp of last added data
+ _prevTimestamp = data.timestamp;
+ });
+ Future.delayed(Duration.zero, () {
+ setState(() {
+ _hasReadPrev = true;
+ });
+ });
+ } else if (snapshot.hasError) {
+ Future.delayed(Duration.zero, () {
+ setState(() {
+ _hasReadPrev = true;
+ });
+ });
+ }
+ return Container();
+ },
+ );
  }
- // If real-time telemetry data is available, add data into line chart points.
+ // After finished reading previous data,
  else {
- spots.add(telemetryData.value);
- bottomTitles.add(DateFormat.ms().format(telemetryData.timestamp));
+ TelemetryData data = context.watch<TelemetryData>();
+ // Avoids adding duplicate data since the data stream automatically
+ // fetches the last added data in the first fetch.
+ if (data != null && data.timestamp != _prevTimestamp) {
+ widget.spots.add(data.value);
+ widget.bottomTitles.add(DateFormat.ms().format(data.timestamp));
+ }
+
+ if (widget.spots.length == 0) {
+ return Container();
+ } else {
+ return _buildlineChart();
+ }
  }
+ }
 
+ LineChart _buildlineChart() {
  return LineChart(
  LineChartData(
  lineTouchData: _lineTouchData(),
  titlesData: _titlesData(),
- lineBarsData: _lineBarsData(spots),
+ lineBarsData: _lineBarsData(widget.spots),
  extraLinesData: ExtraLinesData(
  horizontalLines: [
- _horizontalLine(cardItem.lowerThreshold),
- _horizontalLine(cardItem.upperThreshold),
+ _horizontalLine(widget.cardItem.lowerThreshold),
+ _horizontalLine(widget.cardItem.upperThreshold),
  ],
  ),
  clipData: FlClipData.all(),
  gridData: FlGridData(show: false),
  borderData: FlBorderData(show: false),
- // Decrements 1.0 by 0.15 to avoid points be blocked by the drawing region.
- minX: 0.85,
- // Increments by 0.15 to avoid points be blocked by the drawing region.
- maxX: numData.toDouble() + 0.15,
- maxY: cardItem.upperBoundary,
- minY: cardItem.lowerBoundary,
+ // Decrements 1.0 by 0.2 to avoid points be blocked by the drawing region.
+ minX: 0.8,
+ // Increments by 0.2 to avoid points be blocked by the drawing region.
+ maxX: widget.numData.toDouble() + 0.2,
+ maxY: widget.cardItem.upperBoundary,
+ minY: widget.cardItem.lowerBoundary,
  ),
  );
  }
@@ -85,7 +115,7 @@ class TelemetryDataChart extends StatelessWidget {
  return [
  LineChartBarData(
  spots: spots.toList(),
- showingIndicators: xIndexes,
+ showingIndicators: widget.xIndexes,
  isCurved: true,
  curveSmoothness: 0,
  colors: const [Colors.white],
@@ -151,8 +181,8 @@ class TelemetryDataChart extends StatelessWidget {
  reservedSize: 10,
  margin: 8,
  getTitles: (x) {
- if (x.ceil() <= bottomTitles.length) {
- return bottomTitles[x.ceil() - 1];
+ if (x.ceil() <= widget.bottomTitles.length) {
+ return widget.bottomTitles[x.ceil() - 1];
  } else {
  return '';
  }

lib/ui/IoT/telemetry_data_reading.dart

@@ -1,6 +1,5 @@
 import 'package:farmassist/app_theme.dart';
 import 'package:farmassist/data/IoT/models/telemetry_data.dart';
-import 'package:farmassist/data/IoT/repositories/telemetry_data_repository.dart';
 import 'package:farmassist/ui/IoT/reload_time.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
@@ -16,18 +15,6 @@ class TelemetryDataReading extends StatelessWidget {
  Widget build(BuildContext context) {
  TelemetryData telemetryData = context.watch<TelemetryData>();
 
- // If real-time telemetry data is not available,
- if (telemetryData == null) {
- // Tries to read previous telemetry data.
- // Use Provider.of() method due to stricter restrictions imposed by
- // context.read() method when it is called inside a build function.
- telemetryData = RepositoryProvider.of<TelemetryDataRepository>(
- context,
- listen: false,
- ).readPreviousReading(data);
- }
-
- // Returns "N/A" if previous telemetry data is also not available.
  if (telemetryData == null) {
  return _buildReading("N/A");
  } else {