eletrotupi / tcc/ frontend/components/insights/EnergySleepWidget.tsx5b0a5a6cf15017c93e1dd78af7d46e7eb1c3f262
2.0 KB | 79 lines Raw
1
import React from "react";
2
import { StyleSheet, ActivityIndicator } from "react-native";
3
import { Text } from "@/components/ui/Text";
4
import { Card } from "@/components/ui/Cards";
5
import { useInsight } from "@/hooks/useInsights.queries";
6
import { Spacing, Typography, Colors } from "@/constants/theme";
7
import { InsightCard, MetricAccent } from "./InsightCard";
8

9
export const EnergySleepWidget: React.FC = () => {
10
  const { data: insight, isLoading } = useInsight("ENERGY_SLEEP_CORRELATION");
11

12
  if (isLoading) {
13
    return (
14
      <Card style={styles.container}>
15
        <ActivityIndicator />
16
      </Card>
17
    );
18
  }
19

20
  if (!insight) {
21
    return (
22
      <InsightCard
23
        category="Energia"
24
        body={
25
          <Text style={styles.empty}>
26
            Registre sono e humor para ver correlações.
27
          </Text>
28
        }
29
        accent="neutral"
30
        metric="—"
31
      />
32
    );
33
  }
34

35
  const meta = insight.metadata as { correlationScore: number; sampleSize: number };
36
  const { label, accent } = resolveCorrelation(meta.correlationScore, meta.sampleSize);
37

38
  return (
39
    <InsightCard
40
      category="Energia"
41
      body={insight.body}
42
      metric={label}
43
      accent={accent}
44
      footnote="Correlação de Pearson entre horas de sono e energia no dia seguinte."
45
    />
46
  );
47
};
48

49
function resolveCorrelation(
50
  score: number,
51
  sampleSize: number,
52
): { label: string; accent: MetricAccent } {
53
  const lowData = sampleSize < 5;
54
  const suffix = lowData ? "*" : "";
55

56
  if (score > 0.6)
57
    return { label: `Forte${suffix}`, accent: "green" };
58
  if (score > 0.3)
59
    return { label: `Moderada${suffix}`, accent: "green" };
60
  if (score >= -0.3)
61
    return { label: `Nenhuma${suffix}`, accent: "neutral" };
62

63
  return { label: `—`, accent: "purple" };
64
}
65

66
const styles = StyleSheet.create({
67
  container: {
68
    flex: 1,
69
    padding: Spacing.cardGap,
70
  },
71
  label: {
72
    ...Typography.labelSm,
73
    opacity: 0.6,
74
  },
75
  empty: {
76
    color: Colors.light.lightSlateGray,
77
    marginTop: 4,
78
  },
79
});