prasule/lib/util/graphs.dart

import 'package:currency_picker/currency_picker.dart';
import 'package:dynamic_color/dynamic_color.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:intl/intl.dart';

/// Monthly/Yearly expense/income [LineChart]
class ExpensesLineChart extends StatelessWidget {
  /// Monthly/Yearly expense/income [LineChart]
  const ExpensesLineChart({
    required this.date,
    required this.locale,
    required this.expenseData,
    required this.incomeData,
    required this.currency,
    super.key,
    this.yearly = false,
  });

  /// If the graph will be shown yearly
  final bool yearly;

  /// Selected date
  ///
  /// Used to get either month or year
  final DateTime date;

  /// Current locale
  ///
  /// Used mainly for formatting
  final String locale;

  /// The expense data used for the graph
  final List<double> expenseData;

  /// Wallet currency
  ///
  /// Used to show currency symbol
  final Currency currency;

  /// Expense data, but sorted
  List<double> get expenseDataSorted =>
      List<double>.from(expenseData)..sort((a, b) => a.compareTo(b));

  /// Income data used for the graph
  final List<double> incomeData;

  /// Income data, but sorted
  List<double> get incomeDataSorted =>
      List<double>.from(incomeData)..sort((a, b) => a.compareTo(b));

  /// Calculates maxY for the graph
  double get maxY {
    if (incomeData.isEmpty) return expenseDataSorted.last;
    if (expenseData.isEmpty) return incomeDataSorted.last;
    if (expenseDataSorted.last > incomeDataSorted.last) {
      return expenseDataSorted.last;
    } else {
      return incomeDataSorted.last;
    }
  }

  @override
  Widget build(BuildContext context) {
    return LineChart(
      LineChartData(
        lineTouchData: LineTouchData(
          touchTooltipData: LineTouchTooltipData(
            getTooltipItems: (spots) => List<LineTooltipItem>.generate(
              spots.length,
              (index) => LineTooltipItem(
                (spots[index].barIndex == 0)
                    ? (yearly
                        ? AppLocalizations.of(context).incomeForMonth(
                            DateFormat.MMMM(locale).format(
                              DateTime(
                                date.year,
                                spots[index].x.toInt() + 1,
                              ),
                            ),
                            NumberFormat.compactCurrency(
                              locale: locale,
                              symbol: currency.symbol,
                              name: currency.name,
                            ).format(spots[index].y),
                          )
                        : AppLocalizations.of(context).incomeForDay(
                            NumberFormat.compactCurrency(
                              locale: locale,
                              symbol: currency.symbol,
                              name: currency.name,
                            ).format(spots[index].y),
                          ))
                    : (yearly
                        ? AppLocalizations.of(context).expensesForMonth(
                            DateFormat.MMMM(locale).format(
                              DateTime(
                                date.year,
                                spots[index].x.toInt() + 1,
                              ),
                            ),
                            NumberFormat.compactCurrency(
                              locale: locale,
                              symbol: currency.symbol,
                              name: currency.name,
                            ).format(spots[index].y),
                          )
                        : AppLocalizations.of(context).expensesForDay(
                            NumberFormat.compactCurrency(
                              locale: locale,
                              symbol: currency.symbol,
                              name: currency.name,
                            ).format(spots[index].y),
                          )),
                TextStyle(color: spots[index].bar.color),
              ),
            ),
          ),
        ),
        maxY: maxY,
        maxX: yearly ? 12 : DateTime(date.year, date.month, 0).day.toDouble(),
        minY: 0,
        minX: 0,
        backgroundColor: Theme.of(context).colorScheme.background,
        lineBarsData: [
          if (incomeData.isNotEmpty)
            LineChartBarData(
              isCurved: true,
              barWidth: 8,
              isStrokeCapRound: true,
              dotData: const FlDotData(show: false),
              belowBarData: BarAreaData(),
              color: Colors.green
                  .harmonizeWith(Theme.of(context).colorScheme.secondary),
              spots: List.generate(
                yearly ? 12 : DateTime(date.year, date.month, 0).day,
                (index) => FlSpot(index.toDouble(), incomeData[index]),
              ),
            ),
          if (expenseData.isNotEmpty)
            LineChartBarData(
              isCurved: true,
              barWidth: 8,
              isStrokeCapRound: true,
              dotData: const FlDotData(show: false),
              belowBarData: BarAreaData(),
              color: Colors.red
                  .harmonizeWith(Theme.of(context).colorScheme.secondary),
              spots: List.generate(
                yearly ? 12 : DateTime(date.year, date.month, 0).day,
                (index) => FlSpot(index.toDouble() + 1, expenseData[index]),
              ),
            ),
        ], // actual data
        titlesData: FlTitlesData(
          rightTitles: const AxisTitles(),
          topTitles: const AxisTitles(),
          bottomTitles: AxisTitles(
            sideTitles: SideTitles(
              reservedSize: 30,
              showTitles: true,
              getTitlesWidget: (value, meta) {
                String text;
                if (yearly) {
                  text = DateFormat.MMM(locale).format(
                    DateTime(date.year, value.toInt() + 1),
                  );
                } else {
                  text = (value.toInt() + 1).toString();
                }
                return SideTitleWidget(
                  axisSide: meta.axisSide,
                  child: Text(text),
                );
              },
            ),
          ),
        ), // axis descriptions
      ),
    );
  }
}

