IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-01-15 19:22:34 -06:00
Code Issues Packages Projects Releases Wiki Activity

App events: Add "info" variant (#89903)

Browse Source 
* App events: Add info notification type

* Add info hook

* Revert state

* Use info alert
This commit is contained in:
Alex Khomenko 2024-07-01 14:28:49 +03:00 committed by GitHub
parent 4c9fef6183
commit 852d032e1a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 21 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/grafana-data/src/types/legacyEvents.ts
View File

@ -13,6 +13,7 @@ export const AppEvents = {
alertSuccess: eventFactory<AlertPayload>('alert-success'),
alertWarning: eventFactory<AlertPayload>('alert-warning'),
alertError: eventFactory<AlertErrorPayload>('alert-error'),
alertInfo: eventFactory<AlertPayload>('alert-info'),
};
export const PanelEvents = {

2
public/app/core/components/AppChrome/AppChromeService.tsx
View File

@ -214,7 +214,7 @@ export class AppChromeService {
const { kioskMode, searchBarHidden } = this.state.getValue();
if (searchBarHidden || kioskMode === KioskMode.TV) {
appEvents.emit(AppEvents.alertSuccess, [t('navigation.kiosk.tv-alert', 'Press ESC to exit kiosk mode')]);
appEvents.emit(AppEvents.alertInfo, [t('navigation.kiosk.tv-alert', 'Press ESC to exit kiosk mode')]);
return KioskMode.Full;
}

2
public/app/core/components/AppNotifications/AppNotificationList.tsx
View File

@ -10,6 +10,7 @@ import { useSelector, useDispatch } from 'app/types';
import {
createErrorNotification,
createInfoNotification,
createSuccessNotification,
createWarningNotification,
} from '../../copy/appNotification';
@ -25,6 +26,7 @@ export function AppNotificationList() {
appEvents.on(AppEvents.alertWarning, (payload) => dispatch(notifyApp(createWarningNotification(...payload))));
appEvents.on(AppEvents.alertSuccess, (payload) => dispatch(notifyApp(createSuccessNotification(...payload))));
appEvents.on(AppEvents.alertError, (payload) => dispatch(notifyApp(createErrorNotification(...payload))));
appEvents.on(AppEvents.alertInfo, (payload) => dispatch(notifyApp(createInfoNotification(...payload))));
}, [dispatch]);
const onClearAppNotification = (id: string) => {

20
public/app/core/copy/appNotification.ts
View File

@ -1,4 +1,4 @@
import { useMemo } from 'react';
import { useMemo, ReactElement } from 'react';
import { v4 as uuidv4 } from 'uuid';
import { getMessageFromError } from 'app/core/utils/errors';
@ -40,7 +40,7 @@ export const createErrorNotification = (
title: string,
text: string | Error = '',
traceId?: string,
component?: React.ReactElement
component?: ReactElement
): AppNotification => {
return {
...defaultErrorNotification,
@ -64,12 +64,23 @@ export const createWarningNotification = (title: string, text = '', traceId?: st
showing: true,
});
/** Hook for showing toast notifications with varying severity (success, warning error).
export const createInfoNotification = (title: string, text = '', traceId?: string): AppNotification => ({
severity: AppNotificationSeverity.Info,
icon: 'info-circle',
title,
text,
id: uuidv4(),
timestamp: Date.now(),
showing: true,
});
/** Hook for showing toast notifications with varying severity (success, warning, error, info).
* @example
* const notifyApp = useAppNotification();
* notifyApp.success('Success!', 'Some additional text');
* notifyApp.warning('Warning!');
* notifyApp.error('Error!');
* notifyApp.info('Info text');
*/
export function useAppNotification() {
const dispatch = useDispatch();
@ -84,6 +95,9 @@ export function useAppNotification() {
error: (title: string, text = '', traceId?: string) => {
dispatch(notifyApp(createErrorNotification(title, text, traceId)));
},
info: (title: string, text = '') => {
dispatch(notifyApp(createInfoNotification(title, text)));
},
}),
[dispatch]
);