merged with master

1 files changed, 16 insertions, 22 deletions

diff --git a/src/client/views/FilterPanel.tsx b/src/client/views/FilterPanel.tsx
index c97edd7f0..2f6d1fbaa 100644
--- a/src/client/views/FilterPanel.tsx
+++ b/src/client/views/FilterPanel.tsx
@@ -1,6 +1,4 @@
 /* eslint-disable react/jsx-props-no-spreading */
-/* eslint-disable jsx-a11y/no-static-element-interactions */
-/* eslint-disable jsx-a11y/click-events-have-key-events */
 import { action, computed, makeObservable, observable, ObservableMap } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
@@ -28,7 +26,7 @@ interface filterProps {
 export class FilterPanel extends ObservableReactComponent<filterProps> {
     @observable _selectedFacetHeaders = new Set<string>();
 
-    constructor(props: any) {
+    constructor(props: filterProps) {
         super(props);
         makeObservable(this);
     }
@@ -41,7 +39,7 @@ export class FilterPanel extends ObservableReactComponent<filterProps> {
     }
     @computed get targetDocChildKey() {
         const targetView = DocumentView.getFirstDocumentView(this.Document);
-        return targetView?.ComponentView?.annotationKey ?? targetView?.ComponentView?.fieldKey ?? 'data';
+        return targetView?.ComponentView?.annotationKey || (targetView?.ComponentView?.fieldKey ?? 'data');
     }
     @computed get targetDocChildren() {
         return [...DocListCast(this.Document?.[this.targetDocChildKey] || Doc.ActiveDashboard?.data), ...DocListCast(this.Document[Doc.LayoutFieldKey(this.Document) + '_sidebar'])];
@@ -194,21 +192,17 @@ export class FilterPanel extends ObservableReactComponent<filterProps> {
         const allCollectionDocs = new Set<Doc>();
         SearchUtil.foreachRecursiveDoc(this.targetDocChildren, (depth: number, doc: Doc) => allCollectionDocs.add(doc));
         const set = new Set<string>([...StrListCast(this.Document.childFilters).map(filter => filter.split(Doc.FilterSep)[1]), Doc.FilterNone, Doc.FilterAny]);
-        if (facetHeader === 'tags')
-            allCollectionDocs.forEach(child =>
-                StrListCast(child[facetHeader])
-                    .filter(h => h)
-                    .forEach(key => set.add(key))
-            );
-        else
-            allCollectionDocs.forEach(child => {
-                const fieldVal = child[facetHeader] as FieldType;
-                if (!(fieldVal instanceof List)) {
-                    // currently we have no good way of filtering based on a field that is a list
-                    set.add(Field.toString(fieldVal));
-                    (fieldVal === true || fieldVal === false) && set.add((!fieldVal).toString());
-                }
-            });
+
+        allCollectionDocs.forEach(child => {
+            const fieldVal = child[facetHeader] as FieldType;
+            const fieldStrList = StrListCast(child[facetHeader]).filter(h => h);
+            if (fieldStrList.length) fieldStrList.forEach(key => set.add(key));
+            else if (!(fieldVal instanceof List)) {
+                // currently we have no good way of filtering based on a field that is a list
+                set.add(Field.toString(fieldVal));
+                (fieldVal === true || fieldVal === false) && set.add((!fieldVal).toString());
+            }
+        });
         const facetValues = Array.from(set).filter(v => v);
 
         let nonNumbers = 0;
@@ -240,7 +234,7 @@ export class FilterPanel extends ObservableReactComponent<filterProps> {
                     {Array.from(this.activeRenderedFacetInfos.keys()).map(
                         // iterate over activeFacetRenderInfos  ==> renderInfo  which you can renderInfo.facetHeader
                         renderInfo => (
-                            <div>
+                            <div key={renderInfo.facetHeader}>
                                 <div className="filterBox-facetHeader">
                                     <div className="filterBox-facetHeader-Header"> </div>
                                     {renderInfo.facetHeader.charAt(0).toUpperCase() + renderInfo.facetHeader.slice(1)}
@@ -308,7 +302,7 @@ export class FilterPanel extends ObservableReactComponent<filterProps> {
                 return this.facetValues(facetHeader).map(fval => {
                     const facetValue = fval;
                     return (
-                        <div>
+                        <div key={facetValue}>
                             <input
                                 style={{ width: 20, marginLeft: 20 }}
                                 checked={['check', 'exists'].includes(
@@ -343,7 +337,7 @@ export class FilterPanel extends ObservableReactComponent<filterProps> {
                                             <div className="slider-handles">
                                                 {handles.map(handle => (
                                                     // const value = i === 0 ? defaultValues[0] : defaultValues[1];
-                                                    <div>
+                                                    <div key={handle.id}>
                                                         <Handle key={handle.id} handle={handle} domain={domain} isActive={handle.id === activeHandleID} getHandleProps={getHandleProps} />
                                                     </div>
                                                 ))}