{MobileAppVerificationTokenLoading ? (
diff --git a/grafana-plugin/src/img/grafanaGlobalStyles.css b/grafana-plugin/src/img/grafanaGlobalStyles.css
index 29ac020c..9e29d7ba 100644
--- a/grafana-plugin/src/img/grafanaGlobalStyles.css
+++ b/grafana-plugin/src/img/grafanaGlobalStyles.css
@@ -9,7 +9,7 @@
padding-bottom: 36px;
}
-.scrollbar-view [class*='-page-header'] {
+.scrollbar-view h1:first-child {
margin-bottom: 0 !important;
}
@@ -21,6 +21,7 @@
max-width: unset !important;
flex-grow: unset !important;
flex-basis: unset !important;
+ overflow-x: auto;
}
.page-scrollbar-content > div:first-child {
@@ -29,6 +30,7 @@
.page-header__title {
padding-top: 0 !important;
+ font-size: 2rem !important;
margin-right: 8px;
}
diff --git a/grafana-plugin/src/models/user/user.ts b/grafana-plugin/src/models/user/user.ts
index 3db546fc..8d7ea002 100644
--- a/grafana-plugin/src/models/user/user.ts
+++ b/grafana-plugin/src/models/user/user.ts
@@ -378,16 +378,4 @@ export class UserStore extends BaseStore {
method: 'DELETE',
});
}
-
- async getMobileAppVerificationToken(userPk: User['pk']) {
- return await makeRequest(`/users/${userPk}/mobile_app_verification_token/`, {
- method: 'GET',
- });
- }
-
- async createMobileAppVerificationToken(userPk: User['pk']) {
- return await makeRequest(`/users/${userPk}/mobile_app_verification_token/`, {
- method: 'POST',
- });
- }
}
diff --git a/grafana-plugin/src/navbar/LegacyNavTabsBar.module.scss b/grafana-plugin/src/navbar/LegacyNavTabsBar.module.scss
new file mode 100644
index 00000000..c3b2ca3c
--- /dev/null
+++ b/grafana-plugin/src/navbar/LegacyNavTabsBar.module.scss
@@ -0,0 +1,3 @@
+.root {
+ min-width: 1500px;
+}
diff --git a/grafana-plugin/src/navbar/LegacyNavTabsBar.tsx b/grafana-plugin/src/navbar/LegacyNavTabsBar.tsx
index d96ba975..c6564d3c 100644
--- a/grafana-plugin/src/navbar/LegacyNavTabsBar.tsx
+++ b/grafana-plugin/src/navbar/LegacyNavTabsBar.tsx
@@ -2,10 +2,15 @@ import React from 'react';
import { IconName } from '@grafana/data';
import { Tab, TabsBar } from '@grafana/ui';
+import cn from 'classnames/bind';
import { pages } from 'pages';
import { useStore } from 'state/useStore';
+import styles from './LegacyNavTabsBar.module.scss';
+
+const cx = cn.bind(styles);
+
export default function LegacyNavTabsBar({ currentPage }: { currentPage: string }): JSX.Element {
const store = useStore();
@@ -14,7 +19,7 @@ export default function LegacyNavTabsBar({ currentPage }: { currentPage: string
.filter((page) => (page.hideFromTabsFn ? !page.hideFromTabsFn(store) : !page.hideFromTabs));
return (
-
+
{navigationPages.map((page, index) => (
{
- getLocationSrv().update({ partial: true, query: { id: escalationChain } });
+ LocationHelper.update({ id: escalationChain }, 'partial');
if (escalationChain) {
escalationChainStore.updateEscalationChainDetails(escalationChain);
}
@@ -143,79 +142,81 @@ class EscalationChainsPage extends React.Component
- <>
-
-
-
- {!searchResult || searchResult.length ? (
-
-
-
- {
- this.setState({ showCreateEscalationChainModal: true });
- }}
- icon="plus"
- className={cx('new-escalation-chain')}
- >
- New escalation chain
-
-
-
- {searchResult ? (
-
- {(item) =>
- ) : (
-
-
-
{this.renderEscalation()}
+ {() => (
+ <>
+
+
+
- ) : (
-
- No escalations found, check your filtering and current team.
-
+ {!searchResult || searchResult.length ? (
+
+
+
{
this.setState({ showCreateEscalationChainModal: true });
}}
+ icon="plus"
+ className={cx('new-escalation-chain')}
>
New Escalation Chain
-
- }
+
+ {searchResult ? (
+
+ {(item) =>
+ ) : (
+
+
+
{this.renderEscalation()}
+
+ No escalations found, check your filtering and current team.
+
+ {
+ this.setState({ showCreateEscalationChainModal: true });
+ }}
+ >
+ New Escalation Chain
+
+
+
+ }
+ />
+ )}
+
+ {showCreateEscalationChainModal && (
+
{
+ this.setState({
+ showCreateEscalationChainModal: false,
+ escalationChainIdToCopy: undefined,
+ });
+ }}
+ onUpdate={this.handleEscalationChainCreate}
/>
)}
-
- {showCreateEscalationChainModal && (
-
{
- this.setState({
- showCreateEscalationChainModal: false,
- escalationChainIdToCopy: undefined,
- });
- }}
- onUpdate={this.handleEscalationChainCreate}
- />
- )}
-
+
+ )}
);
diff --git a/grafana-plugin/src/pages/incident/Incident.tsx b/grafana-plugin/src/pages/incident/Incident.tsx
index 2125e374..c4f48065 100644
--- a/grafana-plugin/src/pages/incident/Incident.tsx
+++ b/grafana-plugin/src/pages/incident/Incident.tsx
@@ -1,6 +1,5 @@
import React, { useState, SyntheticEvent } from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import {
Button,
HorizontalGroup,
@@ -22,7 +21,6 @@ import moment from 'moment-timezone';
import CopyToClipboard from 'react-copy-to-clipboard';
import Emoji from 'react-emoji-render';
import reactStringReplace from 'react-string-replace';
-import { AppRootProps } from 'types';
import Collapse from 'components/Collapse/Collapse';
import Block from 'components/GBlock/Block';
@@ -49,12 +47,12 @@ import {
} from 'models/alertgroup/alertgroup.types';
import { ResolutionNoteSourceTypesToDisplayName } from 'models/resolution_note/resolution_note.types';
import { pages } from 'pages';
-import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { useStore } from 'state/useStore';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
import { openNotification } from 'utils';
+import LocationHelper from 'utils/LocationHelper';
import sanitize from 'utils/sanitize';
import { getActionButtons, getIncidentStatusTag, renderRelatedUsers } from './Incident.helpers';
@@ -63,7 +61,7 @@ import styles from './Incident.module.css';
const cx = cn.bind(styles);
-interface IncidentPageProps extends WithStoreProps, AppRootProps {}
+interface IncidentPageProps extends WithStoreProps, PageProps {}
interface IncidentPageState extends PageBaseState {
showIntegrationSettings?: boolean;
@@ -97,8 +95,10 @@ class IncidentPage extends React.Component
update = () => {
this.setState({ errorData: initErrorDataState() }); // reset wrong team error to false
- const { store } = this.props;
- const { id } = getQueryParams();
+ const {
+ store,
+ query: { id },
+ } = this.props;
store.alertGroupStore
.getAlert(id)
@@ -106,8 +106,10 @@ class IncidentPage extends React.Component
};
render() {
- const { store } = this.props;
- const { id, cursor, start, perpage } = getQueryParams();
+ const {
+ store,
+ query: { id, cursor, start, perpage },
+ } = this.props;
const { errorData, showIntegrationSettings, showAttachIncidentForm } = this.state;
const { isNotFoundError, isWrongTeamError } = errorData;
@@ -127,74 +129,78 @@ class IncidentPage extends React.Component
return (
-
- {errorData.isNotFoundError ? (
-
-
- 404
- Incident not found
-
-
- Go to incidents page
-
-
-
-
- ) : (
- <>
- {this.renderHeader()}
-
-
-
{this.renderTimeline()}
+ {() => (
+
+ {errorData.isNotFoundError ? (
+
+
+ 404
+ Incident not found
+
+
+ Go to incidents page
+
+
+
- {showIntegrationSettings && (
-
{
- alertReceiveChannelStore.updateItem(incident.alert_receive_channel.id);
- }}
- onUpdateTemplates={() => {
- store.alertGroupStore.getAlert(id);
- }}
- startTab={IntegrationSettingsTab.Templates}
- id={incident.alert_receive_channel.id}
- onHide={() =>
- this.setState({
- showIntegrationSettings: undefined,
- })
- }
- />
- )}
- {showAttachIncidentForm && (
- {
- this.setState({
- showAttachIncidentForm: false,
- });
- }}
- onUpdate={this.update}
- />
- )}
-
- )}
-
+ ) : (
+ <>
+ {this.renderHeader()}
+
+
+
{this.renderTimeline()}
+
+ {showIntegrationSettings && (
+
{
+ alertReceiveChannelStore.updateItem(incident.alert_receive_channel.id);
+ }}
+ onUpdateTemplates={() => {
+ store.alertGroupStore.getAlert(id);
+ }}
+ startTab={IntegrationSettingsTab.Templates}
+ id={incident.alert_receive_channel.id}
+ onHide={() =>
+ this.setState({
+ showIntegrationSettings: undefined,
+ })
+ }
+ />
+ )}
+ {showAttachIncidentForm && (
+ {
+ this.setState({
+ showAttachIncidentForm: false,
+ });
+ }}
+ onUpdate={this.update}
+ />
+ )}
+
+ )}
+
+ )}
);
}
renderHeader = () => {
- const { store } = this.props;
+ const {
+ store,
+ query: { id, cursor, start, perpage },
+ } = this.props;
- const { id, cursor, start, perpage } = getQueryParams();
const { alerts } = store.alertGroupStore;
const incident = alerts.get(id);
@@ -311,9 +317,11 @@ class IncidentPage extends React.Component
};
renderTimeline = () => {
- const { store } = this.props;
+ const {
+ store,
+ query: { id },
+ } = this.props;
- const { id } = getQueryParams();
const incident = store.alertGroupStore.alerts.get(id);
if (!incident.render_after_resolve_report_json) {
@@ -401,9 +409,11 @@ class IncidentPage extends React.Component
};
handleCreateResolutionNote = () => {
- const { store } = this.props;
+ const {
+ store,
+ query: { id },
+ } = this.props;
- const { id } = getQueryParams();
const { resolutionNoteText } = this.state;
store.resolutionNotesStore
.createResolutionNote(id, resolutionNoteText)
@@ -419,9 +429,7 @@ class IncidentPage extends React.Component
case 'author':
return (
{
- getLocationSrv().update({ query: { page: 'users', id: entity?.author?.pk } });
- }}
+ onClick={() => LocationHelper.update({ id: entity?.author?.pk, page: 'users' }, 'replace')}
style={{ textDecoration: 'underline', cursor: 'pointer' }}
>
{entity.author?.username}
diff --git a/grafana-plugin/src/pages/incidents/Incidents.tsx b/grafana-plugin/src/pages/incidents/Incidents.tsx
index 3ef595a6..198c2da4 100644
--- a/grafana-plugin/src/pages/incidents/Incidents.tsx
+++ b/grafana-plugin/src/pages/incidents/Incidents.tsx
@@ -1,6 +1,5 @@
import React, { ReactElement, SyntheticEvent } from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Button, Icon, Tooltip, VerticalGroup, LoadingPlaceholder, HorizontalGroup } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
@@ -8,12 +7,10 @@ import { get } from 'lodash-es';
import { observer } from 'mobx-react';
import moment from 'moment-timezone';
import Emoji from 'react-emoji-render';
-import { AppRootProps } from 'types';
import CursorPagination from 'components/CursorPagination/CursorPagination';
import GTable from 'components/GTable/GTable';
import IntegrationLogo from 'components/IntegrationLogo/IntegrationLogo';
-import PageErrorHandlingWrapper from 'components/PageErrorHandlingWrapper/PageErrorHandlingWrapper';
import PluginLink from 'components/PluginLink/PluginLink';
import Text from 'components/Text/Text';
import Tutorial from 'components/Tutorial/Tutorial';
@@ -25,11 +22,11 @@ import { Alert, Alert as AlertType, AlertAction } from 'models/alertgroup/alertg
import { User } from 'models/user/user.types';
import { pages } from 'pages';
import { getActionButtons, getIncidentStatusTag, renderRelatedUsers } from 'pages/incident/Incident.helpers';
-import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
import { move } from 'state/helpers';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import SilenceDropdown from './parts/SilenceDropdown';
@@ -54,7 +51,7 @@ function withSkeleton(fn: (alert: AlertType) => ReactElement | ReactElement[]) {
return WithSkeleton;
}
-interface IncidentsPageProps extends WithStoreProps, AppRootProps {}
+interface IncidentsPageProps extends WithStoreProps, PageProps {}
interface IncidentsPageState {
selectedIncidentIds: Array;
@@ -71,8 +68,10 @@ class Incidents extends React.Component
constructor(props: IncidentsPageProps) {
super(props);
- const { store } = props;
- const { cursor: cursorQuery, start: startQuery, perpage: perpageQuery } = getQueryParams();
+ const {
+ store,
+ query: { cursor: cursorQuery, start: startQuery, perpage: perpageQuery },
+ } = props;
const cursor = cursorQuery || undefined;
const start = !isNaN(startQuery) ? Number(startQuery) : 1;
@@ -103,12 +102,10 @@ class Incidents extends React.Component
render() {
return (
-
-
- {this.renderIncidentFilters()}
- {this.renderTable()}
-
-
+
+ {this.renderIncidentFilters()}
+ {this.renderTable()}
+
);
}
@@ -148,7 +145,7 @@ class Incidents extends React.Component
fetchIncidentData = (filters: IncidentsFiltersType, isOnMount: boolean) => {
const { store } = this.props;
store.alertGroupStore.updateIncidentFilters(filters, isOnMount); // this line fetches incidents
- getLocationSrv().update({ query: { page: 'incidents', ...store.alertGroupStore.incidentFilters } });
+ LocationHelper.update({ page: 'incidents', ...store.alertGroupStore.incidentFilters }, 'partial');
};
onChangeCursor = (cursor: string, direction: 'prev' | 'next') => {
@@ -577,7 +574,9 @@ class Incidents extends React.Component
}
setPollingInterval(filters: IncidentsFiltersType = this.state.filters, isOnMount = false) {
- this.pollingIntervalId = setInterval(() => this.fetchIncidentData(filters, isOnMount), POLLING_NUM_SECONDS * 1000);
+ this.pollingIntervalId = setInterval(() => {
+ this.fetchIncidentData(filters, isOnMount);
+ }, POLLING_NUM_SECONDS * 1000);
}
}
diff --git a/grafana-plugin/src/pages/index.tsx b/grafana-plugin/src/pages/index.tsx
index b3fa2499..a837581a 100644
--- a/grafana-plugin/src/pages/index.tsx
+++ b/grafana-plugin/src/pages/index.tsx
@@ -101,7 +101,7 @@ export const pages: { [id: string]: PageDefinition } = [
{
icon: 'cog',
id: 'settings',
- text: 'Organization Settings',
+ text: 'Settings',
hideFromBreadcrumbs: true,
path: getPath('settings'),
},
diff --git a/grafana-plugin/src/pages/integrations/Integrations.tsx b/grafana-plugin/src/pages/integrations/Integrations.tsx
index e3a759b4..a5fb20c4 100644
--- a/grafana-plugin/src/pages/integrations/Integrations.tsx
+++ b/grafana-plugin/src/pages/integrations/Integrations.tsx
@@ -1,12 +1,10 @@
import React from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Button, LoadingPlaceholder, VerticalGroup } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
import { debounce } from 'lodash-es';
import { observer } from 'mobx-react';
-import { AppRootProps } from 'types';
import GList from 'components/GList/GList';
import IntegrationsFilters, { Filters } from 'components/IntegrationsFilters/IntegrationsFilters';
@@ -27,9 +25,10 @@ import { WithPermissionControl } from 'containers/WithPermissionControl/WithPerm
import { AlertReceiveChannel } from 'models/alert_receive_channel';
import { AlertReceiveChannelOption } from 'models/alert_receive_channel/alert_receive_channel.types';
import { pages } from 'pages';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import styles from './Integrations.module.css';
@@ -42,7 +41,7 @@ interface IntegrationsState extends PageBaseState {
integrationSettingsTab?: IntegrationSettingsTab;
}
-interface IntegrationsProps extends WithStoreProps, AppRootProps {}
+interface IntegrationsProps extends WithStoreProps, PageProps {}
@observer
class Integrations extends React.Component {
@@ -62,7 +61,7 @@ class Integrations extends React.Component
setSelectedAlertReceiveChannel = (alertReceiveChannelId: AlertReceiveChannel['id']) => {
const { store } = this.props;
store.selectedAlertReceiveChannel = alertReceiveChannelId;
- getLocationSrv().update({ partial: true, query: { id: alertReceiveChannelId } });
+ LocationHelper.update({ id: alertReceiveChannelId }, 'partial');
};
parseQueryParams = async () => {
@@ -139,110 +138,112 @@ class Integrations extends React.Component
pageName="integrations"
itemNotFoundMessage={`Integration with id=${query?.id} is not found. Please select integration from the list.`}
>
- <>
-
-
-
- {searchResult?.length ? (
-
-
-
- {
- this.setState({ showCreateIntegrationModal: true });
- }}
- icon="plus"
- className={cx('newIntegrationButton')}
- >
- New integration for receiving alerts
-
-
-
-
- {(item) => (
- {
- this.setState({
- alertReceiveChannelToShowSettings: item.id,
- integrationSettingsTab: IntegrationSettingsTab.Heartbeat,
- });
- }}
- />
- )}
-
-
-
-
-
{
- this.setState({
- alertReceiveChannelToShowSettings: store.selectedAlertReceiveChannel,
- integrationSettingsTab,
- });
- }}
- />
-
+ {() => (
+ <>
+
+
+
- ) : searchResult ? (
-
- No integrations found. Review your filter and team settings.
+ {searchResult?.length ? (
+
+
{
this.setState({ showCreateIntegrationModal: true });
}}
+ icon="plus"
+ className={cx('newIntegrationButton')}
>
New integration for receiving alerts
-
- }
+
+
+ {(item) => (
+ {
+ this.setState({
+ alertReceiveChannelToShowSettings: item.id,
+ integrationSettingsTab: IntegrationSettingsTab.Heartbeat,
+ });
+ }}
+ />
+ )}
+
+
+
+
+
{
+ this.setState({
+ alertReceiveChannelToShowSettings: store.selectedAlertReceiveChannel,
+ integrationSettingsTab,
+ });
+ }}
+ />
+
+
+ No integrations found. Review your filter and team settings.
+
+ {
+ this.setState({ showCreateIntegrationModal: true });
+ }}
+ >
+ New integration for receiving alerts
+
+
+
+ }
+ />
+ ) : (
+
+ {alertReceiveChannelToShowSettings && (
+
{
+ alertReceiveChannelStore.updateItem(alertReceiveChannelToShowSettings);
+ }}
+ startTab={integrationSettingsTab}
+ id={alertReceiveChannelToShowSettings}
+ onHide={() => {
+ this.setState({
+ alertReceiveChannelToShowSettings: undefined,
+ integrationSettingsTab: undefined,
+ });
+ LocationHelper.update({ tab: undefined }, 'partial');
+ }}
/>
- ) : (
-
- {alertReceiveChannelToShowSettings && (
-
{
- alertReceiveChannelStore.updateItem(alertReceiveChannelToShowSettings);
- }}
- startTab={integrationSettingsTab}
- id={alertReceiveChannelToShowSettings}
- onHide={() => {
- this.setState({
- alertReceiveChannelToShowSettings: undefined,
- integrationSettingsTab: undefined,
- });
- getLocationSrv().update({ partial: true, query: { tab: undefined } });
- }}
- />
- )}
- {showCreateIntegrationModal && (
- {
- this.setState({ showCreateIntegrationModal: false });
- }}
- onCreate={this.handleCreateNewAlertReceiveChannel}
- />
- )}
-
+ {showCreateIntegrationModal && (
+ {
+ this.setState({ showCreateIntegrationModal: false });
+ }}
+ onCreate={this.handleCreateNewAlertReceiveChannel}
+ />
+ )}
+
+ )}
);
diff --git a/grafana-plugin/src/pages/maintenance/Maintenance.tsx b/grafana-plugin/src/pages/maintenance/Maintenance.tsx
index 4d329475..9ec72ea3 100644
--- a/grafana-plugin/src/pages/maintenance/Maintenance.tsx
+++ b/grafana-plugin/src/pages/maintenance/Maintenance.tsx
@@ -7,7 +7,6 @@ import { observer } from 'mobx-react';
import moment from 'moment-timezone';
import LegacyNavHeading from 'navbar/LegacyNavHeading';
import Emoji from 'react-emoji-render';
-import { AppRootProps } from 'types';
import GTable from 'components/GTable/GTable';
import Text from 'components/Text/Text';
@@ -18,7 +17,7 @@ import { getAlertReceiveChannelDisplayName } from 'models/alert_receive_channel/
import { AlertReceiveChannel } from 'models/alert_receive_channel/alert_receive_channel.types';
import { Maintenance, MaintenanceMode, MaintenanceType } from 'models/maintenance/maintenance.types';
import { pages } from 'pages';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
@@ -26,7 +25,7 @@ import styles from './Maintenance.module.css';
const cx = cn.bind(styles);
-interface MaintenancePageProps extends AppRootProps, WithStoreProps {}
+interface MaintenancePageProps extends PageProps, WithStoreProps {}
interface MaintenancePageState {
maintenanceData?: {
diff --git a/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.test.tsx b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.test.tsx
new file mode 100644
index 00000000..463b3256
--- /dev/null
+++ b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.test.tsx
@@ -0,0 +1,86 @@
+import 'jest/matchMedia.ts';
+import React from 'react';
+
+import { describe, expect, test } from '@jest/globals';
+import { render, screen, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import outgoingWebhooksStub from 'jest/outgoingWebhooksStub';
+
+import { OutgoingWebhook } from 'models/outgoing_webhook/outgoing_webhook.types';
+import { OutgoingWebhooks } from 'pages/outgoing_webhooks/OutgoingWebhooks';
+
+const outgoingWebhooks = outgoingWebhooksStub as OutgoingWebhook[];
+const outgoingWebhookStore = () => ({
+ loadItem: () => Promise.resolve(outgoingWebhooks[0]),
+ updateItems: () => Promise.resolve(),
+ getSearchResult: () => outgoingWebhooks,
+ items: outgoingWebhooks.reduce((prev, current) => {
+ prev[current.id] = current;
+ return prev;
+ }, {}),
+});
+
+jest.mock('plugin/GrafanaPluginRootPage.helpers', () => ({
+ isTopNavbar: () => false,
+}));
+
+jest.mock('@grafana/runtime', () => ({
+ config: {
+ featureToggles: {
+ topNav: false,
+ },
+ },
+}));
+
+jest.mock('state/useStore', () => ({
+ useStore: () => ({
+ outgoingWebhookStore: outgoingWebhookStore(),
+ isUserActionAllowed: jest.fn().mockReturnValue(true),
+ }),
+}));
+
+jest.mock('@grafana/runtime', () => ({
+ getLocationSrv: jest.fn(),
+}));
+
+describe('OutgoingWebhooks', () => {
+ const storeMock = {
+ isUserActionAllowed: jest.fn().mockReturnValue(true),
+ outgoingWebhookStore: outgoingWebhookStore(),
+ };
+
+ beforeAll(() => {
+ console.warn = () => {};
+ console.error = () => {};
+ });
+
+ test('It renders all retrieved webhooks', async () => {
+ render(('test__outgoingWebhookEditForm');
+ }
+});
diff --git a/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx
index 797fc6d6..1ff3f4d7 100644
--- a/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx
+++ b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx
@@ -1,12 +1,10 @@
import React from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Button, HorizontalGroup } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
import { observer } from 'mobx-react';
import LegacyNavHeading from 'navbar/LegacyNavHeading';
-import { AppRootProps } from 'types';
import GTable from 'components/GTable/GTable';
import PageErrorHandlingWrapper, { PageBaseState } from 'components/PageErrorHandlingWrapper/PageErrorHandlingWrapper';
@@ -22,16 +20,16 @@ import { WithPermissionControl } from 'containers/WithPermissionControl/WithPerm
import { ActionDTO } from 'models/action';
import { OutgoingWebhook } from 'models/outgoing_webhook/outgoing_webhook.types';
import { pages } from 'pages';
-import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import styles from './OutgoingWebhooks.module.css';
const cx = cn.bind(styles);
-interface OutgoingWebhooksProps extends WithStoreProps, AppRootProps {}
+interface OutgoingWebhooksProps extends WithStoreProps, PageProps {}
interface OutgoingWebhooksState extends PageBaseState {
outgoingWebhookIdToEdit?: OutgoingWebhook['id'] | 'new';
@@ -43,14 +41,12 @@ class OutgoingWebhooks extends React.Component
- <>
-
-
(
-
-
- Outgoing Webhooks
-
-
-
-
-
- Create
-
-
-
+ {() => (
+ <>
+
+
(
+
+
+ Outgoing Webhooks
+
+
- )}
- rowKey="id"
- columns={columns}
- data={webhooks}
- />
-
- {outgoingWebhookIdToEdit && (
-
- )}
-
+ )}
+ rowKey="id"
+ columns={columns}
+ data={webhooks}
+ />
+
{
this.setState({ outgoingWebhookIdToEdit: id });
- getLocationSrv().update({ partial: true, query: { id } });
+ LocationHelper.update({ id }, 'partial');
};
};
handleOutgoingWebhookFormHide = () => {
this.setState({ outgoingWebhookIdToEdit: undefined });
- getLocationSrv().update({ partial: true, query: { id: undefined } });
+ LocationHelper.update({ id: undefined }, 'partial');
};
}
diff --git a/grafana-plugin/src/pages/schedule/Schedule.tsx b/grafana-plugin/src/pages/schedule/Schedule.tsx
index 7f99d9fe..87e02706 100644
--- a/grafana-plugin/src/pages/schedule/Schedule.tsx
+++ b/grafana-plugin/src/pages/schedule/Schedule.tsx
@@ -1,12 +1,10 @@
import React from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Button, HorizontalGroup, VerticalGroup, IconButton, ToolbarButton, Icon, Modal } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
import dayjs from 'dayjs';
import { observer } from 'mobx-react';
-import { AppRootProps } from 'types';
import PageErrorHandlingWrapper from 'components/PageErrorHandlingWrapper/PageErrorHandlingWrapper';
import PluginLink from 'components/PluginLink/PluginLink';
@@ -23,10 +21,10 @@ import UsersTimezones from 'containers/UsersTimezones/UsersTimezones';
import { Schedule, ScheduleType, Shift } from 'models/schedule/schedule.types';
import { Timezone } from 'models/timezone/timezone.types';
import { pages } from 'pages';
-import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import { getStartOfWeek } from './Schedule.helpers';
@@ -34,7 +32,7 @@ import styles from './Schedule.module.css';
const cx = cn.bind(styles);
-interface SchedulePageProps extends AppRootProps, WithStoreProps {}
+interface SchedulePageProps extends PageProps, WithStoreProps {}
interface SchedulePageState {
startMoment: dayjs.Dayjs;
@@ -66,8 +64,10 @@ class SchedulePage extends React.Component
}
async componentDidMount() {
- const { store } = this.props;
- const { id } = getQueryParams();
+ const {
+ store,
+ query: { id },
+ } = this.props;
store.userStore.updateItems();
@@ -86,8 +86,10 @@ class SchedulePage extends React.Component
}
render() {
- const { store } = this.props;
- const { id: scheduleId } = getQueryParams();
+ const {
+ store,
+ query: { id: scheduleId },
+ } = this.props;
const {
startMoment,
@@ -112,139 +114,150 @@ class SchedulePage extends React.Component
return (
-
-
-
-
-
-
-
-
- {schedule?.name}
-
- {schedule &&
-
- {users && (
+ {() => (
+ <>
+
+
+
+
- Current timezone:
-
+
+
+ {schedule?.name}
+
+ {schedule &&
- )}
-
-
-
- Export
-
- {(schedule?.type === ScheduleType.Ical || schedule?.type === ScheduleType.Calendar) && (
-
- Reload
-
+
+ {users && (
+
+ Current timezone:
+
)}
+
+
+
+ Export
+
+ {(schedule?.type === ScheduleType.Ical || schedule?.type === ScheduleType.Calendar) && (
+
+ Reload
+
+ )}
+
+ {
+ this.setState({ showEditForm: true });
+ }}
+ />
+
+
+
- {
- this.setState({ showEditForm: true });
- }}
- />
-
-
-
-
-
-
+
+
-
-
-
-
-
- Today
-
-
-
-
-
-
+
+
+
+
+
+ Today
+
+
+
+
+
+
+
+
+ {startMoment.format('DD MMM')} - {startMoment.add(6, 'day').format('DD MMM')}
+
+
-
- {startMoment.format('DD MMM')} - {startMoment.add(6, 'day').format('DD MMM')}
-
-
-
-
-
-
-
+
+
{
- this.setState({ showEditForm: false });
- }}
- />
- )}
- {showScheduleICalSettings && (
- this.setState({ showScheduleICalSettings: false })}
- >
-
+ {showEditForm && (
+ {
+ this.setState({ showEditForm: false });
+ }}
+ />
+ )}
+ {showScheduleICalSettings && (
+ this.setState({ showScheduleICalSettings: false })}
+ >
+
+ )}
+
)}
@@ -293,8 +306,10 @@ class SchedulePage extends React.Component
};
updateEvents = () => {
- const { store } = this.props;
- const { id: scheduleId } = getQueryParams();
+ const {
+ store,
+ query: { id: scheduleId },
+ } = this.props;
const { startMoment } = this.state;
@@ -418,12 +433,12 @@ class SchedulePage extends React.Component
};
handleDelete = () => {
- const { store } = this.props;
- const { id: scheduleId } = getQueryParams();
+ const {
+ store,
+ query: { id: scheduleId },
+ } = this.props;
- store.scheduleStore.delete(scheduleId).then(() => {
- getLocationSrv().update({ query: { page: 'schedules' } });
- });
+ store.scheduleStore.delete(scheduleId).then(() => LocationHelper.update({ page: 'schedules' }, 'replace'));
};
}
diff --git a/grafana-plugin/src/pages/schedules/Schedules.tsx b/grafana-plugin/src/pages/schedules/Schedules.tsx
index 7b7cdbd1..18d6ca52 100644
--- a/grafana-plugin/src/pages/schedules/Schedules.tsx
+++ b/grafana-plugin/src/pages/schedules/Schedules.tsx
@@ -1,6 +1,5 @@
import React from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Button, HorizontalGroup, IconButton, LoadingPlaceholder, VerticalGroup } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
@@ -31,6 +30,7 @@ import { getStartOfWeek } from 'pages/schedule/Schedule.helpers';
import { WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import styles from './Schedules.module.css';
@@ -210,7 +210,7 @@ class SchedulesPage extends React.Component {
if (data.type === ScheduleType.API) {
- getLocationSrv().update({ query: { page: 'schedule', id: data.id } });
+ LocationHelper.update({ page: 'schedule', id: data.id }, 'replace');
}
};
@@ -259,9 +259,7 @@ class SchedulesPage extends React.Component {
- return () => {
- getLocationSrv().update({ query: { page: 'schedule', id: scheduleId } });
- };
+ return () => LocationHelper.update({ page: 'schedule', id: scheduleId }, 'replace');
};
renderType = (value: number) => {
diff --git a/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx b/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
index 2675f113..17ebd610 100644
--- a/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
+++ b/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
@@ -1,6 +1,5 @@
import React, { useCallback, useEffect, useState } from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Field, Input, Button, HorizontalGroup, Icon, VerticalGroup, LoadingPlaceholder } from '@grafana/ui';
import cn from 'classnames/bind';
import { observer } from 'mobx-react';
@@ -15,6 +14,7 @@ import { WithStoreProps } from 'state/types';
import { useStore } from 'state/useStore';
import { withMobXProviderContext } from 'state/withStore';
import { openErrorNotification } from 'utils';
+import LocationHelper from 'utils/LocationHelper';
import styles from './CloudPage.module.css';
@@ -116,7 +116,7 @@ const CloudPage = observer((_props: CloudPageProps) => {
variant="secondary"
size="sm"
className={cx('table-button')}
- onClick={() => getLocationSrv().update({ query: { page: 'users', p: page, id: user.id } })}
+ onClick={() => LocationHelper.update({ page: 'users', p: page, id: user.id }, 'replace')}
>
Configure notifications
diff --git a/grafana-plugin/src/pages/users/Users.tsx b/grafana-plugin/src/pages/users/Users.tsx
index 623b379b..6faa3b55 100644
--- a/grafana-plugin/src/pages/users/Users.tsx
+++ b/grafana-plugin/src/pages/users/Users.tsx
@@ -1,13 +1,11 @@
import React from 'react';
-import { getLocationSrv } from '@grafana/runtime';
import { Alert, Button, HorizontalGroup, Icon, VerticalGroup } from '@grafana/ui';
import { PluginPage } from 'PluginPage';
import cn from 'classnames/bind';
import { debounce } from 'lodash-es';
import { observer } from 'mobx-react';
import LegacyNavHeading from 'navbar/LegacyNavHeading';
-import { AppRootProps } from 'types';
import Avatar from 'components/Avatar/Avatar';
import GTable from 'components/GTable/GTable';
@@ -24,10 +22,10 @@ import { WithPermissionControl } from 'containers/WithPermissionControl/WithPerm
import { getRole } from 'models/user/user.helpers';
import { User as UserType, UserRole } from 'models/user/user.types';
import { pages } from 'pages';
-import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
-import { WithStoreProps } from 'state/types';
+import { PageProps, WithStoreProps } from 'state/types';
import { UserAction } from 'state/userAction';
import { withMobXProviderContext } from 'state/withStore';
+import LocationHelper from 'utils/LocationHelper';
import { getRealFilters, getUserRowClassNameFn } from './Users.helpers';
@@ -35,7 +33,7 @@ import styles from './Users.module.css';
const cx = cn.bind(styles);
-interface UsersProps extends WithStoreProps, AppRootProps {}
+interface UsersProps extends WithStoreProps, PageProps {}
const ITEMS_PER_PAGE = 100;
@@ -65,10 +63,10 @@ class Users extends React.Component {
initialUsersLoaded = false;
- private userId: string;
-
async componentDidMount() {
- const { p } = getQueryParams();
+ const {
+ query: { p },
+ } = this.props;
this.setState({ page: p ? Number(p) : 1 }, this.updateUsers);
this.parseParams();
@@ -83,11 +81,11 @@ class Users extends React.Component {
return;
}
- getLocationSrv().update({ query: { p: page }, partial: true });
+ LocationHelper.update({ p: page }, 'partial');
return await userStore.updateItems(getRealFilters(usersFilters), page);
};
- componentDidUpdate() {
+ componentDidUpdate(prevProps: UsersProps) {
const { store } = this.props;
if (!this.initialUsersLoaded && store.isUserActionAllowed(UserAction.ViewOtherUsers)) {
@@ -95,7 +93,7 @@ class Users extends React.Component {
this.initialUsersLoaded = true;
}
- if (this.userId !== getQueryParams()['id']) {
+ if (prevProps.query.id !== this.props.query.id) {
this.parseParams();
}
}
@@ -103,10 +101,10 @@ class Users extends React.Component {
parseParams = async () => {
this.setState({ errorData: initErrorDataState() }); // reset wrong team error to false on query parse
- const { store } = this.props;
- const { id } = getQueryParams();
-
- this.userId = id;
+ const {
+ store,
+ query: { id },
+ } = this.props;
if (id) {
await (id === 'me' ? store.userStore.loadCurrentUser() : store.userStore.loadUser(String(id), true)).catch(
@@ -182,74 +180,76 @@ class Users extends React.Component {
pageName="users"
itemNotFoundMessage={`User with id=${query?.id} is not found. Please select user from the list.`}
>
- <>
-
-
-
-
-
-
- Users
-
-
- To manage permissions or add users, please visit{' '}
- Grafana user management
-
+ {() => (
+ <>
+
+
+
-
-
- View my profile
-
-
-
- {store.isUserActionAllowed(UserAction.ViewOtherUsers) ? (
- <>
-
-
-
- Clear filters
+
+
+ View my profile
-
+
+
+ {store.isUserActionAllowed(UserAction.ViewOtherUsers) ? (
+ <>
+
+
+ Clear filters
+
+
-
+
+ ) : (
+
+ You don't have enough permissions to view other users because you are not Admin.{' '}
+ Click here to open your profile
+
+ }
+ severity="info"
/>
-
- ) : (
-
- You don't have enough permissions to view other users because you are not Admin.{' '}
- Click here to open your profile
-
- }
- severity="info"
- />
- )}
+ )}
+
+ {userPkToEdit &&
}
- {userPkToEdit &&
}
-
-
+
+ )}
);
@@ -378,7 +378,7 @@ class Users extends React.Component
{
handleHideUserSettings = () => {
this.setState({ userPkToEdit: undefined });
- getLocationSrv().update({ partial: true, query: { id: undefined } });
+ LocationHelper.update({ id: undefined }, 'partial');
};
handleUserUpdate = () => {
diff --git a/grafana-plugin/src/plugin.json b/grafana-plugin/src/plugin.json
index d753a8e6..93e971a1 100644
--- a/grafana-plugin/src/plugin.json
+++ b/grafana-plugin/src/plugin.json
@@ -34,6 +34,7 @@
"name": "Alert Groups",
"path": "/a/grafana-oncall-app/?page=incidents",
"role": "Viewer",
+ "defaultNav": true,
"addToNav": true
},
{
diff --git a/grafana-plugin/src/plugin/GrafanaPluginRootPage.helpers.tsx b/grafana-plugin/src/plugin/GrafanaPluginRootPage.helpers.tsx
index 23854334..63b461be 100644
--- a/grafana-plugin/src/plugin/GrafanaPluginRootPage.helpers.tsx
+++ b/grafana-plugin/src/plugin/GrafanaPluginRootPage.helpers.tsx
@@ -8,7 +8,17 @@ export function getQueryParams(): any {
const searchParams = new URLSearchParams(window.location.search);
const result = {};
for (const [key, value] of searchParams) {
- result[key] = value;
+ if (result[key]) {
+ // key already existing, we're handling an array
+ if (!Array.isArray(result[key])) {
+ result[key] = new Array(result[key]);
+ }
+
+ result[key].push(value);
+ } else {
+ result[key] = value;
+ }
}
+
return result;
}
diff --git a/grafana-plugin/src/plugin/GrafanaPluginRootPage.tsx b/grafana-plugin/src/plugin/GrafanaPluginRootPage.tsx
index d2b4cd59..43288bb3 100644
--- a/grafana-plugin/src/plugin/GrafanaPluginRootPage.tsx
+++ b/grafana-plugin/src/plugin/GrafanaPluginRootPage.tsx
@@ -35,7 +35,7 @@ import 'style/vars.css';
import 'style/global.css';
import 'style/utils.css';
-import { isTopNavbar } from './GrafanaPluginRootPage.helpers';
+import { getQueryParams, isTopNavbar } from './GrafanaPluginRootPage.helpers';
import PluginSetup from './PluginSetup';
export const GrafanaPluginRootPage = (props: AppRootProps) => (
@@ -101,7 +101,7 @@ export const Root = observer((props: AppRootProps) => {
'u-position-relative'
)}
>
-
);
diff --git a/grafana-plugin/src/state/types.ts b/grafana-plugin/src/state/types.ts
index 642df664..9f9eccbd 100644
--- a/grafana-plugin/src/state/types.ts
+++ b/grafana-plugin/src/state/types.ts
@@ -1,9 +1,16 @@
+import { AppPluginMeta, KeyValue } from '@grafana/data';
+
import { RootStore } from 'state/index';
export interface WithStoreProps {
store: RootStore;
}
+export interface PageProps
{
+ meta: AppPluginMeta;
+ query: KeyValue;
+}
+
export interface SelectOption {
value: string | number;
display_name: string;
diff --git a/grafana-plugin/src/style/global.css b/grafana-plugin/src/style/global.css
index 07a8af39..fe3e65a2 100644
--- a/grafana-plugin/src/style/global.css
+++ b/grafana-plugin/src/style/global.css
@@ -39,3 +39,7 @@
.navbarRootFallback {
margin-top: 24px;
}
+
+.page-title {
+ margin-bottom: 16px;
+}
diff --git a/grafana-plugin/src/utils/LocationHelper.ts b/grafana-plugin/src/utils/LocationHelper.ts
new file mode 100644
index 00000000..27bfe38f
--- /dev/null
+++ b/grafana-plugin/src/utils/LocationHelper.ts
@@ -0,0 +1,43 @@
+import { KeyValue } from '@grafana/data';
+import { locationService } from '@grafana/runtime';
+
+import { getQueryParams } from 'plugin/GrafanaPluginRootPage.helpers';
+
+class LocationHelper {
+ update(params: KeyValue, method: 'replace' | 'push' | 'partial') {
+ const queryParams = getQueryParams();
+
+ const sortedExistingParams = sort(queryParams);
+ const sortedNewParams = sort(params);
+
+ if (toQueryString(sortedExistingParams) !== toQueryString(sortedNewParams)) {
+ if (method === 'partial') {
+ locationService.partial(params);
+ } else {
+ locationService[method](toQueryString(sortedNewParams));
+ }
+ }
+ }
+}
+
+function toQueryString(queryParams: KeyValue) {
+ const urlParams = new URLSearchParams(queryParams);
+ for (const [key, value] of Object.entries(queryParams)) {
+ if (Array.isArray(value)) {
+ urlParams.delete(key);
+ value.forEach((v) => urlParams.append(key, v));
+ }
+ }
+ return urlParams.toString();
+}
+
+function sort(object: KeyValue) {
+ return Object.keys(object)
+ .sort()
+ .reduce((obj, key) => {
+ obj[key] = object[key];
+ return obj;
+ }, {});
+}
+
+export default new LocationHelper();
diff --git a/grafana-plugin/yarn.lock b/grafana-plugin/yarn.lock
index 6c6098e2..a11f7b61 100644
--- a/grafana-plugin/yarn.lock
+++ b/grafana-plugin/yarn.lock
@@ -1492,6 +1492,32 @@
uplot "1.6.22"
xss "1.0.13"
+"@grafana/data@9.2.6":
+ version "9.2.6"
+ resolved "https://registry.yarnpkg.com/@grafana/data/-/data-9.2.6.tgz#a8b108fe882a16349e903013e62cb6c741f82135"
+ integrity sha512-x8a246dsy895TXlQ0aeAawbPOYAvitS+rlFA6t1mT9XvO51LU/UeeNAkGzaCdtO1NBaJ4rDLmj1sQVu++uQvwA==
+ dependencies:
+ "@braintree/sanitize-url" "6.0.0"
+ "@grafana/schema" "9.2.6"
+ "@types/d3-interpolate" "^1.4.0"
+ d3-interpolate "1.4.0"
+ date-fns "2.29.1"
+ eventemitter3 "4.0.7"
+ fast_array_intersect "1.1.0"
+ history "4.10.1"
+ lodash "4.17.21"
+ marked "4.1.0"
+ moment "2.29.4"
+ moment-timezone "0.5.35"
+ ol "6.15.1"
+ papaparse "5.3.2"
+ regenerator-runtime "0.13.9"
+ rxjs "7.5.6"
+ tinycolor2 "1.4.2"
+ tslib "2.4.0"
+ uplot "1.6.22"
+ xss "1.0.13"
+
"@grafana/e2e-selectors@9.2.4":
version "9.2.4"
resolved "https://registry.yarnpkg.com/@grafana/e2e-selectors/-/e2e-selectors-9.2.4.tgz#748539cc0313ee1c23055a100313235ef2fca64b"
@@ -1501,6 +1527,15 @@
tslib "2.4.0"
typescript "4.8.2"
+"@grafana/e2e-selectors@9.2.6":
+ version "9.2.6"
+ resolved "https://registry.yarnpkg.com/@grafana/e2e-selectors/-/e2e-selectors-9.2.6.tgz#9dc9bd960ffb3edab6927e41848a84adb2fcb889"
+ integrity sha512-Q6E4CYrf0d0fz6aJmW7neQNr+P1RJ8ocNACk+039LceCVjVECHq9b6UcwCQN1Q3D4Omb9jyMcOLrhCMoTd0nzw==
+ dependencies:
+ "@grafana/tsconfig" "^1.2.0-rc1"
+ tslib "2.4.0"
+ typescript "4.8.2"
+
"@grafana/eslint-config@5.0.0", "@grafana/eslint-config@^5.0.0":
version "5.0.0"
resolved "https://registry.yarnpkg.com/@grafana/eslint-config/-/eslint-config-5.0.0.tgz#e08a89d378772340bc6cd1872ec4d15666269aba"
@@ -1538,10 +1573,17 @@
dependencies:
tslib "2.4.0"
+"@grafana/schema@9.2.6":
+ version "9.2.6"
+ resolved "https://registry.yarnpkg.com/@grafana/schema/-/schema-9.2.6.tgz#998d5a40cacf6cfb0e15bb313bf73929e69a2852"
+ integrity sha512-7eptiYi4N9gnxXxBdcE0Z/WFz41B094gr8F+mh+nEJNPNSz1wZ3/HEaa2cWVhYPXqy1qE1bOQHvSj69erfcqXg==
+ dependencies:
+ tslib "2.4.0"
+
"@grafana/toolkit@^9.2.4":
- version "9.2.4"
- resolved "https://registry.yarnpkg.com/@grafana/toolkit/-/toolkit-9.2.4.tgz#91ab3c391297a4b1ee5d4a8a0deb9118739b6295"
- integrity sha512-EHaXvJAVlN9lf0iQoBh9V6XZxWmgPPRrJazJS551jG1nWnk6ycvz7yqxKhXB4Jk0MnLZGBtPFPh/CczcYoVnrw==
+ version "9.2.6"
+ resolved "https://registry.yarnpkg.com/@grafana/toolkit/-/toolkit-9.2.6.tgz#55d424321a65a027f3365c6e0df649bcc1d2c9d6"
+ integrity sha512-Bs604AR65yb+MuLRUFYh9abaExDraHXh/Mc5Xqo5hDALPs/e5BjYHYB9LAL2KI8ihxu9y6c2hWcpZwno/7k32Q==
dependencies:
"@babel/core" "7.18.9"
"@babel/plugin-proposal-class-properties" "7.18.6"
@@ -1555,10 +1597,10 @@
"@babel/preset-env" "7.18.9"
"@babel/preset-react" "7.18.6"
"@babel/preset-typescript" "7.18.6"
- "@grafana/data" "9.2.4"
+ "@grafana/data" "9.2.6"
"@grafana/eslint-config" "5.0.0"
"@grafana/tsconfig" "^1.2.0-rc1"
- "@grafana/ui" "9.2.4"
+ "@grafana/ui" "9.2.6"
"@jest/core" "27.5.1"
"@types/command-exists" "^1.2.0"
"@types/eslint" "8.4.1"
@@ -1699,6 +1741,72 @@
uplot "1.6.22"
uuid "8.3.2"
+"@grafana/ui@9.2.6":
+ version "9.2.6"
+ resolved "https://registry.yarnpkg.com/@grafana/ui/-/ui-9.2.6.tgz#1974edb48b5873c257278886b65ccb1d7e45a33a"
+ integrity sha512-NM+tNbpks218QHQo9hywr/00fMOjQt0shf3Sq2ywr8e172PXuPxh/AuTACKuVFgW2FY1z5StFUc2B40Dgvn0JQ==
+ dependencies:
+ "@emotion/css" "11.9.0"
+ "@emotion/react" "11.9.3"
+ "@grafana/data" "9.2.6"
+ "@grafana/e2e-selectors" "9.2.6"
+ "@grafana/schema" "9.2.6"
+ "@monaco-editor/react" "4.4.5"
+ "@popperjs/core" "2.11.5"
+ "@react-aria/button" "3.6.1"
+ "@react-aria/dialog" "3.3.1"
+ "@react-aria/focus" "3.8.0"
+ "@react-aria/menu" "3.6.1"
+ "@react-aria/overlays" "3.10.1"
+ "@react-aria/utils" "3.13.1"
+ "@react-stately/menu" "3.4.1"
+ "@sentry/browser" "6.19.7"
+ ansicolor "1.1.100"
+ calculate-size "1.1.1"
+ classnames "2.3.1"
+ core-js "3.25.1"
+ d3 "5.15.0"
+ date-fns "2.29.1"
+ hoist-non-react-statics "3.3.2"
+ immutable "4.1.0"
+ is-hotkey "0.2.0"
+ jquery "3.6.0"
+ lodash "4.17.21"
+ memoize-one "6.0.0"
+ moment "2.29.4"
+ monaco-editor "0.34.0"
+ ol "6.15.1"
+ prismjs "1.29.0"
+ rc-cascader "3.6.1"
+ rc-drawer "4.4.3"
+ rc-slider "9.7.5"
+ rc-time-picker "^3.7.3"
+ react-beautiful-dnd "13.1.0"
+ react-calendar "3.7.0"
+ react-colorful "5.5.1"
+ react-custom-scrollbars-2 "4.5.0"
+ react-dropzone "14.2.2"
+ react-highlight-words "0.18.0"
+ react-hook-form "7.5.3"
+ react-inlinesvg "3.0.0"
+ react-popper "2.3.0"
+ react-popper-tooltip "^4.3.1"
+ react-router-dom "^5.2.0"
+ react-select "5.4.0"
+ react-select-event "^5.1.0"
+ react-table "7.8.0"
+ react-transition-group "4.4.2"
+ react-use "17.4.0"
+ react-window "1.8.7"
+ rxjs "7.5.6"
+ slate "0.47.9"
+ slate-plain-serializer "0.7.11"
+ slate-react "0.22.10"
+ tinycolor2 "1.4.2"
+ tslib "2.4.0"
+ uplot "1.6.22"
+ uuid "8.3.2"
+
"@humanwhocodes/config-array@^0.11.6":
version "0.11.7"
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.7.tgz#38aec044c6c828f6ed51d5d7ae3d9b9faf6dbb0f"
@@ -3797,7 +3905,15 @@ ansicolor@1.1.100:
resolved "https://registry.yarnpkg.com/ansicolor/-/ansicolor-1.1.100.tgz#811f1afbf726edca3aafb942a14df8351996304a"
integrity sha512-Jl0pxRfa9WaQVUX57AB8/V2my6FJxrOR1Pp2qqFbig20QB4HzUoQ48THTKAgHlUCJeQm/s2WoOPcoIDhyCL/kw==
-anymatch@^3.0.0, anymatch@^3.0.3, anymatch@~3.1.2:
+anymatch@^3.0.0, anymatch@~3.1.2:
+ version "3.1.3"
+ resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
+ integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==
+ dependencies:
+ normalize-path "^3.0.0"
+ picomatch "^2.0.4"
+
+anymatch@^3.0.3:
version "3.1.2"
resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.2.tgz#c0557c096af32f106198f4f4e2a383537e378716"
integrity sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==
@@ -4328,7 +4444,12 @@ caniuse-api@^3.0.0:
lodash.memoize "^4.1.2"
lodash.uniq "^4.5.0"
-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001426:
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001426:
+ version "1.0.30001434"
+ resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001434.tgz#ec1ec1cfb0a93a34a0600d37903853030520a4e5"
+ integrity sha512-aOBHrLmTQw//WFa2rcF1If9fa3ypkC1wzqqiKHgfdrXTWcU8C4gKVZT77eQAPWN1APys3+uQ0Df07rKauXGEYA==
+
+caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001400:
version "1.0.30001431"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001431.tgz#e7c59bd1bc518fae03a4656be442ce6c4887a795"
integrity sha512-zBUoFU0ZcxpvSt9IU66dXVT/3ctO1cy4y9cscs1szkPlcWb6pasYM144GqrUygUbT+k7cmUCW61cvskjcv0enQ==
@@ -4756,7 +4877,14 @@ copy-webpack-plugin@^9.0.1:
schema-utils "^3.1.1"
serialize-javascript "^6.0.0"
-core-js-compat@^3.21.0, core-js-compat@^3.22.1, core-js-compat@^3.25.1:
+core-js-compat@^3.21.0, core-js-compat@^3.22.1:
+ version "3.26.1"
+ resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.26.1.tgz#0e710b09ebf689d719545ac36e49041850f943df"
+ integrity sha512-622/KzTudvXCDLRw70iHW4KKs1aGpcRcowGWyYJr2DEBfRrd6hNJybxSWJFuZYD4ma86xhrwDDHxmDaIq4EA8A==
+ dependencies:
+ browserslist "^4.21.4"
+
+core-js-compat@^3.25.1:
version "3.26.0"
resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.26.0.tgz#94e2cf8ba3e63800c4956ea298a6473bc9d62b44"
integrity sha512-piOX9Go+Z4f9ZiBFLnZ5VrOpBl0h7IGCkiFUN11QTe6LjAvOT3ifL/5TdoizMh99hcGy5SoLyWbapIY/PIb/3A==
@@ -4789,7 +4917,7 @@ cosmiconfig@^6.0.0:
path-type "^4.0.0"
yaml "^1.7.2"
-cosmiconfig@^7.0.0, cosmiconfig@^7.0.1:
+cosmiconfig@^7.0.0:
version "7.0.1"
resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.0.1.tgz#714d756522cace867867ccb4474c5d01bbae5d6d"
integrity sha512-a1YWNUV2HwGimB7dU2s1wUMurNKjpx60HxBB6xUM8Re+2s1g1IIfJvFR0/iCF+XHdE0GMTKTuLR32UQff4TEyQ==
@@ -4800,6 +4928,17 @@ cosmiconfig@^7.0.0, cosmiconfig@^7.0.1:
path-type "^4.0.0"
yaml "^1.10.0"
+cosmiconfig@^7.0.1:
+ version "7.1.0"
+ resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.1.0.tgz#1443b9afa596b670082ea46cbd8f6a62b84635f6"
+ integrity sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==
+ dependencies:
+ "@types/parse-json" "^4.0.0"
+ import-fresh "^3.2.1"
+ parse-json "^5.0.0"
+ path-type "^4.0.0"
+ yaml "^1.10.0"
+
create-require@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
@@ -4857,18 +4996,18 @@ css-in-js-utils@^2.0.0:
isobject "^3.0.1"
css-loader@^6.7.1:
- version "6.7.1"
- resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.7.1.tgz#e98106f154f6e1baf3fc3bc455cb9981c1d5fd2e"
- integrity sha512-yB5CNFa14MbPJcomwNh3wLThtkZgcNyI2bNMRt8iE5Z8Vwl7f8vQXFAzn2HDOJvtDq2NTZBUGMSUNNyrv3/+cw==
+ version "6.7.2"
+ resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.7.2.tgz#26bc22401b5921686a10fbeba75d124228302304"
+ integrity sha512-oqGbbVcBJkm8QwmnNzrFrWTnudnRZC+1eXikLJl0n4ljcfotgRifpg2a1lKy8jTrc4/d9A/ap1GFq1jDKG7J+Q==
dependencies:
icss-utils "^5.1.0"
- postcss "^8.4.7"
+ postcss "^8.4.18"
postcss-modules-extract-imports "^3.0.0"
postcss-modules-local-by-default "^4.0.0"
postcss-modules-scope "^3.0.0"
postcss-modules-values "^4.0.0"
postcss-value-parser "^4.2.0"
- semver "^7.3.5"
+ semver "^7.3.8"
css-mediaquery@^0.1.2:
version "0.1.2"
@@ -5647,7 +5786,7 @@ end-of-stream@^1.1.0:
dependencies:
once "^1.4.0"
-enhanced-resolve@^5.0.0, enhanced-resolve@^5.10.0:
+enhanced-resolve@^5.0.0:
version "5.10.0"
resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.10.0.tgz#0dc579c3bb2a1032e357ac45b8f3a6f3ad4fb1e6"
integrity sha512-T0yTFjdpldGY8PmuXXR0PyQ1ufZpEGiHVrp7zHKB7jdR4qlmZHhONVM5AQOAWXuF/w3dnHbEQVrNptJgt7F+cQ==
@@ -5655,6 +5794,14 @@ enhanced-resolve@^5.0.0, enhanced-resolve@^5.10.0:
graceful-fs "^4.2.4"
tapable "^2.2.0"
+enhanced-resolve@^5.10.0:
+ version "5.11.0"
+ resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.11.0.tgz#543cf6c847a85adba0c4a5e2170bded4d493919a"
+ integrity sha512-0Gcraf7gAJSQoPg+bTSXNhuzAYtXqLc4C011vb8S3B8XUSEkGYNBk20c68X9291VF4vvsCD8SPkr6Mza+DwU+g==
+ dependencies:
+ graceful-fs "^4.2.9"
+ tapable "^2.2.0"
+
enquirer@^2.3.6:
version "2.3.6"
resolved "https://registry.yarnpkg.com/enquirer/-/enquirer-2.3.6.tgz#2a7fe5dd634a1e4125a975ec994ff5456dc3734d"
@@ -8565,18 +8712,18 @@ loader-runner@^4.2.0:
integrity sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==
loader-utils@^2.0.0:
- version "2.0.3"
- resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.3.tgz#d4b15b8504c63d1fc3f2ade52d41bc8459d6ede1"
- integrity sha512-THWqIsn8QRnvLl0shHYVBN9syumU8pYWEHPTmkiVGd+7K5eFNVSY6AJhRvgGF70gg1Dz+l/k8WicvFCxdEs60A==
+ version "2.0.4"
+ resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.4.tgz#8b5cb38b5c34a9a018ee1fc0e6a066d1dfcc528c"
+ integrity sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==
dependencies:
big.js "^5.2.2"
emojis-list "^3.0.0"
json5 "^2.1.2"
loader-utils@^3.2.0:
- version "3.2.0"
- resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-3.2.0.tgz#bcecc51a7898bee7473d4bc6b845b23af8304d4f"
- integrity sha512-HVl9ZqccQihZ7JM85dco1MvO9G+ONvxoGa9rkhzFsneGLKSUg1gJf9bWzhRhcvm2qChhWpebQhP44qxjKIUCaQ==
+ version "3.2.1"
+ resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-3.2.1.tgz#4fb104b599daafd82ef3e1a41fb9265f87e1f576"
+ integrity sha512-ZvFw1KWS3GVyYBYb7qkmRM/WwL2TQQBxgCK62rlvm4WpVQ23Nb4tYjApUlfjrEGvOs7KHEsmyUn75OHZrJMWPw==
locate-path@^3.0.0:
version "3.0.0"
@@ -8835,9 +8982,9 @@ mdn-data@2.0.14:
integrity sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==
memfs@^3.1.2, memfs@^3.4.1:
- version "3.4.10"
- resolved "https://registry.yarnpkg.com/memfs/-/memfs-3.4.10.tgz#4cdff7cfd21351a85e11b08aa276ebf100210a4d"
- integrity sha512-0bCUP+L79P4am30yP1msPzApwuMQG23TjwlwdHeEV5MxioDR1a0AgB0T9FfggU52eJuDCq8WVwb5ekznFyWiTQ==
+ version "3.4.12"
+ resolved "https://registry.yarnpkg.com/memfs/-/memfs-3.4.12.tgz#d00f8ad8dab132dc277c659dc85bfd14b07d03bd"
+ integrity sha512-BcjuQn6vfqP+k100e0E9m61Hyqa//Brp+I3f0OBmN0ATHlFA8vx3Lt8z57R3u2bPqe3WGDBC+nF72fTH7isyEw==
dependencies:
fs-monkey "^1.0.3"
@@ -8957,9 +9104,9 @@ min-indent@^1.0.0:
integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
mini-css-extract-plugin@^2.6.0:
- version "2.6.1"
- resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.6.1.tgz#9a1251d15f2035c342d99a468ab9da7a0451b71e"
- integrity sha512-wd+SD57/K6DiV7jIR34P+s3uckTRuQvx0tKPcvjFlrEylk6P4mQ2KSWk1hblj1Kxaqok7LogKOieygXqBczNlg==
+ version "2.7.0"
+ resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.0.tgz#d7d9ba0c5b596d155e36e2b174082fc7f010dd64"
+ integrity sha512-auqtVo8KhTScMsba7MbijqZTfibbXiBNlPAQbsVt7enQfcDYLdgG57eGxMqwVU3mfeWANY4F1wUg+rMF+ycZgw==
dependencies:
schema-utils "^4.0.0"
@@ -9124,9 +9271,9 @@ natural-compare@^1.4.0:
integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==
needle@^3.1.0:
- version "3.1.0"
- resolved "https://registry.yarnpkg.com/needle/-/needle-3.1.0.tgz#3bf5cd090c28eb15644181ab6699e027bd6c53c9"
- integrity sha512-gCE9weDhjVGCRqS8dwDR/D3GTAeyXLXuqp7I8EzH6DllZGXSUyxuqqLh+YX9rMAWaaTFyVAg6rHGL25dqvczKw==
+ version "3.2.0"
+ resolved "https://registry.yarnpkg.com/needle/-/needle-3.2.0.tgz#07d240ebcabfd65c76c03afae7f6defe6469df44"
+ integrity sha512-oUvzXnyLiVyVGoianLijF9O/RecZUf7TkBfimjGrLM4eQhXyeJwM6GeAWccwfQ9aa4gMCZKqhAOuLaMIcQxajQ==
dependencies:
debug "^3.2.6"
iconv-lite "^0.6.3"
@@ -10289,7 +10436,15 @@ postcss-selector-not@^5.0.0:
dependencies:
balanced-match "^1.0.0"
-postcss-selector-parser@^6.0.10, postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4, postcss-selector-parser@^6.0.5, postcss-selector-parser@^6.0.9:
+postcss-selector-parser@^6.0.10, postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4, postcss-selector-parser@^6.0.9:
+ version "6.0.11"
+ resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz#2e41dc39b7ad74046e1615185185cd0b17d0c8dc"
+ integrity sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==
+ dependencies:
+ cssesc "^3.0.0"
+ util-deprecate "^1.0.2"
+
+postcss-selector-parser@^6.0.5:
version "6.0.10"
resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz#79b61e2c0d1bfc2602d549e11d0876256f8df88d"
integrity sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==
@@ -10330,10 +10485,10 @@ postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.26, postcss@^7.0.
picocolors "^0.2.1"
source-map "^0.6.1"
-postcss@^8.3.5, postcss@^8.4.12, postcss@^8.4.7:
- version "8.4.18"
- resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.18.tgz#6d50046ea7d3d66a85e0e782074e7203bc7fbca2"
- integrity sha512-Wi8mWhncLJm11GATDaQKobXSNEYGUHeQLiQqDFG1qQ5UTDPTEvKw0Xt5NsTpktGTwLps3ByrWsBrG0rB8YQ9oA==
+postcss@^8.3.5, postcss@^8.4.12, postcss@^8.4.18:
+ version "8.4.19"
+ resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.19.tgz#61178e2add236b17351897c8bcc0b4c8ecab56fc"
+ integrity sha512-h+pbPsyhlYj6N2ozBmHhHrs9DzGmbaarbLvWipMRO7RLS+v4onj26MPFXA5OBYFxyqYhUJK456SwDcY9H2/zsA==
dependencies:
nanoid "^3.3.4"
picocolors "^1.0.0"
@@ -11669,9 +11824,9 @@ signal-exit@^3.0.2, signal-exit@^3.0.3:
integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==
simple-git@^3.6.0:
- version "3.14.1"
- resolved "https://registry.yarnpkg.com/simple-git/-/simple-git-3.14.1.tgz#68018a5f168f8a568862e30b692004b37c3b5ced"
- integrity sha512-1ThF4PamK9wBORVGMK9HK5si4zoGS2GpRO7tkAFObA4FZv6dKaCVHLQT+8zlgiBm6K2h+wEU9yOaFCu/SR3OyA==
+ version "3.15.0"
+ resolved "https://registry.yarnpkg.com/simple-git/-/simple-git-3.15.0.tgz#301a95a943c4f9b0a21d051eb6e6d0ffe4c9754f"
+ integrity sha512-FiWoMPlcYHQ+ApRihUsGjC/ZmIlWj62S6MBCwOunczvXcLQt+9ZdrysDrR6QVepkRQfEAaBXrN2QtJKrN6zbtg==
dependencies:
"@kwsites/file-exists" "^1.1.1"
"@kwsites/promise-deferred" "^1.1.1"