fix(catalogue): fix sorting of sources in variable harmonization deta…

…ils view

Closes #4792

apps/catalogue/components/harmonisation/HarmonisationGridPerVariable.vue

@@ -17,7 +17,11 @@ const relevantMappings = computed(() =>
   )
 );
 const sourceIds = computed(() => [
-  ...new Set(relevantMappings.value?.map((mapping) => mapping.source.id)),
+  ...new Set(
+    relevantMappings.value
+      ?.map((mapping) => mapping.source.id)
+      .sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))
+  ),
 ]);
 const repeats = computed(() => {
   const min = props.variable.repeatMin | 0;

apps/catalogue/components/harmonisation/HarmonisationTable.vue

@@ -35,7 +35,11 @@ let activeVariablePath = computed(() =>
     <HarmonisationLegendMatrix size="small" />
     <div class="overflow-x-auto xl:max-w-table border-t">
       <TableSticky
-        :columns="resources"
+        :columns="
+          resources.sort((a, b) =>
+            a.id.toLowerCase().localeCompare(b.id.toLowerCase())
+          )
+        "
         :rows="variables"
         class="h-screen overflow-auto"
       >

apps/catalogue/components/harmonisation/VariableDetails.vue

@@ -17,13 +17,17 @@ const relevantMappings = computed(() =>
   )
 );
 const sourceIds = computed(() => [
-  ...new Set(relevantMappings.value?.map((m) => m.source.id)),
+  ...new Set(
+    relevantMappings.value
+      ?.map((m) => m.source.id)
+      .sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))
+  ),
 ]);
 const activeSource = computed(() => sourceIds.value[activeTabIndex.value]);
 const activeMappings = computed(() =>
   relevantMappings.value
     ?.filter((m) => m.source.id === activeSource.value)
-    .sort((a, b) => a.repeats - b.repeats)
+    .sort((a, b) => Number(a.repeats) - Number(b.repeats))
 );
 let activeVariableUsedKey = ref();
 let showSidePanel = computed(() => activeVariableUsedKey.value?.name);