From 1ccdb1c7eae89c99e830a93bb9cd67fa17900415 Mon Sep 17 00:00:00 2001
From: andrewwallacespeckle <andrew@speckle.systems>
Date: Tue, 23 Sep 2025 15:47:14 +0200
Subject: [PATCH] chore(fe): upgrade to measurements extension

---
 .../frontend-2/components/viewer/measurements/Menu.vue    | 8 ++++----
 packages/frontend-2/lib/viewer/composables/ui.ts          | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/frontend-2/components/viewer/measurements/Menu.vue b/packages/frontend-2/components/viewer/measurements/Menu.vue
index 88b4400e6..7fe259a85 100644
--- a/packages/frontend-2/components/viewer/measurements/Menu.vue
+++ b/packages/frontend-2/components/viewer/measurements/Menu.vue
@@ -21,14 +21,14 @@
         />
       </span>
 
-      <span class="flex items-center pt-2">
+      <span class="flex items-center">
         <FormCheckbox
-          name="Chain Measurements"
+          name="Chain measurements"
           hide-label
           :model-value="measurementOptions.chain"
           @update:model-value="toggleMeasurementsChaining"
         />
-        <label class="text-body-2xs" for="chain">Chain Measurements</label>
+        <span class="text-body-2xs mt-3">Chain measurements</span>
       </span>
 
       <span class="flex items-center pt-1">
@@ -38,7 +38,7 @@
           :model-value="measurementOptions.vertexSnap"
           @update:model-value="toggleMeasurementsSnap"
         />
-        <label class="text-body-2xs" for="snap">Snap to vertices</label>
+        <span class="text-body-2xs mt-3">Snap to vertices</span>
       </span>
     </ViewerLayoutPanel>
     <ViewerLayoutPanel class="mt-1 p-1 pr-2">
diff --git a/packages/frontend-2/lib/viewer/composables/ui.ts b/packages/frontend-2/lib/viewer/composables/ui.ts
index 959b140d1..995e73e72 100644
--- a/packages/frontend-2/lib/viewer/composables/ui.ts
+++ b/packages/frontend-2/lib/viewer/composables/ui.ts
@@ -1,5 +1,5 @@
 import { SpeckleViewer } from '@speckle/shared'
-import type { TreeNode, ViewMode } from '@speckle/viewer'
+import { MeasurementsExtension, type TreeNode, type ViewMode } from '@speckle/viewer'
 import { until } from '@vueuse/shared'
 import { useActiveElement } from '@vueuse/core'
 import { isString } from 'lodash-es'
@@ -283,6 +283,8 @@ export function useThreadUtilities() {
 
 export function useMeasurementUtilities() {
   const state = useInjectedViewerState()
+  const measurementsExtension =
+    state.viewer.instance.getExtension(MeasurementsExtension)
 
   const measurementOptions = computed(() => state.ui.measurement.options.value)
   const hasMeasurements = computed(
@@ -298,9 +300,7 @@ export function useMeasurementUtilities() {
   }
 
   const removeActiveMeasurement = () => {
-    if (state.viewer.instance?.removeMeasurement) {
-      state.viewer.instance.removeMeasurement()
-    }
+    measurementsExtension.removeMeasurement()
   }
 
   const clearMeasurements = () => {