From c6dcf6ce70ef221e3b2923d4bff50a8718ba2a46 Mon Sep 17 00:00:00 2001
From: Nicholas Pun <182540099+nicholaspun-wandb@users.noreply.github.com>
Date: Thu, 6 Feb 2025 09:29:41 -0800
Subject: [PATCH] feat(app): add apply button to column header popup (#3610)

---
 .../Panel2/PanelTable/ColumnHeader.tsx        | 27 ++++++++++++++++++-
 weave-js/src/panel/WeaveExpression/state.ts   |  1 -
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/weave-js/src/components/Panel2/PanelTable/ColumnHeader.tsx b/weave-js/src/components/Panel2/PanelTable/ColumnHeader.tsx
index 5b4ac95aaae9..7fbf5dd4c164 100644
--- a/weave-js/src/components/Panel2/PanelTable/ColumnHeader.tsx
+++ b/weave-js/src/components/Panel2/PanelTable/ColumnHeader.tsx
@@ -180,7 +180,10 @@ export const ColumnHeader: React.FC<{
       workingSelectFunction.type !== 'invalid'
     ) {
       let panelUpdated = false;
-      if (workingSelectFunction !== propsSelectFunction) {
+      if (
+        weave.expToString(workingSelectFunction) !==
+        weave.expToString(propsSelectFunction)
+      ) {
         newState = Table.updateColumnSelect(
           newState,
           colId,
@@ -658,6 +661,28 @@ export const ColumnHeader: React.FC<{
                       </S.PanelSettings>
                     )}
                 </S.ColumnEditorSection>
+                <S.ColumnEditorSection>
+                  <Button
+                    data-test="column-header-apply"
+                    size="small"
+                    disabled={
+                      weave.expToString(workingSelectFunction) ===
+                        weave.expToString(propsSelectFunction) &&
+                      workingColumnName === propsColumnName &&
+                      workingPanelId === propsPanelId &&
+                      workingPanelConfig === propsPanelConfig
+                    }
+                    twWrapperStyles={{
+                      display: 'flex',
+                      justifyContent: 'flex-end',
+                    }}
+                    onClick={() => {
+                      applyWorkingState();
+                      setColumnSettingsOpen(false);
+                    }}>
+                    Apply
+                  </Button>
+                </S.ColumnEditorSection>
               </div>
             )
           }
diff --git a/weave-js/src/panel/WeaveExpression/state.ts b/weave-js/src/panel/WeaveExpression/state.ts
index d334a76a94df..6f596016e935 100644
--- a/weave-js/src/panel/WeaveExpression/state.ts
+++ b/weave-js/src/panel/WeaveExpression/state.ts
@@ -321,7 +321,6 @@ export class WeaveExpressionState {
         this.trace(`...live updating expression`);
         this.setExpression(newExpr as NodeOrVoidNode);
       }
-      return;
     }
 
     if (ReactEditor.isFocused(this.editor)) {