UI changes

UI lint fixes
grafana · Apr 22, 2024 · da1435a · da1435a
1 parent f7a72fa
commit da1435a
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 5 deletions.
diff --git a/...ana-plugin/src/components/IntegrationSendDemoAlertModal/IntegrationSendDemoAlertModal.tsx b/...ana-plugin/src/components/IntegrationSendDemoAlertModal/IntegrationSendDemoAlertModal.tsx
@@ -1,6 +1,6 @@
-import React, { useState } from 'react';
+import React, { useState, useCallback } from 'react';
 
-import { Button, HorizontalGroup, Icon, Modal, Tooltip, VerticalGroup } from '@grafana/ui';
+import { Button, HorizontalGroup, Icon, Modal, Tooltip, VerticalGroup, Field, Switch } from '@grafana/ui';
 import cn from 'classnames/bind';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import Emoji from 'react-emoji-render';
@@ -33,6 +33,8 @@ export const IntegrationSendDemoAlertModal: React.FC<IntegrationSendDemoPayloadM
  const { alertReceiveChannelStore } = store;
  const initialDemoJSON = JSON.stringify(alertReceiveChannel.demo_alert_payload, null, 2);
  const [demoPayload, setDemoPayload] = useState<string>(initialDemoJSON);
+ const [groupAlerts, setGroupAlerts] = useState<boolean>(false);
+
  let onPayloadChangeDebounced = debounce(100, onPayloadChange);
 
  return (
@@ -82,6 +84,15 @@ export const IntegrationSendDemoAlertModal: React.FC<IntegrationSendDemoPayloadM
  />
  </div>
 
+ <Field label="Group Alerts" description="Group the alerts based on the grouping template provided">
+ <Switch
+ value={groupAlerts}
+ onChange={(event) => {
+ setGroupAlerts(event.currentTarget.checked);
+ }}
+ />
+ </Field>
+
  <HorizontalGroup justify={'flex-end'} spacing={'md'}>
  <Button variant={'secondary'} onClick={onHideOrCancel}>
  Cancel
@@ -107,7 +118,7 @@ export const IntegrationSendDemoAlertModal: React.FC<IntegrationSendDemoPayloadM
  parsedPayload = JSON.parse(demoPayload);
  } catch (ex) {}
 
- await AlertReceiveChannelHelper.sendDemoAlert(alertReceiveChannel.id, parsedPayload);
+ await AlertReceiveChannelHelper.sendDemoAlert(alertReceiveChannel.id, parsedPayload, groupAlerts);
  alertReceiveChannelStore.fetchCounters();
  openNotification(<DemoNotification />);
  onHideOrCancel();

diff --git a/grafana-plugin/src/models/alert_receive_channel/alert_receive_channel.helpers.ts b/grafana-plugin/src/models/alert_receive_channel/alert_receive_channel.helpers.ts
@@ -164,10 +164,14 @@ export class AlertReceiveChannelHelper {
  ).data;
  }
 
- static async sendDemoAlert(id: ApiSchemas['AlertReceiveChannel']['id'], payload?: { [key: string]: unknown }) {
+ static async sendDemoAlert(
+ id: ApiSchemas['AlertReceiveChannel']['id'],
+ payload?: { [key: string]: unknown },
+ groupAlerts?: boolean
+ ) {
  await onCallApi().POST('/alert_receive_channels/{id}/send_demo_alert/', {
  params: { path: { id } },
- body: { demo_alert_payload: payload },
+ body: { demo_alert_payload: payload, group_alerts: groupAlerts },
  });
  }
 

diff --git a/grafana-plugin/src/network/oncall-api/autogenerated-api.types.d.ts b/grafana-plugin/src/network/oncall-api/autogenerated-api.types.d.ts
@@ -1697,6 +1697,7 @@ export interface components {
  demo_alert_payload?: {
  [key: string]: unknown;
  } | null;
+ group_alerts?: boolean;
  };
  AlertReceiveChannelSourceChannel: {
  readonly alert_receive_channel: components['schemas']['FastAlertReceiveChannel'];