How to Create Custom Analytics in FlutterFlow

1// Custom Widget: RevenueLineChart
2// Parameters: dataPoints (List<double>), labels (List<String>), lineColor (Color)
3// Package: fl_chart
4
5class RevenueLineChart extends StatelessWidget {
6  final List<double> dataPoints;
7  final List<String> labels;
8  final Color lineColor;
9  final double height;
10
11  const RevenueLineChart({
12    Key? key,
13    required this.dataPoints,
14    required this.labels,
15    required this.lineColor,
16    this.height = 200.0,
17  }) : super(key: key);
18
19  @override
20  Widget build(BuildContext context) {
21    if (dataPoints.isEmpty) {
22      return SizedBox(
23        height: height,
24        child: const Center(child: Text('No data available')),
25      );
26    }
27
28    final spots = dataPoints
29        .asMap()
30        .entries
31        .map((e) => FlSpot(e.key.toDouble(), e.value))
32        .toList();
33
34    final maxY = dataPoints.reduce((a, b) => a > b ? a : b) * 1.2;
35
36    return SizedBox(
37      height: height,
38      child: LineChart(
39        LineChartData(
40          gridData: FlGridData(
41            show: true,
42            drawVerticalLine: false,
43            getDrawingHorizontalLine: (value) => FlLine(
44              color: Colors.grey.withOpacity(0.2),
45              strokeWidth: 1,
46            ),
47          ),
48          titlesData: FlTitlesData(
49            leftTitles: AxisTitles(
50              sideTitles: SideTitles(
51                showTitles: true,
52                reservedSize: 50,
53                getTitlesWidget: (value, meta) => Text(
54                  '\$${value.toStringAsFixed(0)}',
55                  style: const TextStyle(fontSize: 10),
56                ),
57              ),
58            ),
59            bottomTitles: AxisTitles(
60              sideTitles: SideTitles(
61                showTitles: true,
62                reservedSize: 22,
63                getTitlesWidget: (value, meta) {
64                  final idx = value.toInt();
65                  if (idx < 0 || idx >= labels.length) return const SizedBox();
66                  return Text(labels[idx],
67                      style: const TextStyle(fontSize: 10));
68                },
69              ),
70            ),
71            topTitles: const AxisTitles(
72                sideTitles: SideTitles(showTitles: false)),
73            rightTitles: const AxisTitles(
74                sideTitles: SideTitles(showTitles: false)),
75          ),
76          borderData: FlBorderData(show: false),
77          minX: 0,
78          maxX: (dataPoints.length - 1).toDouble(),
79          minY: 0,
80          maxY: maxY,
81          lineBarsData: [
82            LineChartBarData(
83              spots: spots,
84              isCurved: true,
85              color: lineColor,
86              barWidth: 2.5,
87              dotData: const FlDotData(show: false),
88              belowBarData: BarAreaData(
89                show: true,
90                color: lineColor.withOpacity(0.1),
91              ),
92            ),
93          ],
94          lineTouchData: LineTouchData(
95            touchTooltipData: LineTouchTooltipData(
96              getTooltipItems: (spots) => spots
97                  .map((s) => LineTooltipItem(
98                        '\$${s.y.toStringAsFixed(2)}',
99                        const TextStyle(
100                            color: Colors.white,
101                            fontWeight: FontWeight.bold),
102                      ))
103                  .toList(),
104            ),
105          ),
106        ),
107      ),
108    );
109  }
110}

1// Firebase Cloud Function: aggregateMetrics
2// Scheduled: daily at midnight
3// exports.aggregateMetrics = functions.pubsub
4//   .schedule('0 0 * * *').onRun(async () => { ... })
5
6const functions = require('firebase-functions');
7const admin = require('firebase-admin');
8
9exports.aggregateMetrics = functions.pubsub
10  .schedule('0 0 * * *')
11  .onRun(async () => {
12    const db = admin.firestore();
13    const today = new Date();
14    today.setHours(0, 0, 0, 0);
15    const dateStr = today.toISOString().split('T')[0];
16
17    // Aggregate raw events for today
18    const eventsSnap = await db.collection('events')
19      .where('createdAt', '>=', today)
20      .get();
21
22    let totalOrders = 0, totalRevenue = 0, newUsers = 0;
23    eventsSnap.forEach(doc => {
24      const d = doc.data();
25      if (d.type === 'order_completed') {
26        totalOrders++;
27        totalRevenue += d.amount || 0;
28      }
29      if (d.type === 'user_signup') newUsers++;
30    });
31
32    // Write daily metrics document
33    await db.collection('metrics').doc(dateStr).set({
34      totalOrders, totalRevenue, newUsers,
35      date: dateStr,
36      updatedAt: admin.firestore.FieldValue.serverTimestamp(),
37    }, { merge: true });
38
39    // Update rolling summary
40    const last30 = await db.collection('metrics')
41      .orderBy('__name__', 'desc').limit(30).get();
42    let last30Revenue = 0;
43    last30.forEach(d => { last30Revenue += d.data().totalRevenue || 0; });
44
45    await db.collection('metrics_summary').doc('current').set({
46      last30DaysRevenue: last30Revenue,
47      updatedAt: admin.firestore.FieldValue.serverTimestamp(),
48    }, { merge: true });
49
50    return null;
51  });