Slightly nicer formatting

Author: lpil

src/packages/web/page.gleam

@@ -24,21 +24,36 @@ pub fn packages_list(
 }
 
 pub fn internet_points(stats: storage.InternetPoints) -> String {
-  let count_list = fn(rows) {
-    rows
-    |> list.take(50)
-    |> list.map(fn(row) {
-      let #(name, count) = row
-      html.li([], [html.text(name <> ": " <> int.to_string(count))])
-    })
-    |> html.ol([], _)
+  let count_table = fn(rows) {
+    let rows =
+      rows
+      |> list.take(50)
+      |> list.index_map(fn(row, index) {
+        let #(name, count) = row
+        let count =
+          int.to_string(count)
+          |> string.to_graphemes
+          |> list.reverse
+          |> list.sized_chunk(3)
+          |> list.intersperse([","])
+          |> list.flatten
+          |> list.reverse
+          |> string.concat
+        html.tr([], [
+          html.td([], [html.text(int.to_string(index + 1) <> ".")]),
+          html.td([], [html.text(name)]),
+          html.td([], [html.text(count)]),
+        ])
+      })
+
+    html.table([], rows)
   }
 
   html.div([], [
     html.h2([], [html.text("Package owners total downloads")]),
-    count_list(stats.owner_download_counts),
+    count_table(stats.owner_download_counts),
     html.h2([], [html.text("Package owners number of packages")]),
-    count_list(stats.owner_package_counts),
+    count_table(stats.owner_package_counts),
     html.script([attribute.src("https://cdn.plot.ly/plotly-2.30.0.min.js")], ""),
     line_chart("Package count", stats.package_counts),
     line_chart("Release count", stats.release_counts),