add remove show only changed button

iterative · Aug 2, 2023 · a94fcbd · a94fcbd
1 parent f73f850
commit a94fcbd
Showing 1 changed file with 27 additions and 7 deletions.
diff --git a/webview/src/experiments/components/emptyState/AddColumns.tsx b/webview/src/experiments/components/emptyState/AddColumns.tsx
@@ -1,10 +1,30 @@
 import React from 'react'
+import { useSelector } from 'react-redux'
+import { selectColumns, toggleShowOnlyChanged } from '../../util/messages'
+import { ExperimentsState } from '../../store'
 import { StartButton } from '../../../shared/components/button/StartButton'
-import { selectColumns } from '../../util/messages'
+import { IconButton } from '../../../shared/components/button/IconButton'
+import { Close } from '../../../shared/components/icons'
 
-export const AddColumns: React.FC = () => (
-  <div>
-    <p>No Columns Selected.</p>
-    <StartButton onClick={selectColumns} text="Add Columns" />
-  </div>
-)
+export const AddColumns: React.FC = () => {
+  const showOnlyChanged = useSelector(
+    (state: ExperimentsState) => state.tableData.showOnlyChanged
+  )
+  return (
+    <div>
+      <p>No Columns Selected.</p>
+      <div>
+        <StartButton onClick={selectColumns} text="Add Columns" />
+        {showOnlyChanged && (
+          <IconButton
+            icon={Close}
+            appearance="secondary"
+            isNested={true}
+            onClick={toggleShowOnlyChanged}
+            text="Show Only Changed"
+          />
+        )}
+      </div>
+    </div>
+  )
+}