Fetch selected value of notify schedule in escalation policy (#3969)

# What this PR does

- Fetch selected schedule on mount which is not done as soon as schedule
is not on the first page
- Add missing observer decorator
- Fix incorrect HTTP calls when creating integrations
https://raintank-corp.slack.com/archives/C04JCU51NF8/p1708703429829919

## Which issue(s) this PR fixes

https://github.com/grafana/oncall/issues/3966

## Checklist

- [x] Unit, integration, and e2e (if applicable) tests updated
- [x] Documentation added (or `pr:no public docs` PR label added if not
required)
- [x] `CHANGELOG.md` updated (or `pr:no changelog` PR label added if not
required)

grafana-plugin/src/components/Policy/EscalationPolicy.tsx

@@ -3,6 +3,7 @@ import React, { ChangeEvent } from 'react';
 import { SelectableValue } from '@grafana/data';
 import { Button, Input, Select, IconButton } from '@grafana/ui';
 import cn from 'classnames/bind';
+import { observer } from 'mobx-react';
 import moment from 'moment-timezone';
 import { SortableElement } from 'react-sortable-hoc';
 import reactStringReplace from 'react-string-replace';
@@ -56,7 +57,14 @@ export interface EscalationPolicyProps extends ElementSortableProps {
   isSlackInstalled: boolean;
 }
 
+@observer
 class _EscalationPolicy extends React.Component<EscalationPolicyProps, any> {
+  componentDidMount() {
+    if (this.props.data.notify_schedule) {
+      this.props.store.scheduleStore.loadItem(this.props.data.notify_schedule);
+    }
+  }
+
   render() {
     const { data, escalationChoices, number, isDisabled, backgroundClassName, backgroundHexNumber } = this.props;
     const { id, step, is_final } = data;

grafana-plugin/src/containers/IntegrationForm/IntegrationForm.tsx

@@ -239,6 +239,7 @@ export const IntegrationForm = observer((props: IntegrationFormProps) => {
 
       if (!IntegrationHelper.isSpecificIntegration(selectedOption.value, 'grafana_alerting')) {
         pushHistory(response.id);
+        return;
       }
 
       await (data.is_existing

grafana-plugin/src/pages/integration/Integration.helper.ts

@@ -71,10 +71,6 @@ export const IntegrationHelper = {
     return hasSlack || hasTelegram || isMSTeamsInstalled;
   },
 
-  fetchChatOps(store: RootStore): Promise<void> {
-    return store.msteamsChannelStore.updateMSTeamsChannels();
-  },
-
   getChatOpsChannels(channelFilter: ChannelFilter, store: RootStore): Array<{ name: string; icon: IconName }> {
     const channels: Array<{ name: string; icon: IconName }> = [];
     const telegram = Object.keys(store.telegramChannelStore.items).map((k) => store.telegramChannelStore.items[k]);

grafana-plugin/src/pages/integration/Integration.tsx

@@ -750,8 +750,7 @@ class _IntegrationPage extends React.Component<IntegrationProps, IntegrationStat
 
   async loadData() {
     const {
-      store,
-      store: { alertReceiveChannelStore },
+      store: { alertReceiveChannelStore, msteamsChannelStore, hasFeature },
       match: {
         params: { id },
       },
@@ -771,7 +770,9 @@ class _IntegrationPage extends React.Component<IntegrationProps, IntegrationStat
     }
 
     promises.push(alertReceiveChannelStore.fetchTemplates(id));
-    promises.push(IntegrationHelper.fetchChatOps(store));
+    if (hasFeature(AppFeature.MsTeams)) {
+      promises.push(msteamsChannelStore.updateMSTeamsChannels());
+    }
     promises.push(alertReceiveChannelStore.fetchCountersForIntegration(id));
 
     await Promise.all(promises)