diff --git a/grafana-plugin/src/models/outgoing_webhook/outgoing_webhook.ts b/grafana-plugin/src/models/outgoing_webhook/outgoing_webhook.ts index ab70799a..a5e70b59 100644 --- a/grafana-plugin/src/models/outgoing_webhook/outgoing_webhook.ts +++ b/grafana-plugin/src/models/outgoing_webhook/outgoing_webhook.ts @@ -19,6 +19,18 @@ export class OutgoingWebhookStore extends BaseStore { this.path = '/custom_buttons/'; } + @action + async loadItem(id: OutgoingWebhook['id'], skipErrorHandling: boolean = false): Promise { + const outgoingWebhook = await this.getById(id, skipErrorHandling); + + this.items = { + ...this.items, + [id]: outgoingWebhook, + }; + + return outgoingWebhook; + } + @action async updateById(id: OutgoingWebhook['id']) { const response = await this.getById(id); diff --git a/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx index 6ced40da..0c427e75 100644 --- a/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx +++ b/grafana-plugin/src/pages/outgoing_webhooks/OutgoingWebhooks.tsx @@ -21,6 +21,8 @@ import { UserAction } from 'state/userAction'; import { withMobXProviderContext } from 'state/withStore'; import styles from './OutgoingWebhooks.module.css'; +import { getWrongTeamResponseInfo } from 'components/NotFoundInTeam/WrongTeam.helpers'; +import WrongTeamStub from 'components/NotFoundInTeam/WrongTeamStub'; const cx = cn.bind(styles); @@ -28,11 +30,18 @@ interface OutgoingWebhooksProps extends WithStoreProps, AppRootProps {} interface OutgoingWebhooksState { outgoingWebhookIdToEdit?: OutgoingWebhook['id'] | 'new'; + notFound?: boolean; + wrongTeamError?: boolean; + teamToSwitch?: { name: string; id: string }; + wrongTeamNoPermissions?: boolean; } @observer class OutgoingWebhooks extends React.Component { - state: OutgoingWebhooksState = {}; + state: OutgoingWebhooksState = { + wrongTeamError: false, + wrongTeamNoPermissions: false, + }; async componentDidMount() { this.update().then(this.parseQueryParams); @@ -44,12 +53,16 @@ class OutgoingWebhooks extends React.Component { + parseQueryParams = async () => { const { store, query: { id }, } = this.props; + await store.outgoingWebhookStore + .loadItem(id, true) + .catch((error) => this.setState({ ...getWrongTeamResponseInfo(error) })); + if (id) { this.setState({ outgoingWebhookIdToEdit: id }); } @@ -57,14 +70,28 @@ class OutgoingWebhooks extends React.Component { const { store } = this.props; - const { selectedAlertReceiveChannel } = store; return store.outgoingWebhookStore.updateItems(); }; render() { const { store } = this.props; - const { outgoingWebhookIdToEdit } = this.state; + const { outgoingWebhookIdToEdit, wrongTeamError, teamToSwitch, wrongTeamNoPermissions } = this.state; + + if (wrongTeamError) { + const currentTeamId = store.userStore.currentUser?.current_team; + const currentTeamName = store.grafanaTeamStore.items[currentTeamId]?.name; + + return ( + + ); + } const webhooks = store.outgoingWebhookStore.getSearchResult();