- Fixed an issue where Obsidian filter components in Simple mode did not render the comparison UI component, resulting in inconsistent behavior with WebForms for certain field types.

Author: maxwelleley

Rock.JavaScript.Obsidian/Framework/Controls/fieldFilterContainer.obs

@@ -29,7 +29,17 @@
     const slots = useSlots();
 
     /** True if the compare column should be displayed. */
-    const hasCompareColumn = computed((): boolean => (!!slots.compare || !!props.compareLabel) && props.filterMode !== FilterMode.SimpleFilter);
+    const hasCompareColumn = computed((): boolean => {
+        if (slots.compare) {
+            return true;
+        }
+
+        if (props.compareLabel) {
+            return props.filterMode !== FilterMode.SimpleFilter;
+        }
+
+        return false;
+    });
 
     /** True if we have a plain text label to display in the compare column. */
     const hasCompareLabel = computed((): boolean => !!props.compareLabel);
@@ -53,7 +63,9 @@
             return "col-xs-12 col-md-8";
         }
         else if (props.compareLabel) {
-            return "col-xs-12 col-md-10";
+            return props.filterMode !== FilterMode.SimpleFilter
+                ? "col-xs-12 col-md-10"
+                : "col-xs-12 col-md-12";
         }
         else {
             return "col-xs-12 col-md-12";

Rock.JavaScript.Obsidian/Framework/FieldTypes/utils.ts

@@ -249,7 +249,6 @@ export function getStandardFilterComponent(comparisonLabelOrTypes: ComparisonTyp
             /** True if the compare component should be visible. */
             const hasCompareComponent = computed(() => {
                 return comparisonTypes !== null
-                    && props.filterMode !== FilterMode.SimpleFilter
                     && !isSingleComparisonType(comparisonTypes)
                     && isCompareVisibleForComparisonFilter(comparisonTypes, props.filterMode);
             });
@@ -280,9 +279,8 @@ export function getStandardFilterComponent(comparisonLabelOrTypes: ComparisonTyp
                     type = comparisonTypes;
                 }
                 else {
-                    // If the filter mode is simple, then the comparison type is
-                    // not shown so we come up with a sane default.
-                    if (props.filterMode === FilterMode.SimpleFilter) {
+                    // If the compare component is not visible, then come up with a sane default.
+                    if (!hasCompareComponent.value) {
                         if (comparisonTypes === binaryComparisonTypes) {
                             type = ComparisonType.EqualTo;
                         }
@@ -294,8 +292,7 @@ export function getStandardFilterComponent(comparisonLabelOrTypes: ComparisonTyp
                         }
                     }
                     else {
-                        // Get the comparison type selected by the user if we are
-                        // in advanced mode.
+                        // When the compare component is visible, get the comparison type selected by the user.
                         type = toNumberOrNull(internalComparisonType.value);
                     }
                 }