global: snapshot part 5

website/scripts/options/distribution/activity.js

@@ -171,7 +171,7 @@ function singleSellSideRiskTree(sellSideRisk, title) {
     ...ROLLING_WINDOWS.map((w) => ({
       name: w.name,
       title: title(`Sell Side Risk (${w.title})`),
-      bottom: percentRatio({ pattern: sellSideRisk[w.key], name: "Risk" }),
+      bottom: percentRatio({ pattern: sellSideRisk[w.key], name: "Risk", color: w.color }),
     })),
   ];
 }

website/scripts/options/network.js

@@ -377,40 +377,35 @@ export function createNetworkSection() {
             name: "Count",
             tree: [
               {
-                name: "Sums",
-                tree: [
-                  {
-                    name: "Compare",
-                    title: "Block Count",
-                    bottom: ROLLING_WINDOWS.map((w) =>
-                      line({
-                        series: blocks.count.total.sum[w.key],
-                        name: w.name,
-                        color: w.color,
-                        unit: Unit.count,
-                      }),
-                    ),
-                  },
-                  ...ROLLING_WINDOWS.map((w) => ({
+                name: "Compare",
+                title: "Block Count",
+                bottom: ROLLING_WINDOWS.map((w) =>
+                  line({
+                    series: blocks.count.total.sum[w.key],
                     name: w.name,
-                    title: `Block Count ${w.title} Sum`,
-                    bottom: [
-                      line({
-                        series: blocks.count.total.sum[w.key],
-                        name: "Actual",
-                        unit: Unit.count,
-                      }),
-                      line({
-                        series: blocks.count.target[w.key],
-                        name: "Target",
-                        color: colors.gray,
-                        unit: Unit.count,
-                        options: { lineStyle: 4 },
-                      }),
-                    ],
-                  })),
-                ],
+                    color: w.color,
+                    unit: Unit.count,
+                  }),
+                ),
               },
+              ...ROLLING_WINDOWS.map((w) => ({
+                name: w.name,
+                title: `Block Count ${w.title}`,
+                bottom: [
+                  line({
+                    series: blocks.count.total.sum[w.key],
+                    name: "Actual",
+                    unit: Unit.count,
+                  }),
+                  line({
+                    series: blocks.count.target[w.key],
+                    name: "Target",
+                    color: colors.gray,
+                    unit: Unit.count,
+                    options: { lineStyle: 4 },
+                  }),
+                ],
+              })),
               {
                 name: "Cumulative",
                 title: "Block Count (Total)",

website/scripts/options/series.js

@@ -93,55 +93,13 @@ export function price({
 function percentileSeries({ pattern, unit, title = "" }) {
   const { stat } = colors;
   return [
-    dots({
-      series: pattern.max,
-      name: `${title} max`.trim(),
-      color: stat.max,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.min,
-      name: `${title} min`.trim(),
-      color: stat.min,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.median,
-      name: `${title} median`.trim(),
-      color: stat.median,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.pct75,
-      name: `${title} pct75`.trim(),
-      color: stat.pct75,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.pct25,
-      name: `${title} pct25`.trim(),
-      color: stat.pct25,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.pct90,
-      name: `${title} pct90`.trim(),
-      color: stat.pct90,
-      unit,
-      defaultActive: false,
-    }),
-    dots({
-      series: pattern.pct10,
-      name: `${title} pct10`.trim(),
-      color: stat.pct10,
-      unit,
-      defaultActive: false,
-    }),
+    line({ series: pattern.max, name: `${title} max`.trim(), color: stat.max, unit }),
+    line({ series: pattern.pct90, name: `${title} pct90`.trim(), color: stat.pct90, unit }),
+    line({ series: pattern.pct75, name: `${title} pct75`.trim(), color: stat.pct75, unit }),
+    line({ series: pattern.median, name: `${title} median`.trim(), color: stat.median, unit }),
+    line({ series: pattern.pct25, name: `${title} pct25`.trim(), color: stat.pct25, unit }),
+    line({ series: pattern.pct10, name: `${title} pct10`.trim(), color: stat.pct10, unit }),
+    line({ series: pattern.min, name: `${title} min`.trim(), color: stat.min, unit }),
   ];
 }
 
@@ -517,6 +475,59 @@ export function sumsArray({ windows, title, unit }) {
   }));
 }
 
+/**
+ * Generic helper: compare + per-window sum+avg + cumulative.
+ * @template P
+ * @param {Object} args
+ * @param {{ _24h: P, _1w: P, _1m: P, _1y: P }} args.sum
+ * @param {{ _24h: P, _1w: P, _1m: P, _1y: P }} args.average
+ * @param {P} args.cumulative
+ * @param {string} args.title
+ * @param {Color} [args.color]
+ * @param {(args: { pattern: P, name: string, color?: Color, defaultActive?: boolean }) => AnyFetchedSeriesBlueprint[]} args.series
+ * @returns {PartialChartOption[]}
+ */
+export function sumsAndAveragesCumulativeWith({
+  sum,
+  average,
+  cumulative,
+  title,
+  color,
+  series,
+}) {
+  return [
+    {
+      name: "Compare",
+      title: `${title} Averages`,
+      bottom: ROLLING_WINDOWS.flatMap((w) =>
+        series({
+          pattern: average[w.key],
+          name: w.name,
+          color: w.color,
+        }),
+      ),
+    },
+    ...ROLLING_WINDOWS.map((w) => ({
+      name: w.name,
+      title: `${title} ${w.title}`,
+      bottom: [
+        ...series({ pattern: sum[w.key], name: "Sum", color: w.color }),
+        ...series({
+          pattern: average[w.key],
+          name: "Avg",
+          color: w.color,
+          defaultActive: false,
+        }),
+      ],
+    })),
+    {
+      name: "Cumulative",
+      title: `${title} (Total)`,
+      bottom: series({ pattern: cumulative, name: "all-time", color }),
+    },
+  ];
+}
+
 /**
  * Flat array of per-window charts with both sum (active) and average (off by default)
  * @param {Object} args
@@ -544,7 +555,7 @@ export function sumsAndAveragesArray({ sum, average, title, unit }) {
 }
 
 /**
- * Windowed sum+avg charts + cumulative
+ * Compare + windowed sum+avg + cumulative (single unit)
  * @param {Object} args
  * @param {{ _24h: AnySeriesPattern, _1w: AnySeriesPattern, _1m: AnySeriesPattern, _1y: AnySeriesPattern }} args.sum
  * @param {{ _24h: AnySeriesPattern, _1w: AnySeriesPattern, _1m: AnySeriesPattern, _1y: AnySeriesPattern }} args.average
@@ -555,21 +566,16 @@ export function sumsAndAveragesArray({ sum, average, title, unit }) {
  * @returns {PartialChartOption[]}
  */
 export function sumsAndAveragesCumulative({ sum, average, cumulative, title, unit, color }) {
-  return [
-    {
-      name: "Compare",
-      title: `${title} Averages`,
-      bottom: ROLLING_WINDOWS.map((w) =>
-        line({ series: average[w.key], name: w.name, color: w.color, unit }),
-      ),
-    },
-    ...sumsAndAveragesArray({ sum, average, title, unit }),
-    {
-      name: "Cumulative",
-      title: `${title} (Total)`,
-      bottom: [{ series: cumulative, title: "all-time", color, unit }],
-    },
-  ];
+  return sumsAndAveragesCumulativeWith({
+    sum,
+    average,
+    cumulative,
+    title,
+    color,
+    series: ({ pattern, name, color, defaultActive }) => [
+      line({ series: pattern, name, color, unit, defaultActive }),
+    ],
+  });
 }
 
 /**
@@ -601,13 +607,22 @@ export function sumsTree({ windows, title, unit, series }) {
  * @returns {PartialChartOption[]}
  */
 export function averagesArray({ windows, title, unit }) {
-  return ROLLING_WINDOWS.map((w) => ({
-    name: w.name,
-    title: `${title} ${w.title} Average`,
-    bottom: [
-      line({ series: windows[w.key], name: w.name, color: w.color, unit }),
-    ],
-  }));
+  return [
+    {
+      name: "Compare",
+      title: `${title} Averages`,
+      bottom: ROLLING_WINDOWS.map((w) =>
+        line({ series: windows[w.key], name: w.name, color: w.color, unit }),
+      ),
+    },
+    ...ROLLING_WINDOWS.map((w) => ({
+      name: w.name,
+      title: `${title} ${w.title} Average`,
+      bottom: [
+        line({ series: windows[w.key], name: w.name, color: w.color, unit }),
+      ],
+    })),
+  ];
 }
 
 /**
@@ -621,7 +636,7 @@ export function averagesArray({ windows, title, unit }) {
  */
 export function distributionWindowsTree({ pattern, base, title, unit }) {
   return {
-    name: "Distributions",
+    name: "Distribution",
     tree: [
       {
         name: "Compare",

website/scripts/options/shared.js

@@ -1,7 +1,7 @@
 /** Shared helpers for options */
 
 import { Unit } from "../utils/units.js";
-import { line, baseline, price, ROLLING_WINDOWS } from "./series.js";
+import { line, baseline, price, sumsAndAveragesCumulativeWith } from "./series.js";
 import { priceLine, priceLines } from "./constants.js";
 import { colors } from "../utils/colors.js";
 
@@ -224,45 +224,15 @@ export function satsBtcUsdRolling({ pattern, name, color, defaultActive }) {
  * @returns {PartialOptionsTree}
  */
 export function satsBtcUsdFullTree({ pattern, title, color }) {
-  return [
-    {
-      name: "Compare",
-      title: `${title} Average`,
-      bottom: ROLLING_WINDOWS.flatMap((w) =>
-        satsBtcUsd({
-          pattern: pattern.average[w.key],
-          name: w.name,
-          color: w.color,
-        }),
-      ),
-    },
-    ...ROLLING_WINDOWS.map((w) => ({
-      name: w.name,
-      title: `${title} ${w.title}`,
-      bottom: [
-        ...satsBtcUsd({
-          pattern: pattern.sum[w.key],
-          name: "Sum",
-          color: w.color,
-        }),
-        ...satsBtcUsd({
-          pattern: pattern.average[w.key],
-          name: "Avg",
-          color: w.color,
-          defaultActive: false,
-        }),
-      ],
-    })),
-    {
-      name: "Cumulative",
-      title: `${title} (Total)`,
-      bottom: satsBtcUsd({
-        pattern: pattern.cumulative,
-        name: "all-time",
-        color,
-      }),
-    },
-  ];
+  return sumsAndAveragesCumulativeWith({
+    sum: pattern.sum,
+    average: pattern.average,
+    cumulative: pattern.cumulative,
+    title,
+    color,
+    series: ({ pattern, name, color, defaultActive }) =>
+      satsBtcUsd({ pattern, name, color, defaultActive }),
+  });
 }
 
 /**