Update app.py

app.py

@@ -1441,7 +1441,7 @@ setTimeout(() => {
 """, unsafe_allow_html=True)
 
 #bloob line
-def ascii_sparkline_pln(data):
+def sparkline_trend_pln(data):
     if not data or len(data) == 0:
         return "<span class='spark' style='color:#999;'>—</span>"
     
@@ -1449,9 +1449,29 @@ def ascii_sparkline_pln(data):
         data = [float(x) for x in data]
         n = len(data)
         if n == 1:
-            return "<span class='spark' style='color:#003DA5;'>•</span>"
+            return "<span class='spark' style='color:#666;'>•</span>"
+
+        # Hitung slope linear (regresi sederhana: y = a + b*x)
+        # b = slope → menentukan warna
+        xs = list(range(n))
+        x_mean = sum(xs) / n
+        y_mean = sum(data) / n
+        numerator = sum((x - x_mean) * (y - y_mean) for x, y in zip(xs, data))
+        denominator = sum((x - x_mean) ** 2 for x in xs)
+        slope = numerator / (denominator + 1e-12)  # hindari div-0
+
+        # Tentukan warna berdasarkan slope
+        if slope > 0.001:
+            color = "#2E7D32"  # Hijau gelap (material green 800) — improvement
+            label = "↑"
+        elif slope < -0.001:
+            color = "#C62828"  # Merah gelap (material red 800) — worsening
+            label = "↓"
+        else:
+            color = "#546E7A"  # Abu-abu biru (material blue-gray 600) — flat
+            label = "→"
 
-        # Normalisasi ke [0, 10] dalam tinggi 16px (y terbalik: 0=top, 16=bottom)
+        # Normalisasi y ke [margin, height-margin]
         min_y, max_y = min(data), max(data)
         height = 16
         margin = 2
@@ -1465,16 +1485,20 @@ def ascii_sparkline_pln(data):
                 for v in data
             ]
 
-        # Buat koordinat polyline: x = 0, 8, 16, ... (jarak 8px per titik)
+        # Koordinat polyline (jarak horizontal: 8px per titik)
         points = " ".join(f"{i * 8},{y:.1f}" for i, y in enumerate(y_coords))
         width = max(24, (n - 1) * 8 + 4)
 
+        # SVG dengan garis + panah kecil di akhir (opsional)
         svg = (
-            f'<svg class="sparkline" width="{width}" height="{height}" '
-            f'viewBox="-2 0 {width} {height}" style="vertical-align:middle" '
+            f'<svg class="sparkline" width="{width + 6}" height="{height}" '
+            f'viewBox="-2 0 {width + 6} {height}" style="vertical-align:middle" '
             f'xmlns="http://www.w3.org/2000/svg">'
-            f'<polyline points="{points}" fill="none" stroke="#003DA5" '
-            f'stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>'
+            f'<polyline points="{points}" fill="none" stroke="{color}" '
+            f'stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>'
+            # Opsional: panah kecil di ujung (hanya jika cukup lebar)
+            f'<text x="{(n-1)*8 + 2}" y="14" font-size="10" fill="{color}" '
+            f'dominant-baseline="middle">{label}</text>'
             f'</svg>'
         )
         return svg