fix(fe): save numeric range filter when saving view

fix(fe): save numeric range filter when saving view

packages/frontend-2/lib/viewer/composables/filtering/filtering.ts

@@ -25,7 +25,8 @@ import {
   SortMode,
   type DataSlice,
   type QueryCriteria,
-  type ExtendedPropertyInfo
+  type ExtendedPropertyInfo,
+  type SerializedFilterData
 } from '~/lib/viewer/helpers/filters/types'
 import { getConditionLabel } from '~/lib/viewer/helpers/filters/constants'
 import { useFilteringDataStore } from '~/lib/viewer/composables/filtering/dataStore'
@@ -705,13 +706,7 @@ export function useFilterUtilities(
 
   // Store filters that need to be restored once data store is ready
   const pendingFiltersToRestore = ref<{
-    filters: Array<{
-      key: string | null
-      isApplied: boolean
-      selectedValues: string[]
-      id: string
-      condition: FilterCondition
-    }>
+    filters: SerializedFilterData[]
     activeColorFilterId: string | null
     filterLogic?: FilterLogic
   } | null>(null)
@@ -720,13 +715,7 @@ export function useFilterUtilities(
    * Restores filters from serialized state
    */
   const restoreFilters = async (
-    serializedFilters: Array<{
-      key: string | null
-      isApplied: boolean
-      selectedValues: string[]
-      id: string
-      condition: FilterCondition
-    }>,
+    serializedFilters: SerializedFilterData[],
     activeColorFilterId: string | null,
     filterLogic?: FilterLogic
   ) => {
@@ -764,13 +753,7 @@ export function useFilterUtilities(
    * Actually applies the filters once we have the property data
    */
   const applyFiltersFromSerialized = (
-    serializedFilters: Array<{
-      key: string | null
-      isApplied: boolean
-      selectedValues: string[]
-      id: string
-      condition: FilterCondition
-    }>,
+    serializedFilters: SerializedFilterData[],
     availableProperties: ExtendedPropertyInfo[]
   ) => {
     for (const serializedFilter of serializedFilters) {
@@ -787,6 +770,14 @@ export function useFilterUtilities(
             updateActiveFilterValues(filterId, serializedFilter.selectedValues)
           }
 
+          if (serializedFilter.numericRange) {
+            setNumericRange(
+              filterId,
+              serializedFilter.numericRange.min,
+              serializedFilter.numericRange.max
+            )
+          }
+
           if (!serializedFilter.isApplied) {
             toggleFilterApplied(filterId)
           }

packages/frontend-2/lib/viewer/composables/serialization.ts

@@ -13,7 +13,10 @@ import {
 import { useFilterUtilities } from '~/lib/viewer/composables/filtering/filtering'
 import { useFilteringDataStore } from '~/lib/viewer/composables/filtering/dataStore'
 import { CameraController, SectionTool, VisualDiffMode } from '@speckle/viewer'
-import type { FilterLogic, FilterCondition } from '~/lib/viewer/helpers/filters/types'
+import type {
+  FilterLogic,
+  SerializedFilterData
+} from '~/lib/viewer/helpers/filters/types'
 import type { Merge, PartialDeep } from 'type-fest'
 import {
   defaultMeasurementOptions,
@@ -97,7 +100,9 @@ export function useStateSerialization() {
             isApplied: filterData.isApplied,
             selectedValues: filterData.selectedValues,
             id: filterData.id,
-            condition: filterData.condition
+            condition: filterData.condition,
+            numericRange:
+              filterData.type === 'numeric' ? filterData.numericRange : undefined
           }))
 
           return {
@@ -298,13 +303,7 @@ export function useApplySerializedState() {
 
     if (filters.propertyFilters?.length) {
       restoreFilters(
-        filters.propertyFilters as Array<{
-          key: string | null
-          isApplied: boolean
-          selectedValues: string[]
-          id: string
-          condition: FilterCondition
-        }>,
+        filters.propertyFilters as SerializedFilterData[],
         filters.activeColorFilterId,
         filters.filterLogic as FilterLogic
       )

packages/frontend-2/lib/viewer/helpers/filters/types.ts

@@ -215,3 +215,12 @@ export type ColorGroup = {
   value: string
   color: string
 }
+
+export type SerializedFilterData = {
+  key: Nullable<string>
+  isApplied: boolean
+  selectedValues: string[]
+  id: string
+  condition: FilterCondition
+  numericRange?: { min: number; max: number }
+}

packages/shared/src/viewer/helpers/state.ts

@@ -69,8 +69,10 @@ export interface SectionBoxData {
  * v1.6 -> 1.7
  * - ui.filters.filterLogic added
  * - ui.filters.propertyFilters.condition updated
+ * v1.7 -> 1.8
+ * - ui.filters.propertyFilters.numericRange added
  */
-export const SERIALIZED_VIEWER_STATE_VERSION = 1.7
+export const SERIALIZED_VIEWER_STATE_VERSION = 1.8
 
 export type SerializedViewerState = {
   projectId: string
@@ -117,6 +119,7 @@ export type SerializedViewerState = {
         selectedValues: string[]
         id: string
         condition: string
+        numericRange?: { min: number; max: number }
       }>
       activeColorFilterId: Nullable<string>
       filterLogic: string
@@ -283,6 +286,7 @@ const initializeMissingData = (state: UnformattedState): SerializedViewerState =
           selectedValues: string[]
           id: string
           condition: string
+          numericRange?: { min: number; max: number }
         }> = []
 
         // If new propertyFilters exist and are not empty, use them