From ba7731d35d1b04965bacda524887d501e037bd55 Mon Sep 17 00:00:00 2001
From: Mia Hsu <ameliahsu@gmail.com>
Date: Thu, 12 Jun 2025 09:56:25 -0700
Subject: [PATCH 1/3] feat(aci): set up sentry app action settings button

---
 .../components/actions/sentryApp.tsx          | 58 +++++++++++++++++--
 .../actions/sentryAppSettingsButton.tsx       | 12 ----
 2 files changed, 52 insertions(+), 18 deletions(-)
 delete mode 100644 static/app/views/automations/components/actions/sentryAppSettingsButton.tsx

diff --git a/static/app/views/automations/components/actions/sentryApp.tsx b/static/app/views/automations/components/actions/sentryApp.tsx
index fc78f374c19059..865b917229b137 100644
--- a/static/app/views/automations/components/actions/sentryApp.tsx
+++ b/static/app/views/automations/components/actions/sentryApp.tsx
@@ -1,7 +1,11 @@
+import {openModal} from 'sentry/actionCreators/modal';
+import {Button} from 'sentry/components/core/button';
+import {IconSettings} from 'sentry/icons';
 import {t, tct} from 'sentry/locale';
 import type {ActionHandler} from 'sentry/types/workflowEngine/actions';
+import SentryAppRuleModal from 'sentry/views/alerts/rules/issue/sentryAppRuleModal';
 import {useActionNodeContext} from 'sentry/views/automations/components/actionNodes';
-import {SentryAppActionSettingsButton} from 'sentry/views/automations/components/actions/sentryAppSettingsButton';
+import type {SchemaFormConfig} from 'sentry/views/settings/organizationIntegrations/sentryAppExternalForm';
 
 export function SentryAppDetails({handler}: {handler: ActionHandler}) {
   const name = handler?.sentryApp?.name;
@@ -12,10 +16,52 @@ export function SentryAppDetails({handler}: {handler: ActionHandler}) {
 
 export function SentryAppNode() {
   const {handler} = useActionNodeContext();
-  const name = handler?.sentryApp?.name;
-  const title = handler?.sentryApp?.title;
-  return tct('[label] with these [settings]', {
-    label: title || name || t('Unknown SentryApp'),
-    settings: <SentryAppActionSettingsButton />,
+  const sentryApp = handler?.sentryApp;
+  if (!sentryApp) {
+    return t('Unknown SentryApp action');
+  }
+
+  const name = sentryApp.name;
+  const title = sentryApp.title;
+  return tct('[label] [settings]', {
+    label: title || name,
+    settings: sentryApp.settings
+      ? tct('with these [settings]', {settings: <SentryAppActionSettingsButton />})
+      : null,
   });
 }
+
+export function SentryAppActionSettingsButton() {
+  const {action, handler, onUpdate} = useActionNodeContext();
+  const sentryApp = handler.sentryApp;
+
+  if (!sentryApp?.settings) {
+    return null;
+  }
+
+  return (
+    <Button
+      size="sm"
+      icon={<IconSettings />}
+      onClick={() => {
+        openModal(
+          deps => (
+            <SentryAppRuleModal
+              {...deps}
+              sentryAppInstallationUuid={sentryApp.installationUuid}
+              config={sentryApp.settings as SchemaFormConfig}
+              appName={sentryApp.title ?? sentryApp.name}
+              onSubmitSuccess={(formData: Record<string, string>) =>
+                onUpdate({data: formData})
+              }
+              resetValues={action.data}
+            />
+          ),
+          {closeEvents: 'escape-key'}
+        );
+      }}
+    >
+      {t('Action Settings')}
+    </Button>
+  );
+}
diff --git a/static/app/views/automations/components/actions/sentryAppSettingsButton.tsx b/static/app/views/automations/components/actions/sentryAppSettingsButton.tsx
deleted file mode 100644
index b8bd2937adef75..00000000000000
--- a/static/app/views/automations/components/actions/sentryAppSettingsButton.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import {Button} from 'sentry/components/core/button';
-import {IconSettings} from 'sentry/icons';
-import {t} from 'sentry/locale';
-
-// TODO(miahsu): Implement the action settings button/modal
-export function SentryAppActionSettingsButton() {
-  return (
-    <Button size="sm" icon={<IconSettings />}>
-      {t('Action Settings')}
-    </Button>
-  );
-}

From 578b628750f494370f7b23e4c473edc43eb159f9 Mon Sep 17 00:00:00 2001
From: Mia Hsu <ameliahsu@gmail.com>
Date: Thu, 12 Jun 2025 10:39:04 -0700
Subject: [PATCH 2/3] remove export

---
 static/app/views/automations/components/actions/sentryApp.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/static/app/views/automations/components/actions/sentryApp.tsx b/static/app/views/automations/components/actions/sentryApp.tsx
index 865b917229b137..4bb6837861ce21 100644
--- a/static/app/views/automations/components/actions/sentryApp.tsx
+++ b/static/app/views/automations/components/actions/sentryApp.tsx
@@ -31,7 +31,7 @@ export function SentryAppNode() {
   });
 }
 
-export function SentryAppActionSettingsButton() {
+function SentryAppActionSettingsButton() {
   const {action, handler, onUpdate} = useActionNodeContext();
   const sentryApp = handler.sentryApp;
 

From 61a5aed417ec0030c2beb93d03c9d46aa5cfbf06 Mon Sep 17 00:00:00 2001
From: Mia Hsu <ameliahsu@gmail.com>
Date: Thu, 12 Jun 2025 11:40:16 -0700
Subject: [PATCH 3/3] update name/title

---
 .../components/actions/sentryApp.tsx          | 26 +++++++++----------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/static/app/views/automations/components/actions/sentryApp.tsx b/static/app/views/automations/components/actions/sentryApp.tsx
index 4bb6837861ce21..6a37dad8671a3c 100644
--- a/static/app/views/automations/components/actions/sentryApp.tsx
+++ b/static/app/views/automations/components/actions/sentryApp.tsx
@@ -1,3 +1,5 @@
+import {Fragment} from 'react';
+
 import {openModal} from 'sentry/actionCreators/modal';
 import {Button} from 'sentry/components/core/button';
 import {IconSettings} from 'sentry/icons';
@@ -8,27 +10,23 @@ import {useActionNodeContext} from 'sentry/views/automations/components/actionNo
 import type {SchemaFormConfig} from 'sentry/views/settings/organizationIntegrations/sentryAppExternalForm';
 
 export function SentryAppDetails({handler}: {handler: ActionHandler}) {
-  const name = handler?.sentryApp?.name;
+  const name = handler?.sentryApp?.name || t('unknown SentryApp');
   const title = handler?.sentryApp?.title;
 
-  return title || name || t('Unknown SentryApp action');
+  return title || tct('Notify [name]', {name});
 }
 
 export function SentryAppNode() {
   const {handler} = useActionNodeContext();
-  const sentryApp = handler?.sentryApp;
-  if (!sentryApp) {
-    return t('Unknown SentryApp action');
-  }
 
-  const name = sentryApp.name;
-  const title = sentryApp.title;
-  return tct('[label] [settings]', {
-    label: title || name,
-    settings: sentryApp.settings
-      ? tct('with these [settings]', {settings: <SentryAppActionSettingsButton />})
-      : null,
-  });
+  return (
+    <Fragment>
+      <SentryAppDetails handler={handler} />
+      {handler?.sentryApp?.settings
+        ? tct(' with these [settings]', {settings: <SentryAppActionSettingsButton />})
+        : null}
+    </Fragment>
+  );
 }
 
 function SentryAppActionSettingsButton() {