From e8f0fdf71f339b37ca798b63a489457c7a6fe395 Mon Sep 17 00:00:00 2001
From: Linus Pahl <linus.pahl@graylog.com>
Date: Fri, 1 Nov 2024 14:52:47 +0100
Subject: [PATCH] Remove redux store usage from `EditWidgetFrame`.

---
 .../views/components/widgets/EditWidgetFrame.tsx  | 15 +++++++--------
 .../src/views/components/widgets/Widget.tsx       | 13 ++++++++++---
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/graylog2-web-interface/src/views/components/widgets/EditWidgetFrame.tsx b/graylog2-web-interface/src/views/components/widgets/EditWidgetFrame.tsx
index 733a9d4e228f0..7779bc227b827 100644
--- a/graylog2-web-interface/src/views/components/widgets/EditWidgetFrame.tsx
+++ b/graylog2-web-interface/src/views/components/widgets/EditWidgetFrame.tsx
@@ -23,8 +23,7 @@ import WidgetContext from 'views/components/contexts/WidgetContext';
 import QueryEditModeContext from 'views/components/contexts/QueryEditModeContext';
 import SaveOrCancelButtons from 'views/components/widgets/SaveOrCancelButtons';
 import WidgetEditApplyAllChangesProvider from 'views/components/contexts/WidgetEditApplyAllChangesProvider';
-import useViewType from 'views/hooks/useViewType';
-import View from 'views/logic/views/View';
+import type Widget from 'views/logic/widgets/Widget';
 
 import WidgetQueryControls from '../WidgetQueryControls';
 import WidgetOverrideElements from '../WidgetOverrideElements';
@@ -50,25 +49,25 @@ const Visualization = styled.div`
 
 type Props = {
   children: React.ReactNode,
+  displaySubmitActions?: boolean,
   onCancel: () => void,
   onSubmit: () => void,
-  displaySubmitActions?: boolean,
+  showQueryControls?: boolean,
+  onChange: (widgetId: string, newWidget: Widget) => Promise<void>,
 };
 
-const EditWidgetFrame = ({ children, onCancel, onSubmit, displaySubmitActions = true }: Props) => {
+const EditWidgetFrame = ({ children, onCancel, onSubmit, displaySubmitActions = true, showQueryControls = true, onChange }: Props) => {
   const widget = useContext(WidgetContext);
-  const viewType = useViewType();
-  const isDashboard = viewType === View.Type.Dashboard;
 
   if (!widget) {
     return <Spinner text="Loading widget ..." />;
   }
 
   return (
-    <WidgetEditApplyAllChangesProvider widget={widget}>
+    <WidgetEditApplyAllChangesProvider widget={widget} onChange={onChange}>
       <DisableSubmissionStateProvider>
         <Container>
-          {(isDashboard && !widget.returnsAllRecords) && (
+          {(showQueryControls && !widget.returnsAllRecords) && (
             <QueryControls>
               <QueryEditModeContext.Provider value="widget">
                 <WidgetQueryControls />
diff --git a/graylog2-web-interface/src/views/components/widgets/Widget.tsx b/graylog2-web-interface/src/views/components/widgets/Widget.tsx
index e40022fa060b0..1320fb6a690b7 100644
--- a/graylog2-web-interface/src/views/components/widgets/Widget.tsx
+++ b/graylog2-web-interface/src/views/components/widgets/Widget.tsx
@@ -152,13 +152,14 @@ type EditWrapperProps = {
   editing: boolean,
   fields: FieldTypeMappingsList,
   id: string,
-  onToggleEdit: () => void,
   onCancelEdit: () => void,
+  onToggleEdit: () => void,
   onWidgetConfigChange: (newWidgetConfig: WidgetConfig) => void,
+  showQueryControls?: boolean,
   type: string,
 };
 
-const EditWrapper = ({
+export const EditWrapper = ({
   children,
   config,
   editing,
@@ -168,12 +169,17 @@ const EditWrapper = ({
   onCancelEdit,
   onWidgetConfigChange,
   type,
+  showQueryControls,
 }: EditWrapperProps) => {
   const EditComponent = useMemo(() => _editComponentForType(type), [type]);
   const hasOwnSubmitButton = _hasOwnEditSubmitButton(type);
 
   return editing ? (
-    <EditWidgetFrame onSubmit={onToggleEdit} onCancel={onCancelEdit} displaySubmitActions={!hasOwnSubmitButton}>
+    <EditWidgetFrame onSubmit={onToggleEdit}
+                     onCancel={onCancelEdit}
+                     onChange={onWidgetConfigChange}
+                     displaySubmitActions={!hasOwnSubmitButton}
+                     showQueryControls={showQueryControls}>
       <EditComponent config={config}
                      fields={fields}
                      editing={editing}
@@ -279,6 +285,7 @@ const Widget = ({ id, editing = false, widget, title, position, onPositionsChang
         </InteractiveContext.Consumer>
         <EditWrapper onToggleEdit={onToggleEdit}
                      onCancelEdit={onCancelEdit}
+                     showQueryControls={isDashboard}
                      onWidgetConfigChange={onWidgetConfigChange}
                      config={config}
                      editing={editing}