Merge pull request #4426 from grafana/dev

v1.5.4

engine/apps/alerts/tasks/check_escalation_finished.py

@@ -229,6 +229,8 @@ def check_escalation_finished_task() -> None:
         if total_alert_groups_count == 0
         else (total_alert_groups_count - failed_alert_groups_count) / total_alert_groups_count * 100
     )
+    task_logger.info(f"Alert groups that failed escalation: {failed_alert_groups_count}")
+    task_logger.info(f"Alert groups total: {total_alert_groups_count}")
     task_logger.info(f"Alert group notifications success ratio: {success_ratio:.2f}")
 
     if alert_group_ids_that_failed_audit:

engine/apps/slack/models/slack_usergroup.py

@@ -143,7 +143,12 @@ def update_or_create_slack_usergroup_from_slack(cls, slack_id: str, slack_team_i
         sc = SlackClient(slack_team_identity)
         usergroups = sc.usergroups_list()["usergroups"]
 
-        usergroup = [ug for ug in usergroups if ug["id"] == slack_id][0]
+        try:
+            usergroup = [ug for ug in usergroups if ug["id"] == slack_id][0]
+        except IndexError:
+            # user group not found
+            return
+
         try:
             members = sc.usergroups_users_list(usergroup=usergroup["id"])["users"]
         except SlackAPIError:

engine/apps/slack/tests/test_user_group.py

@@ -168,6 +168,27 @@ def test_update_or_create_slack_usergroup_from_slack(
     assert usergroup.is_active
 
 
+@patch.object(
+    SlackClient,
+    "usergroups_list",
+    return_value=build_slack_response(
+        {
+            "ok": True,
+            "usergroups": [{"id": "test_slack_id", "name": "test_name", "handle": "test_handle", "date_delete": 0}],
+        }
+    ),
+)
+@pytest.mark.django_db
+def test_update_or_create_slack_usergroup_from_slack_group_not_found(
+    mock_usergroups_list, make_organization_with_slack_team_identity
+):
+    organization, slack_team_identity = make_organization_with_slack_team_identity()
+    SlackUserGroup.update_or_create_slack_usergroup_from_slack("other_id", slack_team_identity)
+
+    # no group is created, no error is raised
+    assert SlackUserGroup.objects.count() == 0
+
+
 @patch.object(
     SlackClient,
     "usergroups_users_list",

grafana-plugin/.config/webpack/webpack.config.ts

@@ -95,14 +95,6 @@ const config = async (env): Promise<Configuration> => {
             },
           },
         },
-        {
-          test: /\.css$/,
-          use: ['style-loader', 'css-loader'],
-        },
-        {
-          test: /\.s[ac]ss$/,
-          use: ['style-loader', 'css-loader', 'sass-loader'],
-        },
         {
           test: /\.(png|jpe?g|gif|svg)$/,
           type: 'asset/resource',

grafana-plugin/e2e-tests/schedules/scheduleView.test.ts

@@ -0,0 +1,31 @@
+import { scheduleViewToDaysInOneRow } from 'models/schedule/schedule.helpers';
+import { ScheduleView } from 'models/schedule/schedule.types';
+import { HTML_ID } from 'utils/DOM';
+
+import { expect, test } from '../fixtures';
+import { generateRandomValue } from '../utils/forms';
+import { createOnCallScheduleWithRotation } from '../utils/schedule';
+
+test.skip('schedule view (week/2 weeks/month) toggler works', async ({ adminRolePage }) => {
+  const { page, userName } = adminRolePage;
+
+  const onCallScheduleName = generateRandomValue();
+  await createOnCallScheduleWithRotation(page, onCallScheduleName, userName);
+
+  // ScheduleView.OneWeek is selected by default
+  expect(await page.getByLabel(ScheduleView.OneWeek, { exact: true }).isChecked()).toBe(true);
+
+  expect(await page.locator(`#${HTML_ID.SCHEDULE_FINAL} .TEST_weekday`).count()).toStrictEqual(
+    scheduleViewToDaysInOneRow[ScheduleView.OneWeek]
+  );
+
+  await page.getByLabel(ScheduleView.TwoWeeks, { exact: true }).click();
+  expect(await page.getByLabel(ScheduleView.TwoWeeks, { exact: true }).isChecked()).toBe(true);
+  expect(await page.locator(`#${HTML_ID.SCHEDULE_FINAL} .TEST_weekday`).count()).toStrictEqual(
+    scheduleViewToDaysInOneRow[ScheduleView.TwoWeeks]
+  );
+
+  await page.getByLabel(ScheduleView.OneMonth, { exact: true }).click();
+  expect(await page.getByLabel(ScheduleView.OneMonth, { exact: true }).isChecked()).toBe(true);
+  expect(await page.locator(`#${HTML_ID.SCHEDULE_FINAL} .TEST_weekday`).count()).toBeGreaterThanOrEqual(28);
+});

grafana-plugin/src/assets/style/vars.css

@@ -27,6 +27,7 @@
   --hover-selected: #f4f5f5;
   --background-canvas: #f4f5f5;
   --background-secondary: #f4f5f5;
+  --background-disabled: rgba(204, 204, 220, 0.11);
   --border-medium-color: rgba(36, 41, 46, 0.3);
   --border-medium: 1px solid rgba(36, 41, 46, 0.3);
   --border-strong: 1px solid rgba(36, 41, 46, 0.4);
@@ -61,6 +62,7 @@
   --oncall-icon-stroke-color: #181b1f;
   --background-canvas: #111217;
   --background-secondary: #22252b;
+  --background-disabled: rgba(204, 204, 220, 0.04);
   --border-medium-color: rgba(204, 204, 220, 0.15);
   --border-medium: 1px solid rgba(204, 204, 220, 0.15);
   --border-strong: 1px solid rgba(204, 204, 220, 0.25);

grafana-plugin/src/containers/Rotation/Rotation.module.css

@@ -24,10 +24,6 @@
   position: relative;
 }
 
-.root:last-child .timeline {
-  padding-bottom: 0;
-}
-
 .slots {
   width: 100%;
   display: flex;
@@ -39,10 +35,6 @@
   opacity: 0.5;
 }
 
-.slots__animate {
-  transition: transform 500ms ease;
-}
-
 .current-time {
   position: absolute;
   left: 450px;
@@ -64,11 +56,6 @@
   margin: 0 2px;
 }
 
-.slots--tutorial {
-  position: absolute;
-  background: rgba(61, 113, 217, 0.15);
-}
-
 .pointer {
   position: absolute;
   top: -9px;
@@ -82,15 +69,3 @@
   transform: scale(1);
   opacity: 1;
 }
-
-.tutorial-slot {
-  width: 175px;
-  height: 28px;
-  border-radius: 2px;
-  margin: 0 1px;
-  padding: 4px;
-}
-
-.tutorial-slot--active {
-  box-shadow: var(--shadows-z3);
-}

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

@@ -1,4 +1,4 @@
-import React, { FC, useMemo, useState } from 'react';
+import React, { FC, useMemo } from 'react';
 
 import { HorizontalGroup, LoadingPlaceholder } from '@grafana/ui';
 import cn from 'classnames/bind';
@@ -9,11 +9,10 @@ import hash from 'object-hash';
 import { ScheduleFiltersType } from 'components/ScheduleFilters/ScheduleFilters.types';
 import { Text } from 'components/Text/Text';
 import { ScheduleSlot } from 'containers/ScheduleSlot/ScheduleSlot';
-import { Event, RotationFormLiveParams, ShiftSwap } from 'models/schedule/schedule.types';
+import { scheduleViewToDaysInOneRow } from 'models/schedule/schedule.helpers';
+import { Event, ScheduleView, ShiftSwap } from 'models/schedule/schedule.types';
 import { useStore } from 'state/useStore';
 
-import { RotationTutorial } from './RotationTutorial';
-
 import styles from './Rotation.module.css';
 
 const cx = cn.bind(styles);
@@ -28,27 +27,26 @@ interface RotationProps {
   handleAddShiftSwap?: (id: 'new', params: Partial<ShiftSwap>) => void;
   handleOpenSchedule?: (event: Event) => void;
   onShiftSwapClick?: (swapId: ShiftSwap['id']) => void;
-  days?: number;
   transparent?: boolean;
-  tutorialParams?: RotationFormLiveParams;
   simplified?: boolean;
   filters?: ScheduleFiltersType;
   getColor?: (event: Event) => string;
   onSlotClick?: (event: Event) => void;
   emptyText?: string;
   showScheduleNameAsSlotTitle?: boolean;
+  startDate?: dayjs.Dayjs;
+  scheduleView?: ScheduleView;
 }
 
 export const Rotation: FC<RotationProps> = observer((props) => {
   const {
     timezoneStore: { calendarStartDate, getDateInSelectedTimezone },
+    scheduleStore: { scheduleView: storeScheduleView },
   } = useStore();
   const {
     events,
     color: propsColor,
-    days = 7,
     transparent = false,
-    tutorialParams,
     onClick,
     handleAddOverride,
     handleAddShiftSwap,
@@ -60,18 +58,24 @@ export const Rotation: FC<RotationProps> = observer((props) => {
     onSlotClick,
     emptyText,
     showScheduleNameAsSlotTitle,
+    startDate: propsStartDate,
+    scheduleView: propsScheduleView,
   } = props;
 
-  const [animate, _setAnimate] = useState<boolean>(true);
+  const scheduleView = propsScheduleView || storeScheduleView;
+
+  const startDate = propsStartDate || calendarStartDate;
+
+  const days = scheduleViewToDaysInOneRow[scheduleView];
 
   const handleRotationClick = (event: React.MouseEvent<HTMLDivElement>) => {
     const rect = event.currentTarget.getBoundingClientRect();
     const x = event.clientX - rect.left; //x position within the element.
     const width = event.currentTarget.offsetWidth;
 
-    const dayOffset = Math.floor((x / width) * 7);
+    const dayOffset = Math.floor((x / width) * scheduleViewToDaysInOneRow[scheduleView]);
 
-    const shiftStart = calendarStartDate.add(dayOffset, 'day');
+    const shiftStart = startDate.add(dayOffset, 'day');
     const shiftEnd = shiftStart.add(1, 'day');
 
     onClick(shiftStart, shiftEnd);
@@ -134,27 +138,27 @@ export const Rotation: FC<RotationProps> = observer((props) => {
 
     const firstShift = events[0];
     const firstShiftOffset = getDateInSelectedTimezone(firstShift.start).diff(
-      getDateInSelectedTimezone(calendarStartDate),
+      getDateInSelectedTimezone(startDate),
       'seconds'
     );
     const base = 60 * 60 * 24 * days;
 
     return firstShiftOffset / base;
-  }, [events, calendarStartDate]);
+  }, [events, startDate]);
 
   return (
     <div className={cx('root')} onClick={onClick && handleRotationClick}>
       <div className={cx('timeline')}>
-        {tutorialParams && <RotationTutorial {...tutorialParams} />}
         {events ? (
           events.length ? (
             <div
-              className={cx('slots', { slots__animate: animate, slots__transparent: transparent })}
+              className={cx('slots', { slots__transparent: transparent })}
               style={{ transform: `translate(${x * 100}%, 0)` }}
             >
               {events.map((event) => {
                 return (
                   <ScheduleSlot
+                    scheduleView={scheduleView}
                     key={hash(event)}
                     event={event}
                     color={propsColor || getColor(event)}