Agent-Field
diff --git a/‎.gitignore‎
Lines changed: 1 addition & 0 deletions b/‎.gitignore‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎control-plane/cmd/af-tray/assets/icons/LICENSE.md‎
Lines changed: 9 additions & 0 deletions b/‎control-plane/cmd/af-tray/assets/icons/LICENSE.md‎
Lines changed: 9 additions & 0 deletions
diff --git a/‎control-plane/cmd/af-tray/assets/icons/chart-column.png‎
166 Bytes b/‎control-plane/cmd/af-tray/assets/icons/chart-column.png‎
166 Bytes
diff --git a/‎control-plane/cmd/af-tray/chart_render.go‎
Lines changed: 183 additions & 0 deletions b/‎control-plane/cmd/af-tray/chart_render.go‎
Lines changed: 183 additions & 0 deletions
@@ -27,6 +27,7 @@ examples/go_agent_nodes/multi_version
 control-plane/agentfield-server
 control-plane/af
 control-plane/af-tray
+control-plane/cmd/af-tray/af-tray
 scripts/lambda-rie-fake/lambda-rie-fake
 
 # Python
 
@@ -14,3 +14,12 @@ They are rendered to 32×32 PNG (16pt @2x) as black-on-transparent template
 images so macOS recolors them to match the menu (light/dark).
 
 dot-green / dot-red / dot-gray are original status indicators.
