[APM] Only show "Clear filters" button when values are not empty

Closes elastic#43853.
dgieselaar · Aug 26, 2019 · abf0e4d · abf0e4d
1 parent 8afc486
commit abf0e4d
Showing 1 changed file with 19 additions and 13 deletions.
diff --git a/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/index.tsx b/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/index.tsx
@@ -43,6 +43,8 @@ const LocalUIFilters = ({
     params
   });
 
+  const hasValues = filters.some(filter => filter.value.length > 0);
+
   return (
     <>
       <EuiTitle size="s">
@@ -68,19 +70,23 @@ const LocalUIFilters = ({
           </React.Fragment>
         );
       })}
-      <EuiSpacer size="s" />
-      <ButtonWrapper>
-        <EuiButtonEmpty
-          size="xs"
-          iconType="cross"
-          flush="left"
-          onClick={clearValues}
-        >
-          {i18n.translate('xpack.apm.clearFilters', {
-            defaultMessage: 'Clear filters'
-          })}
-        </EuiButtonEmpty>
-      </ButtonWrapper>
+      {hasValues ? (
+        <>
+          <EuiSpacer size="s" />
+          <ButtonWrapper>
+            <EuiButtonEmpty
+              size="xs"
+              iconType="cross"
+              flush="left"
+              onClick={clearValues}
+            >
+              {i18n.translate('xpack.apm.clearFilters', {
+                defaultMessage: 'Clear filters'
+              })}
+            </EuiButtonEmpty>
+          </ButtonWrapper>
+        </>
+      ) : null}
     </>
   );
 };