centralcloud/oncall-engine
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wrap up

Browse source
This commit is contained in:
Rares Mardare 2022-10-06 16:36:26 +03:00
parent 85a8413de4
commit 02988ec38d
4 changed files with 55 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
grafana-plugin/src/components/ScheduleBorderedAvatar/ScheduleBorderedAvatar.module.scss
View file

@ -7,3 +7,7 @@
left: 0px;
z-index: -1;
}
.icon {
position: relative;
top: -8px;
}

15
grafana-plugin/src/components/ScheduleBorderedAvatar/ScheduleBorderedAvatar.tsx
View file

@ -1,9 +1,15 @@
import React from 'react';
import React, { useState, useEffect } from 'react';
import { FadeTransition } from '@grafana/ui';
import cn from 'classnames/bind';
import dayjs from 'dayjs';
import { CSSTransition } from 'react-transition-group';
import styles from './ScheduleBorderedAvatar.module.scss';
import animationStyles from 'containers/Rotations/Rotations.module.css';
const cx = cn.bind(styles);
interface ScheduleBorderedAvatarProps {
@ -36,7 +42,7 @@ export default function ScheduleBorderedAvatar({
return (
<>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width={width} height={height} viewBox="-14 -8 240 230">
<g fill="none" strokeWidth="28" transform="translate(100,100)">
<g fill="none" strokeWidth="25" transform="translate(100,100)">
{renderColorPaths(colors)}
</g>
</svg>
@ -46,10 +52,11 @@ export default function ScheduleBorderedAvatar({
}
function renderColorPaths(colors: string[]) {
if (!colors?.length) return null;
if (!colors?.length) {return null;}
const colorSchemeList = colors;
if (colors.length === 1) { // minimum is 2 arcs to round the circle
if (colors.length === 1) {
// minimum is 2 arcs to round the circle
colorSchemeList.push(colors[0]);
}

47
grafana-plugin/src/containers/UsersTimezones/UsersTimezones.tsx
View file

@ -1,26 +1,18 @@
import React, { FC, useCallback, useEffect, useMemo, useState } from 'react';
import { HorizontalGroup, InlineSwitch, Tooltip } from '@grafana/ui';
import { HorizontalGroup, Tooltip } from '@grafana/ui';
import cn from 'classnames/bind';
import dayjs, { Dayjs } from 'dayjs';
import { toJS } from 'mobx';
import moment from 'moment';
import dayjs from 'dayjs';
import Avatar from 'components/Avatar/Avatar';
import ScheduleBorderedAvatar from 'components/ScheduleBorderedAvatar/ScheduleBorderedAvatar';
import ScheduleUserDetails from 'components/ScheduleUserDetails/ScheduleUserDetails';
import Text from 'components/Text/Text';
import { findColor } from 'containers/Rotations/Rotations.helpers';
import { IsOncallIcon } from 'icons';
import {
getLayersFromStore,
getOverrideColor,
getOverridesFromStore,
getShiftsFromStore,
} from 'models/schedule/schedule.helpers';
import { Event, Layer, Schedule } from 'models/schedule/schedule.types';
import { Timezone } from 'models/timezone/timezone.types';
import { User } from 'models/user/user.types';
import { getColorSchemeMappingForUsers } from 'pages/schedule/Schedule.helpers';
import { RootStore } from 'state';
import { useStore } from 'state/useStore';
@ -315,37 +307,4 @@ const AvatarGroup = (props: AvatarGroupProps) => {
);
};
function getColorSchemeMappingForUsers(store: RootStore, scheduleId: string, startMoment: dayjs.Dayjs): { [userId: string]: Set<string> } {
const usersColorSchemeHash: { [userId: string]: Set<string> } = {};
const shifts = getShiftsFromStore(store, scheduleId, startMoment);
const layers = getLayersFromStore(store, scheduleId, startMoment);
const overrides = getOverridesFromStore(store, scheduleId, startMoment);
if (!shifts?.length || !layers?.length) {
return usersColorSchemeHash;
}
shifts.forEach(({ shiftId, events }, rotationIndex) => {
populateUserHashSet(events, shiftId, false);
populateUserHashSet(events, rotationIndex, true);
});
return usersColorSchemeHash;
function populateUserHashSet(events: Event[], id: string | number, isOverride: boolean) {
events.forEach((event) => {
event.users.forEach((user) => {
if (!usersColorSchemeHash[user.pk]) {
usersColorSchemeHash[user.pk] = new Set<string>();
}
usersColorSchemeHash[user.pk].add(
isOverride ? getOverrideColor(id as number) : findColor(id as string, layers, overrides)
);
});
});
}
}
export default UsersTimezones;

38
grafana-plugin/src/pages/schedule/Schedule.helpers.ts
View file

@ -1,7 +1,10 @@
import { DateTime, dateTime } from '@grafana/data';
import dayjs from 'dayjs';
import { findColor } from 'containers/Rotations/Rotations.helpers';
import { getLayersFromStore, getOverridesFromStore, getShiftsFromStore } from 'models/schedule/schedule.helpers';
import { Event } from 'models/schedule/schedule.types';
import { Timezone } from 'models/timezone/timezone.types';
import { RootStore } from 'state';
export const getStartOfWeek = (tz: Timezone) => {
return dayjs().tz(tz).utcOffset() === 0 ? dayjs().utc().startOf('isoWeek') : dayjs().tz(tz).startOf('isoWeek');
@ -14,3 +17,36 @@ export const getUTCString = (moment: dayjs.Dayjs) => {
export const getDateTime = (date: string) => {
return dayjs(date);
};
export const getColorSchemeMappingForUsers = (
store: RootStore,
scheduleId: string,
startMoment: dayjs.Dayjs
): { [userId: string]: Set<string> } => {
const usersColorSchemeHash: { [userId: string]: Set<string> } = {};
const shifts = getShiftsFromStore(store, scheduleId, startMoment);
const layers = getLayersFromStore(store, scheduleId, startMoment);
const overrides = getOverridesFromStore(store, scheduleId, startMoment);
if (!shifts?.length || !layers?.length) {
return usersColorSchemeHash;
}
shifts.forEach(({ shiftId, events }) => populateUserHashSet(events, shiftId));
return usersColorSchemeHash;
function populateUserHashSet(events: Event[], id: string) {
events.forEach((event) => {
event.users.forEach((user) => {
if (!usersColorSchemeHash[user.pk]) {
usersColorSchemeHash[user.pk] = new Set<string>();
}
usersColorSchemeHash[user.pk].add(findColor(id as string, layers, overrides));
});
});
}
}