Optimize schedules select in escalation page (#129)

* Add FastScheduleSerializer

* Linting

* Chnaged Gselect for RemoteSelect for notifySchedules in escalation policies

Co-authored-by: Yulia Shanyrova <yulia.shanyrova@grafana.com>

engine/apps/api/serializers/schedule_base.py

@@ -3,6 +3,7 @@ from rest_framework import serializers
 
 from apps.api.serializers.user_group import UserGroupSerializer
 from apps.schedules.ical_utils import list_users_to_notify_from_ical
+from apps.schedules.models import OnCallSchedule
 from apps.schedules.tasks import schedule_notify_about_empty_shifts_in_schedule, schedule_notify_about_gaps_in_schedule
 from common.api_helpers.custom_fields import TeamPrimaryKeyRelatedField
 from common.api_helpers.mixins import EagerLoadingMixin
@@ -83,3 +84,14 @@ class ScheduleBaseSerializer(EagerLoadingMixin, serializers.ModelSerializer):
         created_schedule.check_gaps_for_next_week()
         schedule_notify_about_gaps_in_schedule.apply_async((created_schedule.pk,))
         return created_schedule
+
+
+class ScheduleFastSerializer(serializers.ModelSerializer):
+    id = serializers.CharField(read_only=True, source="public_primary_key")
+
+    class Meta:
+        model = OnCallSchedule
+        fields = [
+            "id",
+            "name",
+        ]

engine/apps/api/views/schedule.py

@@ -17,6 +17,7 @@ from rest_framework.views import Response
 from rest_framework.viewsets import ModelViewSet
 
 from apps.api.permissions import MODIFY_ACTIONS, READ_ACTIONS, ActionPermission, AnyRole, IsAdmin, IsAdminOrEditor
+from apps.api.serializers.schedule_base import ScheduleFastSerializer
 from apps.api.serializers.schedule_polymorphic import (
     PolymorphicScheduleCreateSerializer,
     PolymorphicScheduleSerializer,
@@ -31,10 +32,17 @@ from apps.slack.models import SlackChannel
 from apps.slack.tasks import update_slack_user_group_for_schedules
 from apps.user_management.organization_log_creator import OrganizationLogType, create_organization_log
 from common.api_helpers.exceptions import BadRequest, Conflict
-from common.api_helpers.mixins import CreateSerializerMixin, PublicPrimaryKeyMixin, UpdateSerializerMixin
+from common.api_helpers.mixins import (
+    CreateSerializerMixin,
+    PublicPrimaryKeyMixin,
+    ShortSerializerMixin,
+    UpdateSerializerMixin,
+)
 
 
-class ScheduleView(PublicPrimaryKeyMixin, CreateSerializerMixin, UpdateSerializerMixin, ModelViewSet):
+class ScheduleView(
+    PublicPrimaryKeyMixin, ShortSerializerMixin, CreateSerializerMixin, UpdateSerializerMixin, ModelViewSet
+):
     authentication_classes = (PluginAuthentication,)
     permission_classes = (IsAuthenticated, ActionPermission)
     action_permissions = {
@@ -56,6 +64,7 @@ class ScheduleView(PublicPrimaryKeyMixin, CreateSerializerMixin, UpdateSerialize
     serializer_class = PolymorphicScheduleSerializer
     create_serializer_class = PolymorphicScheduleCreateSerializer
     update_serializer_class = PolymorphicScheduleUpdateSerializer
+    short_serializer_class = ScheduleFastSerializer
 
     @cached_property
     def can_update_user_groups(self):
@@ -80,19 +89,22 @@ class ScheduleView(PublicPrimaryKeyMixin, CreateSerializerMixin, UpdateSerialize
         return context
 
     def get_queryset(self):
+        is_short_request = self.request.query_params.get("short", "false") == "true"
         organization = self.request.auth.organization
-        slack_channels = SlackChannel.objects.filter(
-            slack_team_identity=organization.slack_team_identity,
-            slack_id=OuterRef("channel"),
-        )
         queryset = OnCallSchedule.objects.filter(
             organization=organization,
             team=self.request.user.current_team,
-        ).annotate(
-            slack_channel_name=Subquery(slack_channels.values("name")[:1]),
-            slack_channel_pk=Subquery(slack_channels.values("public_primary_key")[:1]),
         )
-        queryset = self.serializer_class.setup_eager_loading(queryset)
+        if not is_short_request:
+            slack_channels = SlackChannel.objects.filter(
+                slack_team_identity=organization.slack_team_identity,
+                slack_id=OuterRef("channel"),
+            )
+            queryset = queryset.annotate(
+                slack_channel_name=Subquery(slack_channels.values("name")[:1]),
+                slack_channel_pk=Subquery(slack_channels.values("public_primary_key")[:1]),
+            )
+            queryset = self.serializer_class.setup_eager_loading(queryset)
         return queryset
 
     def get_object(self):

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

@@ -11,6 +11,7 @@ import PluginLink from 'components/PluginLink/PluginLink';
 import TimeRange from 'components/TimeRange/TimeRange';
 import Timeline from 'components/Timeline/Timeline';
 import GSelect from 'containers/GSelect/GSelect';
+import RemoteSelect from 'containers/RemoteSelect/RemoteSelect';
 import UserTooltip from 'containers/UserTooltip/UserTooltip';
 import { WithPermissionControl } from 'containers/WithPermissionControl/WithPermissionControl';
 import { ActionDTO } from 'models/action';
@@ -271,14 +272,15 @@ export class EscalationPolicy extends React.Component<EscalationPolicyProps, any
 
     return (
       <WithPermissionControl key="notify_schedule" disableByPaywall userAction={UserAction.UpdateEscalationPolicies}>
-        <GSelect
-          modelName="scheduleStore"
-          displayField="name"
-          valueField="id"
-          placeholder="Select Schedule"
+        <RemoteSelect
+          showSearch={false}
           className={cx('select', 'control')}
           value={notify_schedule}
+          valueField="id"
           onChange={this._getOnChangeHandler('notify_schedule')}
+          href={'/schedules/?short=true'}
+          fieldToShow="name"
+          placeholder="Select Schedule"
         />
       </WithPermissionControl>
     );