feat(crons): Execute callback upon monitor activation/deactivation (#62883)

Execute this callback https://github.com/getsentry/getsentry/pull/12538
when a monitor is activated or disabled

static/app/views/monitors/components/statusToggleButton.tsx

@@ -2,7 +2,9 @@ import {BaseButtonProps, Button} from 'sentry/components/button';
 import HookOrDefault from 'sentry/components/hookOrDefault';
 import {IconPause, IconPlay} from 'sentry/icons';
 import {t} from 'sentry/locale';
+import HookStore from 'sentry/stores/hookStore';
 import {ObjectStatus} from 'sentry/types';
+import useOrganization from 'sentry/utils/useOrganization';
 import {Monitor} from 'sentry/views/monitors/types';
 
 interface StatusToggleButtonProps extends Omit<BaseButtonProps, 'onClick'> {
@@ -15,12 +17,14 @@ function SimpleStatusToggle({
   onToggleStatus,
   ...props
 }: StatusToggleButtonProps) {
+  const organization = useOrganization();
   const {status} = monitor;
-  const isDisabeld = status === 'disabled';
+  const isDisabled = status === 'disabled';
+  const monitorCreationCallbacks = HookStore.get('callback:on-monitor-created');
 
-  const Icon = isDisabeld ? IconPlay : IconPause;
+  const Icon = isDisabled ? IconPlay : IconPause;
 
-  const label = isDisabeld
+  const label = isDisabled
     ? t('Reactive this monitor')
     : t('Disable this monitor and discard incoming check-ins');
 
@@ -29,7 +33,11 @@ function SimpleStatusToggle({
       icon={<Icon />}
       aria-label={label}
       title={label}
-      onClick={() => onToggleStatus(isDisabeld ? 'active' : 'disabled')}
+      onClick={async () => {
+        await onToggleStatus(isDisabled ? 'active' : 'disabled');
+        // TODO(davidenwang): Lets place this in the monitor-status-toggle hook once its created
+        monitorCreationCallbacks.map(cb => cb(organization));
+      }}
       {...props}
     />
   );