/// Renders expenses/income as a [BarChart]
class ExpensesBarChart extends StatelessWidget {
  /// Renders expenses/income as a [BarChart]
  const ExpensesBarChart({
    required this.yearly,
    required this.date,
    required this.locale,
    required this.expenseData,
    required this.incomeData,
    required this.currency,
    super.key,
  });

  /// If the graph will be shown yearly
  final bool yearly;

  /// Selected date
  ///
  /// Used to get either month or year
  final DateTime date;

  /// Current locale
  ///
  /// Used mainly for formatting
  final String locale;

  /// The expense data used for the graph
  final List<double> expenseData;

  /// Wallet currency
  ///
  /// Used to show currency symbol
  final Currency currency;

  /// Expense data, but sorted
  List<double> get expenseDataSorted =>
      List<double>.from(expenseData)..sort((a, b) => a.compareTo(b));

  /// Income data used for the graph
  final List<double> incomeData;

  /// Income data, but sorted
  List<double> get incomeDataSorted =>
      List<double>.from(incomeData)..sort((a, b) => a.compareTo(b));

  /// Calculates maxY for the graph
  double get maxY {
    if (incomeData.isEmpty) return expenseDataSorted.last;
    if (expenseData.isEmpty) return incomeDataSorted.last;
    if (expenseDataSorted.last > incomeDataSorted.last) {
      return expenseDataSorted.last;
    } else {
      return incomeDataSorted.last;
    }
  }

  @override
  Widget build(BuildContext context) => BarChart(
        BarChartData(
          barTouchData: BarTouchData(
            enabled: true,
            touchTooltipData: BarTouchTooltipData(
              getTooltipItem: (group, groupIndex, rod, rodIndex) =>
                  yearly // create custom tooltips for graph bars
                      ? BarTooltipItem(
                          (rodIndex == 1)
                              ? AppLocalizations.of(context).expensesForMonth(
                                  DateFormat.MMMM(locale).format(
                                    DateTime(date.year, groupIndex + 1),
                                  ),
                                  NumberFormat.compactCurrency(
                                    locale: locale,
                                    symbol: currency.symbol,
                                    name: currency.name,
                                  ).format(rod.toY),
                                )
                              : AppLocalizations.of(context).incomeForMonth(
                                  DateFormat.MMMM(locale).format(
                                    DateTime(date.year, groupIndex + 1),
                                  ),
                                  NumberFormat.compactCurrency(
                                    locale: locale,
                                    symbol: currency.symbol,
                                    name: currency.name,
                                  ).format(rod.toY),
                                ),
                          TextStyle(color: rod.color),
                        )
                      : BarTooltipItem(
                          (rodIndex == 1)
                              ? AppLocalizations.of(context).expensesForDay(
                                  NumberFormat.compactCurrency(
                                    locale: locale,
                                    symbol: currency.symbol,
                                    name: currency.name,
                                  ).format(rod.toY),
                                )
                              : AppLocalizations.of(context).incomeForDay(
                                  NumberFormat.compactCurrency(
                                    locale: locale,
                                    symbol: currency.symbol,
                                    name: currency.name,
                                  ).format(rod.toY),
                                ),
                          TextStyle(color: rod.color),
                        ),
            ),
          ),
          titlesData: FlTitlesData(
            rightTitles: const AxisTitles(),
            topTitles: const AxisTitles(),
            bottomTitles: AxisTitles(
              sideTitles: SideTitles(
                showTitles: true,
                reservedSize: 30,
                getTitlesWidget: (value, meta) {
                  String text;
                  if (yearly) {
                    text = DateFormat.MMM(locale).format(
                      DateTime(date.year, value.toInt() + 1),
                    );
                  } else {
                    text = (value.toInt() + 1).toString();
                  }
                  return SideTitleWidget(
                    axisSide: meta.axisSide,
                    child: Text(text),
                  );
                },
              ),
            ),
          ), // axis descriptions,
          minY: 0,
          maxY: maxY,
          barGroups: List<BarChartGroupData>.generate(
            yearly ? 12 : DateTime(date.year, date.month, 0).day,
            (index) => BarChartGroupData(
              x: index,
              barRods: [
                if (incomeData.isNotEmpty)
                  BarChartRodData(
                    toY: incomeData[index],
                    color: Colors.green
                        .harmonizeWith(Theme.of(context).colorScheme.secondary),
                  ),
                if (expenseData.isNotEmpty)
                  BarChartRodData(
                    toY: expenseData[index],
                    color: Colors.red
                        .harmonizeWith(Theme.of(context).colorScheme.secondary),
                  ),
              ],
            ),
          ),
        ),
      );
}