From 787554675f98eb7d1f0d6bf91b0419c5f2e51e36 Mon Sep 17 00:00:00 2001
From: "Calum H. (IMB11)" <contact@cal.engineer>
Date: Mon, 5 Jan 2026 18:28:09 -0500
Subject: [PATCH] fix: broken analytics pages

---
 .../src/components/ui/charts/Chart.client.vue       |  2 +-
 .../components/ui/charts/CompactChart.client.vue    |  7 ++++---
 apps/frontend/src/utils/analytics.js                | 13 ++++++++++---
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/apps/frontend/src/components/ui/charts/Chart.client.vue b/apps/frontend/src/components/ui/charts/Chart.client.vue
index 2c1104c86c..ad3e6b2a2f 100644
--- a/apps/frontend/src/components/ui/charts/Chart.client.vue
+++ b/apps/frontend/src/components/ui/charts/Chart.client.vue
@@ -286,7 +286,7 @@ const flipLegend = (legend, newVal) => {
 }
 
 const resetChart = () => {
-	if (!chart.value) return
+	if (!chart.value?.chart) return
 	chart.value.updateSeries([...props.data])
 	chart.value.updateOptions({
 		xaxis: {
diff --git a/apps/frontend/src/components/ui/charts/CompactChart.client.vue b/apps/frontend/src/components/ui/charts/CompactChart.client.vue
index 6a86ec2e95..1a76864196 100644
--- a/apps/frontend/src/components/ui/charts/CompactChart.client.vue
+++ b/apps/frontend/src/components/ui/charts/CompactChart.client.vue
@@ -125,13 +125,14 @@ const chartOptions = {
 const chart = ref(null)
 
 const resetChart = () => {
-	chart.value?.updateSeries([...props.data])
-	chart.value?.updateOptions({
+	if (!chart.value?.chart) return
+	chart.value.updateSeries([...props.data])
+	chart.value.updateOptions({
 		xaxis: {
 			categories: props.labels,
 		},
 	})
-	chart.value?.resetSeries()
+	chart.value.resetSeries()
 }
 
 defineExpose({
diff --git a/apps/frontend/src/utils/analytics.js b/apps/frontend/src/utils/analytics.js
index a8833424ad..cf933a6952 100644
--- a/apps/frontend/src/utils/analytics.js
+++ b/apps/frontend/src/utils/analytics.js
@@ -1,5 +1,6 @@
 import dayjs from 'dayjs'
 import { computed, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
 
 // note: build step can miss unix import for some reason, so
 // we have to import it like this
@@ -7,10 +8,16 @@ import { computed, ref, watch } from 'vue'
 const { unix } = dayjs
 
 export function useCountryNames(style = 'long') {
-	const formattingOptions = { type: 'region', style }
-	const { formats } = useVIntl()
+	const { locale } = useI18n()
+	const displayNames = computed(
+		() => new Intl.DisplayNames([locale.value], { type: 'region', style }),
+	)
 	return function formatCountryName(code) {
-		return formats.displayName(code, formattingOptions)
+		try {
+			return displayNames.value.of(code) ?? code
+		} catch {
+			return code
+		}
 	}
 }