From b6b374270ff275f5cede66eb26d76f5b8c3dc833 Mon Sep 17 00:00:00 2001
From: Steven Palmesano <3100993+spalmesano0@users.noreply.github.com>
Date: Wed, 17 Jun 2026 14:59:51 -0500
Subject: [PATCH] Use "Example payload" for all payload example buttons and
 always enable example buttons (#47167)

**Related issue:** #44719

Also, make sure the **Dashboard > Activity > Automations** modal is
grayed out when in GitOps mode.

# Checklist for submitter

## Testing

- [x] QA'd all new/changed functionality manually

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Style**
* Standardized button labels across modals to use "Example payload" /
"Example data" consistently instead of mixed "Preview" or "Show/Hide"
variants.
* **Bug Fixes**
* Disabled relevant controls (example toggles, payload preview,
destination URL inputs, toggles) when GitOps mode is enabled so UI
reflects read-only mode.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 frontend/docs/patterns.md                     |  3 +-
 .../ActivityFeedAutomationsModal.tsx          | 29 ++++++++++---------
 .../ManageSoftwareAutomationsModal.tsx        |  3 +-
 .../EndUserMigrationSection.tsx               |  2 +-
 .../CalendarEventsModal.tsx                   | 19 ++++++------
 .../OtherWorkflowsModal.tsx                   | 23 ++++++++-------
 .../ManageQueryAutomationsModal.tsx           |  2 +-
 7 files changed, 42 insertions(+), 39 deletions(-)

diff --git a/frontend/docs/patterns.md b/frontend/docs/patterns.md
index ed078232b7..75a62fc18d 100644
--- a/frontend/docs/patterns.md
+++ b/frontend/docs/patterns.md
@@ -127,8 +127,7 @@ interface ISoftwareCountResponse {
 // *FormData instead, even for programmatic request bodies (e.g.
 // IDeleteQueriesFormData). One consistent suffix is easier to follow than
 // asking each dev to judge "is this form-driven enough?"
-// *PreviewPayload is fine for outgoing webhook shapes (matches the
-// "Preview payload" UI terminology).
+// *PreviewPayload is fine for outgoing webhook shapes.
 ```
 
 ## Utilities
diff --git a/frontend/pages/DashboardPage/components/ActivityFeedAutomationsModal/ActivityFeedAutomationsModal.tsx b/frontend/pages/DashboardPage/components/ActivityFeedAutomationsModal/ActivityFeedAutomationsModal.tsx
index f6024f1f2b..e2b320ab17 100644
--- a/frontend/pages/DashboardPage/components/ActivityFeedAutomationsModal/ActivityFeedAutomationsModal.tsx
+++ b/frontend/pages/DashboardPage/components/ActivityFeedAutomationsModal/ActivityFeedAutomationsModal.tsx
@@ -9,6 +9,7 @@ import InputField from "components/forms/fields/InputField";
 import Button from "components/buttons/Button";
 import RevealButton from "components/buttons/RevealButton";
 
+import useGitOpsMode from "hooks/useGitOpsMode";
 import { syntaxHighlight } from "utilities/helpers";
 import CustomLink from "components/CustomLink";
 
@@ -44,6 +45,8 @@ const ActivityFeedAutomationsModal = ({
   );
   const [showExamplePayload, setShowExamplePayload] = useState(false);
 
+  const { gitOpsModeEnabled } = useGitOpsMode();
+
   const validateForm = (newFormData: IAFAMFormData) => {
     const errors: Record<string, string> = {};
     const { url: newUrl } = newFormData;
@@ -143,6 +146,7 @@ const ActivityFeedAutomationsModal = ({
           onChange={onFeatureEnabledChange}
           inactiveText="Disabled"
           activeText="Enabled"
+          disabled={gitOpsModeEnabled}
         />
         <div
           className={`form ${formData.enabled ? "" : "form-fields--disabled"}`}
@@ -155,21 +159,20 @@ const ActivityFeedAutomationsModal = ({
             value={formData.url}
             error={formErrors.url}
             helpText="Fleet will send a JSON payload to this URL whenever a new activity is generated."
-            disabled={!formData.enabled}
+            disabled={!formData.enabled || gitOpsModeEnabled}
           />
-          <RevealButton
-            isShowing={showExamplePayload}
-            className={`${baseClass}__show-example-payload-toggle`}
-            hideText="Hide example payload"
-            showText="Show example payload"
-            caretPosition="after"
-            onClick={() => {
-              setShowExamplePayload(!showExamplePayload);
-            }}
-            disabled={!formData.enabled}
-          />
-          {showExamplePayload && renderExamplePayload()}
         </div>
+        <RevealButton
+          isShowing={showExamplePayload}
+          className={`${baseClass}__show-example-payload-toggle`}
+          hideText="Example payload"
+          showText="Example payload"
+          caretPosition="after"
+          onClick={() => {
+            setShowExamplePayload(!showExamplePayload);
+          }}
+        />
+        {showExamplePayload && renderExamplePayload()}
         <div className="modal-cta-wrap">
           <Button
             type="submit"
diff --git a/frontend/pages/SoftwarePage/components/modals/ManageSoftwareAutomationsModal/ManageSoftwareAutomationsModal.tsx b/frontend/pages/SoftwarePage/components/modals/ManageSoftwareAutomationsModal/ManageSoftwareAutomationsModal.tsx
index 0e701b5458..f3d26f60e6 100644
--- a/frontend/pages/SoftwarePage/components/modals/ManageSoftwareAutomationsModal/ManageSoftwareAutomationsModal.tsx
+++ b/frontend/pages/SoftwarePage/components/modals/ManageSoftwareAutomationsModal/ManageSoftwareAutomationsModal.tsx
@@ -471,9 +471,8 @@ const ManageAutomationsModal = ({
           type="button"
           variant="inverse"
           onClick={togglePreviewPayloadModal}
-          disabled={!softwareAutomationsEnabled}
         >
-          Preview payload
+          Example payload
         </Button>
       </>
     );
diff --git a/frontend/pages/admin/IntegrationsPage/cards/MdmSettings/components/EndUserMigrationSection/EndUserMigrationSection.tsx b/frontend/pages/admin/IntegrationsPage/cards/MdmSettings/components/EndUserMigrationSection/EndUserMigrationSection.tsx
index c46a97b7f1..0887a5a581 100644
--- a/frontend/pages/admin/IntegrationsPage/cards/MdmSettings/components/EndUserMigrationSection/EndUserMigrationSection.tsx
+++ b/frontend/pages/admin/IntegrationsPage/cards/MdmSettings/components/EndUserMigrationSection/EndUserMigrationSection.tsx
@@ -245,7 +245,7 @@ const EndUserMigrationSection = ({ router }: IEndUserMigrationSectionProps) => {
           variant="inverse"
           onClick={toggleExamplePayloadModal}
         >
-          Preview payload
+          Example payload
         </Button>
         <GitOpsModeTooltipWrapper
           tipOffset={8}
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/CalendarEventsModal/CalendarEventsModal.tsx b/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/CalendarEventsModal/CalendarEventsModal.tsx
index 5df2ce8766..dbabfaff5d 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/CalendarEventsModal/CalendarEventsModal.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/CalendarEventsModal/CalendarEventsModal.tsx
@@ -187,17 +187,16 @@ const CalendarEventsModal = forwardRef<
                   helpText="A request will be sent to this URL during the calendar event. Use it to trigger auto-remediation."
                   disabled={!formData.enabled || gitOpsModeEnabled}
                 />
-                <RevealButton
-                  isShowing={showExamplePayload}
-                  className={`${baseClass}__show-example-payload-toggle`}
-                  hideText="Hide example payload"
-                  showText="Show example payload"
-                  caretPosition="after"
-                  onClick={() => setShowExamplePayload(!showExamplePayload)}
-                  disabled={!formData.enabled}
-                />
-                {showExamplePayload && renderExamplePayload()}
               </div>
+              <RevealButton
+                isShowing={showExamplePayload}
+                className={`${baseClass}__show-example-payload-toggle`}
+                hideText="Example payload"
+                showText="Example payload"
+                caretPosition="after"
+                onClick={() => setShowExamplePayload(!showExamplePayload)}
+              />
+              {showExamplePayload && renderExamplePayload()}
             </>
           )}
         </div>
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/OtherWorkflowsModal/OtherWorkflowsModal.tsx b/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/OtherWorkflowsModal/OtherWorkflowsModal.tsx
index d1fef95dc3..5fe021aa3d 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/OtherWorkflowsModal/OtherWorkflowsModal.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/OtherWorkflowsModal/OtherWorkflowsModal.tsx
@@ -241,16 +241,6 @@ const OtherWorkflowsModal = forwardRef<
           tooltip="Provide a URL to deliver a webhook request to."
           disabled={!isPolicyAutomationsEnabled || gitOpsModeEnabled}
         />
-        <RevealButton
-          isShowing={showExamplePayload}
-          className={baseClass}
-          hideText="Hide example payload"
-          showText="Show example payload"
-          caretPosition="after"
-          onClick={() => setShowExamplePayload(!showExamplePayload)}
-          disabled={!isPolicyAutomationsEnabled}
-        />
-        {showExamplePayload && <ExamplePayload />}
       </>
     );
 
@@ -353,6 +343,19 @@ const OtherWorkflowsModal = forwardRef<
           </div>
           {isWebhookEnabled ? renderWebhook() : renderIntegrations()}
         </div>
+        {isWebhookEnabled && (
+          <>
+            <RevealButton
+              isShowing={showExamplePayload}
+              className={baseClass}
+              hideText="Example payload"
+              showText="Example payload"
+              caretPosition="after"
+              onClick={() => setShowExamplePayload(!showExamplePayload)}
+            />
+            {showExamplePayload && <ExamplePayload />}
+          </>
+        )}
       </div>
     );
   }
diff --git a/frontend/pages/queries/ManageQueriesPage/components/ManageQueryAutomationsModal/ManageQueryAutomationsModal.tsx b/frontend/pages/queries/ManageQueriesPage/components/ManageQueryAutomationsModal/ManageQueryAutomationsModal.tsx
index 8bf96869bf..ff53abe508 100644
--- a/frontend/pages/queries/ManageQueriesPage/components/ManageQueryAutomationsModal/ManageQueryAutomationsModal.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/components/ManageQueryAutomationsModal/ManageQueryAutomationsModal.tsx
@@ -230,7 +230,7 @@ const ManageQueryAutomationsModal = ({
           onClick={togglePreviewDataModal}
           className={`${baseClass}__preview-data`}
         >
-          Preview data
+          Example data
         </Button>
         <div className="modal-cta-wrap">
           <GitOpsModeTooltipWrapper