+
+chart-column is an original column-chart glyph (drawn in the same
+black-on-transparent template style as the Lucide line icons) used for the
+Usage section.
+
+The tray's rendered images (the stacked chart, share bar, proportional model /
+quota bars, and the menu-bar sparkline widget) are pure graphics and contain no
+embedded-font text; the numbers next to them are native menu / menu-bar text.
+
@@ -0,0 +1,183 @@
+package main
+
+// Text-free image renderer for the Usage submenu's 24h timeline: a compact bucket
+// histogram, stacked by model. It is pure graphics (image/png only, no fonts, no
+// systray/CGO), so it compiles and is unit-tested on Linux CI. The per-model /
+// rollup / quota rows are NOT rendered here — they are native menu-item text
+// titles set by the darwin tray, each paired (models, quota) with a compact bar
+// image from charts.go's slotBarPNG. The darwin tray turns the PNG below into a
+// full-width menu-item image via the vendored systray fork's SetImage.
+//
+// All geometry is expressed in OUTPUT pixels — the 2x-retina PNG the tray hands
+// to SetImage — and multiplied by the supersample factor `ss` for the internal
+// high-res buffer, which is then box-downsampled for crisp bar edges and gaps.
+
+import (
+	"image"
+	"image/color"
+	"math"
+)
+
+// ---- Usage submenu geometry (points) ---------------------------------------
+//
+// The design system: EVERY row in the Usage submenu carries a leading image of
+// exactly the uniform SLOT size, so every native title starts at the same x. Rows
+// with a graphic (model / quota) draw a compact bar inside the slot; rows without
+// one (summary lines, section headers, rollups, footer) get a fully transparent
+// spacer of the same size. The 24h histogram is the one wider, text-free graphic
+// row; its left edge still aligns with the slot, and its first bucket lines up
+// with the compact bars below. These constants live here (cross-platform) so the
+// pure renderers, their tests, and the darwin tray all share one source of truth.
+const (
+	// Uniform leading slot every submenu row carries.
+	usageSlotWidthPt  = 64
+	usageSlotHeightPt = 12
+	// Compact proportional bar drawn inside the slot (model / quota rows),
+	// left-aligned and vertically centered.
+	usageBarWidthPt  = 56
+	usageBarHeightPt = 8
+	// 24h histogram: a full row-content-width (slot + title area), text-free row.
+	usageChartWidthPt  = 200
+	usageChartHeightPt = 28
+)
+
+// ---- Bucket histogram ------------------------------------------------------
+
+// histogram tuning, in OUTPUT pixels (2x retina).
+const (
+	histTopPadPx    = 3 // headroom above the tallest bar so it doesn't touch the top
+	histGapPx       = 1 // gap between adjacent buckets
+	histStubPx      = 1 // baseline stub height for empty buckets
+	histMinNonEmpty = 2 // shortest a nonzero bucket ever draws, so a tiny value shows
+)
+
+// histStubColor is the neutral baseline stub for empty buckets — dim enough not
+// to compete with the accent bars, present enough that the timeline reads as
+// continuous rather than broken around a lone spike.
+var histStubColor = color.NRGBA{grayOther.R, grayOther.G, grayOther.B, 0x59}
+
+// histogramChartPNG renders the usage timeline as a compact bucket histogram: one
+// thin vertical bar per bucket (with 1px gaps), each bar stacking its models
+// bottom-up in the given hues (layers[0] at the bottom). Empty buckets keep a 1px
+// baseline stub so the timeline reads as continuous, which makes a lone spike look
+// like an event on a timeline rather than a broken chart. When series_by_model is
+// absent the caller passes a single layer (single accent hue). layers are
+// per-bucket token counts, all the same length; colors[i] tints layers[i]. It
+// carries no text — the numbers live in the native menu titles around it.
+func histogramChartPNG(layers [][]float64, colors []color.NRGBA, wPx, hPx int) []byte {
+	if wPx <= 0 || hPx <= 0 {
+		return nil
+	}
+	ss := barSupersample
+	s := float64(ss)
+	W, H := wPx*ss, hPx*ss
+	hi := image.NewNRGBA(image.Rect(0, 0, W, H))
+
+	// Plot region. The left edge is flush (x=0) so the first bucket lines up with
+	// the compact model bars in the rows below; the baseline sits on the bottom
+	// edge; only a little headroom is reserved at the top.
+	plotTop := float64(histTopPadPx) * s
+	plotBot := float64(H)
+	if plotBot <= plotTop {
+		plotTop = 0
+	}
+	plotH := plotBot - plotTop
+
+	// Bucket count and the per-bucket stacked total.
+	n := 0
+	for _, l := range layers {
+		if len(l) > n {
+			n = len(l)
+		}
+	}
+	if n == 0 {
+		return encodePNG(downsample(hi, wPx, hPx, ss))
+	}
+	valueAt := func(li, i int) float64 {
+		if li < 0 || li >= len(layers) || i < 0 || i >= len(layers[li]) {
+			return 0
+		}
+		v := layers[li][i]
+		if v < 0 {
+			v = 0
+		}
+		return v
+	}
+	total := func(i int) float64 {
+		sum := 0.0
+		for li := range layers {
+			sum += valueAt(li, i)
+		}
+		return sum
+	}
+	maxTotal := 0.0
+	for i := 0; i < n; i++ {
+		if t := total(i); t > maxTotal {
+			maxTotal = t
+		}
+	}
+
+	stubPx := float64(histStubPx) * s
+	minNonEmpty := float64(histMinNonEmpty) * s
+	gap := float64(histGapPx) * s
+	bucketW := float64(W) / float64(n)
+
+	fillRect := func(x0, x1, y0, y1 float64, c color.NRGBA) {
+		xi0, xi1 := int(math.Round(x0)), int(math.Round(x1))
+		yi0, yi1 := int(math.Round(y0)), int(math.Round(y1))
+		for y := yi0; y < yi1; y++ {
+			if y < 0 || y >= H {
+				continue
+			}
+			for x := xi0; x < xi1; x++ {
+				if x < 0 || x >= W {
+					continue
+				}
+				blendPixel(hi, x, y, c, 1)
+			}
+		}
+	}
+
+	for i := 0; i < n; i++ {
+		xL := float64(i) * bucketW
+		xR := xL + bucketW - gap
+		if xR <= xL {
+			xR = xL + 1
+		}
+
+		t := total(i)
+		if t <= 0 || maxTotal <= 0 {
+			// Empty bucket: a 1px neutral stub on the baseline.
+			fillRect(xL, xR, plotBot-stubPx, plotBot, histStubColor)
+			continue
+		}
+
+		// Bar height for this bucket, floored so a tiny nonzero value still shows.
+		barH := (t / maxTotal) * plotH
+		if barH < minNonEmpty {
+			barH = minNonEmpty
+		}
+		scale := barH / t // pixels per token for this bucket's stack
+
+		bottom := plotBot
+		for li := range layers {
+			v := valueAt(li, i)
+			if v <= 0 {
+				continue
+			}
+			segH := v * scale
+			top := bottom - segH
+			if top < plotTop {
+				top = plotTop
+			}
+			col := grayOther
+			if li < len(colors) {
+				col = colors[li]
+			}
+			fillRect(xL, xR, top, bottom, col)
+			bottom = top
+		}
+	}
+
+	return encodePNG(downsample(hi, wPx, hPx, ss))
+}