Only show filtered counts if they are above 0 (#1907)

Author: rogermparent

webview/src/experiments/components/App.test.tsx

@@ -784,7 +784,7 @@ describe('App', () => {
 
     const tooltip = screen.getByRole('tooltip')
 
-    expect(tooltip).toHaveTextContent('No filters applied')
+    expect(tooltip.textContent).toBe('No filters applied')
 
     const { columns } = tableDataFixture
     const firstFilterPath = columns[columns.length - 1].path
@@ -802,9 +802,7 @@ describe('App', () => {
       })
     )
     expect(filterIndicator).toHaveTextContent('1')
-    expect(tooltip).toHaveTextContent('1 filter applied')
-    expect(tooltip).toHaveTextContent('No experiments filtered')
-    expect(tooltip).toHaveTextContent('No checkpoints filtered')
+    expect(tooltip.textContent).toBe('1 filter applied')
     fireEvent(
       window,
       new MessageEvent('message', {

webview/src/experiments/components/table/Indicators.tsx

@@ -84,18 +84,22 @@ export const Indicators = ({
             <div>{formatCountMessage('filter', filtersCount)}</div>
             {filtersCount ? (
               <>
-                <div>
-                  {formatFilteredCountMessage(
-                    'experiment',
-                    filteredCounts.experiments
-                  )}
-                </div>
-                <div>
-                  {formatFilteredCountMessage(
-                    'checkpoint',
-                    filteredCounts.checkpoints
-                  )}
-                </div>
+                {filteredCounts.experiments ? (
+                  <div>
+                    {formatFilteredCountMessage(
+                      'experiment',
+                      filteredCounts.experiments
+                    )}
+                  </div>
+                ) : null}
+                {filteredCounts.checkpoints ? (
+                  <div>
+                    {formatFilteredCountMessage(
+                      'checkpoint',
+                      filteredCounts.checkpoints
+                    )}
+                  </div>
+                ) : null}
               </>
             ) : null}
           </>