Show dashboard numbers with commas for readability

html.go

@@ -11,6 +11,7 @@ import (
 	"log/slog"
 	"net/http"
 	"os"
+	"strconv"
 	"strings"
 	"time"
 
@@ -112,6 +113,22 @@ func (bt *BuiltTemplate) ExecuteTemplate(w io.Writer, data any) error {
 	}
 }
 
+func bigNumber(n int) string {
+	// Convert the number to a string
+	numStr := strconv.FormatInt(int64(n), 10)
+
+	// Add commas every three digits from the right
+	var result strings.Builder
+	for i, char := range numStr {
+		if i > 0 && (len(numStr)-i)%3 == 0 {
+			result.WriteByte(',')
+		}
+		result.WriteRune(char)
+	}
+
+	return result.String()
+}
+
 func extractInitials(name string) string {
 	parts := strings.Fields(name)
 	var initials strings.Builder
@@ -321,6 +338,7 @@ func htmlSignup(w http.ResponseWriter, path string) {
 
 func makeFuncMap() template.FuncMap {
 	funcMap := template.FuncMap{
+		"bigNumber":   bigNumber,
 		"timeElapsed": timeElapsed,
 		"timeSince":   timeSince,
 	}

templates/dashboard.html

@@ -99,7 +99,7 @@ body {
 						<i class="fas fa-ticket-alt"></i>
 					</div>
 					<h5 class="card-title">Service Requests</h5>
-					<p class="metric-value">{{ .CountServiceRequests }}</p>
+					<p class="metric-value">{{ .CountServiceRequests | bigNumber }}</p>
 					<p class="card-text text-muted">
 						<span class="text-success">
 							<i class="fas fa-arrow-up"></i> 12%
@@ -117,7 +117,7 @@ body {
 						<i class="fas fa-bug"></i>
 					</div>
 					<h5 class="card-title">Mosquito Sources</h5>
-					<p class="metric-value">{{ .CountMosquitoSources }}</p>
+					<p class="metric-value">{{ .CountMosquitoSources | bigNumber }}</p>
 					<p class="card-text text-muted">
 						<span class="text-danger">
 							<i class="fas fa-arrow-up"></i> 8%
@@ -135,7 +135,7 @@ body {
 						<i class="fas fa-clipboard-check"></i>
 					</div>
 					<h5 class="card-title">Inspections</h5>
-					<p class="metric-value">{{ .CountInspections }}</p>
+					<p class="metric-value">{{ .CountInspections | bigNumber }}</p>
 					<p class="card-text text-muted">
 						<span class="text-success">
 							<i class="fas fa-arrow-up"></i> 15%