feat(constellations) : add infographic image export

lib/guides/export-image.ts

@@ -10,3 +10,33 @@ export function imageContentDisposition(displayName: string, fallbackName: strin
   );
   return `attachment; filename="${fallback}.png"; filename*=UTF-8''${encoded}`;
 }
+
+export interface ConstellationChartRow {
+  level: number;
+  percent: number;
+  isGreat: boolean;
+  widthPercent: number;
+}
+
+export function constellationChartRows(
+  rows: ReadonlyArray<{
+    level: number;
+    cumulativePercent: string;
+    isGreat: boolean;
+  }>,
+): ConstellationChartRow[] {
+  const values = [
+    ...rows.map((row) => ({
+      level: row.level,
+      percent: Number(row.cumulativePercent),
+      isGreat: row.isGreat,
+    })),
+    { level: 0, percent: 100, isGreat: false },
+  ].sort((left, right) => right.level - left.level);
+  const maximum = Math.max(100, ...values.map((row) => row.percent));
+
+  return values.map((row) => ({
+    ...row,
+    widthPercent: Math.max(0, Math.min(100, (row.percent / maximum) * 100)),
+  }));
+}