diff --git a/.changeset/silly-jars-remain.md b/.changeset/silly-jars-remain.md new file mode 100644 index 00000000..7bbca2cb --- /dev/null +++ b/.changeset/silly-jars-remain.md @@ -0,0 +1,11 @@ +--- +'@axis-backstage/plugin-vacation-calendar': minor +--- + +Migrate the vacation calendar to Backstage UI, TanStack Query v5, Day.js, and +react-calendar-timeline v0.30. The calendar now uses a Backstage UI date picker. + +The migration removes a number of legacy Material UI, date-picker, and timeline +dependencies. + +**Breaking:** Consumers must install and configure `@backstage/ui`. diff --git a/.gitignore b/.gitignore index 2d91bedf..43bad1d9 100644 --- a/.gitignore +++ b/.gitignore @@ -65,3 +65,4 @@ local_examples/ # no npm _release-folders **/_release +entities/* diff --git a/package.json b/package.json index 94c7b176..808ada57 100644 --- a/package.json +++ b/package.json @@ -6,10 +6,10 @@ "node": "20 || 22 || 24" }, "scripts": { - "dev": "yarn workspaces foreach -A --include backend --include app --parallel -v -i run start", - "dev-next": "yarn workspaces foreach -A --include backend --include app-next --parallel -v -i run start", + "dev": "NODE_OPTIONS=--no-node-snapshot backstage-cli repo start", + "dev-next": "npx backstage-cli repo start backend app-next", "start": "yarn workspace app start", - "start-backend": "yarn workspace backend start", + "start-backend": "backstage-cli repo start packages/backend", "build:backend": "yarn workspace backend build", "build:all": "backstage-cli repo build", "build-image": "yarn workspace backend build-image", @@ -43,6 +43,7 @@ }, "devDependencies": { "@backstage/cli": "^0.36.3", + "@backstage/cli-defaults": "^0.1.3", "@backstage/e2e-test-utils": "^0.1.2", "@backstage/repo-tools": "^0.17.3", "@changesets/cli": "^2.28.1", diff --git a/packages/app-next/package.json b/packages/app-next/package.json index f7488532..2fe78e81 100644 --- a/packages/app-next/package.json +++ b/packages/app-next/package.json @@ -29,6 +29,8 @@ "@backstage/frontend-plugin-api": "^0.17.2", "@backstage/integration-react": "^1.2.19", "@backstage/plugin-api-docs": "^0.14.2", + "@backstage/plugin-app": "^0.5.0", + "@backstage/plugin-app-react": "^0.2.4", "@backstage/plugin-catalog": "^2.0.6", "@backstage/plugin-catalog-common": "^1.1.10", "@backstage/plugin-catalog-graph": "^0.6.5", diff --git a/packages/app-next/src/App.tsx b/packages/app-next/src/App.tsx index 492ca111..8a853615 100644 --- a/packages/app-next/src/App.tsx +++ b/packages/app-next/src/App.tsx @@ -1,8 +1,11 @@ import { createApp } from '@backstage/frontend-defaults'; -import { - createFrontendModule, - PageBlueprint, -} from '@backstage/frontend-plugin-api'; +import { PageBlueprint } from '@backstage/frontend-plugin-api'; +import { microsoftAuthApiRef } from '@backstage/core-plugin-api'; +import type { SignInProviderConfig } from '@backstage/core-components'; +import { SignInPage } from '@backstage/core-components'; +import { SignInPageBlueprint } from '@backstage/plugin-app-react'; +import type { SignInPageProps } from '@backstage/plugin-app-react'; +import appPlugin from '@backstage/plugin-app'; import catalogPlugin from '@backstage/plugin-catalog/alpha'; import catalogImportPlugin from '@backstage/plugin-catalog-import/alpha'; import userSettingsPlugin from '@backstage/plugin-user-settings/alpha'; @@ -12,6 +15,30 @@ import { Navigate } from 'react-router'; // See documentation for details: https://backstage.io/docs/frontend-system/architecture/app#feature-discovery // import jiraPlugin from '@axis-backstage/plugin-jira-dashboard/alpha'; +const microsoftProvider: SignInProviderConfig = { + id: 'microsoft-auth-provider', + title: 'Microsoft', + message: 'Sign in using Microsoft', + apiRef: microsoftAuthApiRef, +}; + +function CustomSignInPage(props: SignInPageProps) { + return ( + + ); +} + +const signInPageExtension = SignInPageBlueprint.make({ + params: { + loader: async () => CustomSignInPage, + }, +}); + const homePageExtension = PageBlueprint.make({ name: 'homePage', params: { @@ -20,16 +47,17 @@ const homePageExtension = PageBlueprint.make({ }, }); +const appOverride = appPlugin.withOverrides({ + extensions: [homePageExtension, signInPageExtension], +}); + const app = createApp({ features: [ + appOverride, catalogPlugin, catalogImportPlugin, userSettingsPlugin, readmePlugin, - createFrontendModule({ - pluginId: 'app', - extensions: [homePageExtension], - }), ], }); diff --git a/plugins/vacation-calendar/package.json b/plugins/vacation-calendar/package.json index a1dc20b1..357c5c89 100644 --- a/plugins/vacation-calendar/package.json +++ b/plugins/vacation-calendar/package.json @@ -32,7 +32,9 @@ "@axis-backstage/plugin-vacation-calendar" ] }, - "sideEffects": false, + "sideEffects": [ + "**/*.css" + ], "scripts": { "start": "backstage-cli package start", "build": "backstage-cli package build", @@ -49,21 +51,14 @@ "@backstage/errors": "^1.3.1", "@backstage/frontend-plugin-api": "^0.17.2", "@backstage/plugin-catalog-react": "^3.1.0", - "@backstage/theme": "^0.7.3", - "@date-io/luxon": "3.0.0", - "@material-ui/core": "^4.12.4", - "@material-ui/pickers": "^3.3.11", + "@backstage/ui": "^0.16.0", + "@internationalized/date": "^3.12.2", "@microsoft/microsoft-graph-types": "^2.40.0", - "@mui/lab": "^5.0.0-alpha.170", "@mui/material": "^5.15.20", - "@mui/x-date-pickers": "^7.7.0", - "@tanstack/react-query": "4.29.1", + "@tanstack/react-query": "^5.101.0", + "dayjs": "^1.11.10", "interactjs": "^1.10.27", - "lodash": "^4.18.1", - "luxon": "^3.4.4", - "moment": "^2.30.1", - "prop-types": "^15.8.1", - "react-calendar-timeline": "^0.28.0", + "react-calendar-timeline": "^0.30.0-beta.4", "react-use": "^17.5.0" }, "peerDependencies": { @@ -81,10 +76,7 @@ "@testing-library/dom": "^10.0.0", "@testing-library/jest-dom": "^6.0.0", "@testing-library/react": "^16.0.0", - "@testing-library/user-event": "^14.5.2", - "@types/lodash": "^4.17.5", - "@types/luxon": "^3.4.2", - "@types/react-calendar-timeline": "^0.28.6" + "@testing-library/user-event": "^14.5.2" }, "files": [ "dist" diff --git a/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.css b/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.css new file mode 100644 index 00000000..a21eefe2 --- /dev/null +++ b/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.css @@ -0,0 +1,59 @@ +@import 'react-calendar-timeline/style.css'; + +.react-calendar-timeline .rct-header-root { + background: var(--bui-bg-neutral-2, #f5f5f5); + border-bottom: 1px solid var(--bui-border-1, #bbb); +} + +.react-calendar-timeline .rct-calendar-header { + border: 1px solid var(--bui-border-1, #bbb); + border-bottom: 0; +} + +.react-calendar-timeline .rct-dateHeader { + background-color: var(--bui-bg-neutral-1, #fafafa); + border-left: 1px solid var(--bui-border-1, #bbb); + border-bottom: 1px solid var(--bui-border-1, #bbb); + color: var(--bui-fg-primary, #333); +} + +.react-calendar-timeline .rct-dateHeader-primary { + background-color: var(--bui-bg-neutral-2, #e0e0e0); + color: var(--bui-fg-primary, #333); +} + +.react-calendar-timeline .rct-sidebar { + border-right: 1px solid var(--bui-border-1, #bbb); +} + +.react-calendar-timeline .timeline-sidebar-header { + border-bottom: 1px solid var(--bui-border-1, #bbb); +} + +.react-calendar-timeline .rct-sidebar .rct-sidebar-row { + border-bottom: 1px solid var(--bui-border-1, #bbb); +} + +.react-calendar-timeline .rct-sidebar .rct-sidebar-row.rct-sidebar-row-odd { + background: var(--bui-bg-neutral-1, rgba(0, 0, 0, 0.05)); +} + +.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd { + background: var(--bui-bg-neutral-1, rgba(0, 0, 0, 0.05)); +} + +.react-calendar-timeline .rct-horizontal-lines .rct-hl-even, +.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd { + border-bottom: 1px solid var(--bui-border-1, #bbb); +} + +.react-calendar-timeline .rct-vertical-lines .rct-vl { + border-left: 1px solid var(--bui-border-1, #bbb); +} + +.custom-group { + display: flex; + align-items: center; + gap: 5px; + white-space: nowrap; +} diff --git a/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.tsx b/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.tsx index 11029d3e..e3da7308 100644 --- a/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.tsx +++ b/plugins/vacation-calendar/src/components/CalendarCard/CalendarCard.tsx @@ -1,13 +1,12 @@ -import 'react-calendar-timeline/lib/Timeline.css'; -import { ReactNode, useState } from 'react'; +import './CalendarCard.css'; +import { useState } from 'react'; import useAsync from 'react-use/lib/useAsync'; import Timeline, { TimelineHeaders, SidebarHeader, DateHeader, - IntervalRenderer, } from 'react-calendar-timeline'; -import { DateTime } from 'luxon'; +import dayjs from 'dayjs'; import { useApi } from '@backstage/core-plugin-api'; import { useEntity, catalogApiRef } from '@backstage/plugin-catalog-react'; import { @@ -19,54 +18,28 @@ import { Progress, Avatar, } from '@backstage/core-components'; +import { Box, Button, Flex } from '@backstage/ui'; import { DateSelector } from '../DateSelector'; import { getGroups, getScheduleItems } from './lib'; import { fetchGroupEntities, fetchUserEntities } from './fetch'; import { useAvailability } from '../../hooks/useAvailibility'; import { useSignIn } from '../../hooks'; import { SignInContent } from '../SignInContent'; -import MuiLink from '@mui/material/Link'; -import Button from '@mui/material/Button'; -import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import Stack from '@mui/material/Stack'; - -import { Theme } from '@mui/material/styles'; const DEFAULT_NUM_DAYS = 60; - -const IntervalDateHeader = (props?: IntervalRenderer): ReactNode => { - return ( - theme.palette.text.primary, - position: 'absolute', - width: props?.intervalContext.interval.labelWidth, - left: props?.intervalContext.interval.left, - }} - onClick={props?.getIntervalProps().onClick} - > - {props?.intervalContext.intervalText} - - ); -}; +const DAY_IN_MILLISECONDS = 24 * 60 * 60 * 1000; +const DAY_HEADER_MAX_ZOOM = DEFAULT_NUM_DAYS * DAY_IN_MILLISECONDS; export const CalendarCard = () => { const { entity } = useEntity(); const catalogApi = useApi(catalogApiRef); - const [startDate, setStartDate] = useState(DateTime.now()); + const [startDate, setStartDate] = useState(dayjs()); const [endDate, setEndDate] = useState( - DateTime.now().endOf('day').plus({ days: DEFAULT_NUM_DAYS }), + dayjs().endOf('day').add(DEFAULT_NUM_DAYS, 'day'), ); + const [headerUnit, setHeaderUnit] = useState<'day' | 'month'>('day'); const { isSignedIn, isInitialized, signIn } = useSignIn(); @@ -82,7 +55,7 @@ export const CalendarCard = () => { }, [catalogApi, entity]); const { - availablity, + availability, error, isLoading: isAvailabilityLoading, isFetching: isAvailabilityFetching, @@ -93,8 +66,8 @@ export const CalendarCard = () => { const showLoader = isAvailabilityLoading || isAvailabilityFetching || !isInitialized; - const [groups, groupIndexMap] = getGroups(availablity, isUserEntity, users); - const scheduleItems = getScheduleItems(availablity, groupIndexMap); + const [groups, groupIndexMap] = getGroups(availability, isUserEntity, users); + const scheduleItems = getScheduleItems(availability, groupIndexMap); if (users?.length === 0) { return ( @@ -136,66 +109,77 @@ export const CalendarCard = () => { - + { - if (d instanceof DateTime) { - const { days } = endDate.diff(d, 'days').toObject(); + if (d) { + const days = endDate.diff(d, 'day'); if (days && Math.abs(days) > DEFAULT_NUM_DAYS) { - setEndDate(d.endOf('day').plus({ days: DEFAULT_NUM_DAYS })); + setEndDate(d.endOf('day').add(DEFAULT_NUM_DAYS, 'day')); } + setHeaderUnit('day'); setStartDate(d); } }} - initalDate={startDate} + initialDate={startDate} label="Start Date" /> { - if (d instanceof DateTime) { - const { days } = startDate.diff(d, 'days').toObject(); + if (d) { + const days = startDate.diff(d, 'day'); if (days && Math.abs(days) > DEFAULT_NUM_DAYS) { setStartDate( - d.endOf('day').minus({ days: DEFAULT_NUM_DAYS }), + d.endOf('day').subtract(DEFAULT_NUM_DAYS, 'day'), ); } - setEndDate(d as DateTime); + setHeaderUnit('day'); + setEndDate(d); } }} - initalDate={endDate} + initialDate={endDate} label="End Date" /> - - - - - + + {showLoader && ( - + )} {!isSignedIn && isInitialized && ( - + signIn(false)} /> )} {!isAvailabilityLoading && isSignedIn && ( - +
{ @@ -203,66 +187,50 @@ export const CalendarCard = () => { -
-
- -
-
- {group.title} -
+
+ + {group.title}
); }} items={scheduleItems as any} itemTouchSendsClick={false} - defaultTimeStart={startDate.toJSDate()} - defaultTimeEnd={endDate.toJSDate()} + defaultTimeStart={startDate.valueOf()} + defaultTimeEnd={endDate.valueOf()} + onZoom={({ visibleTimeStart, visibleTimeEnd }) => { + setHeaderUnit( + visibleTimeEnd - visibleTimeStart <= DAY_HEADER_MAX_ZOOM + ? 'day' + : 'month', + ); + }} > - + {({ getRootProps }) => { - return
; + return ( +
+ ); }} - - + + - +
)} diff --git a/plugins/vacation-calendar/src/components/CalendarCard/lib.test.ts b/plugins/vacation-calendar/src/components/CalendarCard/lib.test.ts index 2ecd56fc..ab75145f 100644 --- a/plugins/vacation-calendar/src/components/CalendarCard/lib.test.ts +++ b/plugins/vacation-calendar/src/components/CalendarCard/lib.test.ts @@ -5,9 +5,9 @@ import { getGroups, getScheduleItems } from './lib'; const makeAvailability = ( schedules: ScheduleInformation[], -): InfiniteData => ({ +): InfiniteData => ({ pages: [schedules], - pageParams: [undefined], + pageParams: [0], }); const makeUser = (name: string, displayName: string): UserEntityV1alpha1 => ({ diff --git a/plugins/vacation-calendar/src/components/CalendarCard/lib.ts b/plugins/vacation-calendar/src/components/CalendarCard/lib.ts index 44b97087..6e3e1397 100644 --- a/plugins/vacation-calendar/src/components/CalendarCard/lib.ts +++ b/plugins/vacation-calendar/src/components/CalendarCard/lib.ts @@ -2,8 +2,7 @@ import { TimelineItemBase } from 'react-calendar-timeline'; import { UserEntity, UserEntityV1alpha1 } from '@backstage/catalog-model'; import { ScheduleInformation } from '@microsoft/microsoft-graph-types'; import { InfiniteData } from '@tanstack/react-query'; -import { head } from 'lodash'; -import { DateTime } from 'luxon'; +import dayjs from 'dayjs'; const isTimeLineItem = ( item: TimelineItemBase | undefined, @@ -12,7 +11,7 @@ const isTimeLineItem = ( }; const getFullName = (users: UserEntity[], userId: string) => { - const name = head(userId.split('@')); + const [name] = userId.split('@'); const user = users.find(u => u.metadata.name === name); if (user) return user.spec.profile?.displayName; @@ -20,18 +19,17 @@ const getFullName = (users: UserEntity[], userId: string) => { }; const getUser = (users: UserEntity[], userId: string) => { - const name = head(userId.split('@')); - const user = users.find(u => u.metadata.name === name); + const [name] = userId.split('@'); - return user; + return users.find(u => u.metadata.name === name); }; export const getScheduleItems = ( - availablity: InfiniteData | undefined, + availability: InfiniteData | undefined, groupIndexMap?: Map, ) => { - return availablity - ? availablity?.pages + return availability + ? availability.pages .flatMap(p => p) // @ts-ignore .flatMap((a, i) => @@ -43,8 +41,8 @@ export const getScheduleItems = ( .map(s => ({ id: Date.now().toString(36) + Math.random().toString(36).slice(2), group: groupIndexMap?.get(i) ?? i, - start_time: DateTime.fromISO(s.start?.dateTime!), - end_time: DateTime.fromISO(s.end?.dateTime!), + start_time: dayjs(s.start?.dateTime!), + end_time: dayjs(s.end?.dateTime!), canMove: false, canResize: false, })), @@ -54,7 +52,7 @@ export const getScheduleItems = ( }; export const getGroups = ( - availablity: InfiniteData | undefined, + availability: InfiniteData | undefined, isUserEntity: string | false, users: UserEntityV1alpha1[] | undefined, ): [ @@ -67,11 +65,11 @@ export const getGroups = ( }>, groupIndexMap: Map, ] => { - if (!availablity) { + if (!availability) { return [[], new Map()]; } - const flattenedSchedules = availablity.pages + const flattenedSchedules = availability.pages .flatMap(p => p) .map((a, originalIndex) => ({ originalIndex, @@ -95,7 +93,7 @@ export const getGroups = ( const isHighlighted = isUserEntity && item.schedule.scheduleId && - isUserEntity === head(item.schedule.scheduleId.split('@')); + isUserEntity === item.schedule.scheduleId?.split('@')[0]; return { id: newIndex, diff --git a/plugins/vacation-calendar/src/components/DateSelector/DateSelector.tsx b/plugins/vacation-calendar/src/components/DateSelector/DateSelector.tsx index 9be044e0..90fe688e 100644 --- a/plugins/vacation-calendar/src/components/DateSelector/DateSelector.tsx +++ b/plugins/vacation-calendar/src/components/DateSelector/DateSelector.tsx @@ -1,31 +1,35 @@ -import { DateTime } from 'luxon/src/datetime'; -import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon'; -import FormControl from '@mui/material/FormControl'; -import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; -import { DesktopDatePicker } from '@mui/x-date-pickers/DesktopDatePicker'; +import { DatePicker } from '@backstage/ui'; +import { parseDate, type DateValue } from '@internationalized/date'; +import dayjs, { type Dayjs } from 'dayjs'; type DateSelectorProps = { label: string; - initalDate: DateTime; - onDateChange: (date: DateTime | null | string | undefined) => void; + initialDate: Dayjs; + onDateChange: (date: Dayjs | null) => void; }; +function toDateValue(date: Dayjs): DateValue { + return parseDate(date.format('YYYY-MM-DD')); +} + export const DateSelector = ({ label, - initalDate, + initialDate, onDateChange, }: DateSelectorProps) => { + const handleChange = (value: DateValue | null) => { + if (value) { + onDateChange(dayjs(value.toString())); + } else { + onDateChange(null); + } + }; + return ( - - - - - + ); }; diff --git a/plugins/vacation-calendar/src/hooks/useAvailibility.ts b/plugins/vacation-calendar/src/hooks/useAvailibility.ts index ecfb1b11..adbb1b19 100644 --- a/plugins/vacation-calendar/src/hooks/useAvailibility.ts +++ b/plugins/vacation-calendar/src/hooks/useAvailibility.ts @@ -1,35 +1,38 @@ import { useInfiniteQuery } from '@tanstack/react-query'; import { UserEntityV1alpha1 } from '@backstage/catalog-model'; import { useApi } from '@backstage/core-plugin-api'; -import { slice } from 'lodash'; -import { DateTime } from 'luxon'; +import { type Dayjs } from 'dayjs'; import { vacationCalendarApiRef } from '../api'; const PAGE_SIZE = 20; +const GRAPH_DATE_TIME_FORMAT = 'YYYY-MM-DDTHH:mm:ss.SSSZ'; export const useAvailability = ( users: UserEntityV1alpha1[] | undefined, - startDate: DateTime, - endDate: DateTime, + startDate: Dayjs, + endDate: Dayjs, isSignedIn: boolean, ) => { const calendarApi = useApi(vacationCalendarApiRef); const { - data: availablity, + data: availability, error, isLoading: isAvailabilityLoading, isFetching: isAvailabilityFetching, hasNextPage, fetchNextPage, } = useInfiniteQuery({ - queryFn: ({ pageParam = 0 }) => { - const currentUsers = slice(users || [], pageParam, pageParam + PAGE_SIZE); + queryFn: ({ pageParam }) => { + const currentUsers = (users || []).slice( + pageParam, + pageParam + PAGE_SIZE, + ); return calendarApi.getAvailability( { users: currentUsers?.map(u => u.spec.profile?.email ?? '') || [], - startDateTime: startDate.toISO(), - endDateTime: endDate.toISO(), + startDateTime: startDate.format(GRAPH_DATE_TIME_FORMAT), + endDateTime: endDate.format(GRAPH_DATE_TIME_FORMAT), }, { Prefer: 'outlook.timezone="Europe/Stockholm"', @@ -39,9 +42,10 @@ export const useAvailability = ( queryKey: [ 'calendarAvailability', users, - startDate.toISO(), - endDate.toISO(), + startDate.format(GRAPH_DATE_TIME_FORMAT), + endDate.format(GRAPH_DATE_TIME_FORMAT), ], + initialPageParam: 0, getNextPageParam: (_, allPages) => { const numberOfUsers = allPages.flatMap(p => p).length; if (numberOfUsers === users?.length) { @@ -50,8 +54,8 @@ export const useAvailability = ( // This will be starting index to fetch the next batch. return numberOfUsers; }, - cacheTime: 30000 * 1000, - enabled: isSignedIn && startDate.isValid && endDate.isValid && !!users, + gcTime: 30000 * 1000, + enabled: isSignedIn && startDate.isValid() && endDate.isValid() && !!users, retry: false, refetchInterval: 30000 * 1000, refetchIntervalInBackground: false, @@ -59,7 +63,7 @@ export const useAvailability = ( refetchOnReconnect: false, }); return { - availablity, + availability, error, isLoading: isAvailabilityLoading, isFetching: isAvailabilityFetching, diff --git a/plugins/vacation-calendar/src/plugin.ts b/plugins/vacation-calendar/src/plugin.ts index 0b907f43..d27b4fc3 100644 --- a/plugins/vacation-calendar/src/plugin.ts +++ b/plugins/vacation-calendar/src/plugin.ts @@ -1,4 +1,4 @@ -import 'react-calendar-timeline/lib/Timeline.css'; +import 'react-calendar-timeline/style.css'; import { createApiFactory, createPlugin, diff --git a/yarn.lock b/yarn.lock index 02f8e800..3994bb95 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2203,28 +2203,18 @@ __metadata: "@backstage/frontend-plugin-api": "npm:^0.17.2" "@backstage/plugin-catalog-react": "npm:^3.1.0" "@backstage/test-utils": "npm:^1.7.19" - "@backstage/theme": "npm:^0.7.3" - "@date-io/luxon": "npm:3.0.0" - "@material-ui/core": "npm:^4.12.4" - "@material-ui/pickers": "npm:^3.3.11" + "@backstage/ui": "npm:^0.16.0" + "@internationalized/date": "npm:^3.12.2" "@microsoft/microsoft-graph-types": "npm:^2.40.0" - "@mui/lab": "npm:^5.0.0-alpha.170" "@mui/material": "npm:^5.15.20" - "@mui/x-date-pickers": "npm:^7.7.0" - "@tanstack/react-query": "npm:4.29.1" + "@tanstack/react-query": "npm:^5.101.0" "@testing-library/dom": "npm:^10.0.0" "@testing-library/jest-dom": "npm:^6.0.0" "@testing-library/react": "npm:^16.0.0" "@testing-library/user-event": "npm:^14.5.2" - "@types/lodash": "npm:^4.17.5" - "@types/luxon": "npm:^3.4.2" - "@types/react-calendar-timeline": "npm:^0.28.6" + dayjs: "npm:^1.11.10" interactjs: "npm:^1.10.27" - lodash: "npm:^4.18.1" - luxon: "npm:^3.4.4" - moment: "npm:^2.30.1" - prop-types: "npm:^15.8.1" - react-calendar-timeline: "npm:^0.28.0" + react-calendar-timeline: "npm:^0.30.0-beta.4" react-use: "npm:^17.5.0" peerDependencies: "@types/react": ^17.0.0 || ^18.0.0 @@ -2830,7 +2820,7 @@ __metadata: languageName: node linkType: hard -"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.1.2, @babel/runtime@npm:^7.10.1, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.13.10, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.18.6, @babel/runtime@npm:^7.20.6, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.9, @babel/runtime@npm:^7.24.6, @babel/runtime@npm:^7.24.7, @babel/runtime@npm:^7.26.0, @babel/runtime@npm:^7.28.4, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.4.4, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.6.0, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.3, @babel/runtime@npm:^7.8.7, @babel/runtime@npm:^7.9.2": +"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.1.2, @babel/runtime@npm:^7.10.1, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.13.10, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.18.6, @babel/runtime@npm:^7.20.6, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.9, @babel/runtime@npm:^7.26.0, @babel/runtime@npm:^7.28.4, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.4.4, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.6.0, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.3, @babel/runtime@npm:^7.8.7, @babel/runtime@npm:^7.9.2": version: 7.28.4 resolution: "@babel/runtime@npm:7.28.4" checksum: 10c0/792ce7af9750fb9b93879cc9d1db175701c4689da890e6ced242ea0207c9da411ccf16dc04e689cc01158b28d7898c40d75598f4559109f761c12ce01e959bf7 @@ -5901,13 +5891,6 @@ __metadata: languageName: node linkType: hard -"@date-io/core@npm:^3.0.0": - version: 3.0.0 - resolution: "@date-io/core@npm:3.0.0" - checksum: 10c0/c8a725ad5729b38d3f73b7c2bf852ac18a980d6b610832db9f87eb6821e6377854112ba4b5f8510d3e3f49d5290a50dd79ae7724bbafeb146bfdfb5b4c8a13ed - languageName: node - linkType: hard - "@date-io/date-fns@npm:^1.3.13": version: 1.3.13 resolution: "@date-io/date-fns@npm:1.3.13" @@ -5919,20 +5902,6 @@ __metadata: languageName: node linkType: hard -"@date-io/luxon@npm:3.0.0": - version: 3.0.0 - resolution: "@date-io/luxon@npm:3.0.0" - dependencies: - "@date-io/core": "npm:^3.0.0" - peerDependencies: - luxon: ^1.21.3 || ^2.x || ^3.x - peerDependenciesMeta: - luxon: - optional: true - checksum: 10c0/85b9b62bc61c6fb69dae06d64b63ccb6c24d059093610fdcb637ad8c90e1e60672c5478397462fc25a600efa7fe508c4829c09529a1753c4c2e30fabfdc64648 - languageName: node - linkType: hard - "@electric-sql/pglite@npm:^0.2.14": version: 0.2.17 resolution: "@electric-sql/pglite@npm:0.2.17" @@ -7582,7 +7551,7 @@ __metadata: languageName: node linkType: hard -"@material-ui/pickers@npm:^3.2.10, @material-ui/pickers@npm:^3.3.11": +"@material-ui/pickers@npm:^3.2.10": version: 3.3.11 resolution: "@material-ui/pickers@npm:3.3.11" dependencies: @@ -8177,28 +8146,6 @@ __metadata: languageName: node linkType: hard -"@mui/base@npm:^5.0.0-beta.40": - version: 5.0.0-dev.20240529-082515-213b5e33ab - resolution: "@mui/base@npm:5.0.0-dev.20240529-082515-213b5e33ab" - dependencies: - "@babel/runtime": "npm:^7.24.6" - "@floating-ui/react-dom": "npm:^2.0.8" - "@mui/types": "npm:^7.2.14-dev.20240529-082515-213b5e33ab" - "@mui/utils": "npm:^6.0.0-dev.20240529-082515-213b5e33ab" - "@popperjs/core": "npm:^2.11.8" - clsx: "npm:^2.1.1" - prop-types: "npm:^15.8.1" - peerDependencies: - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - react-dom: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@types/react": - optional: true - checksum: 10c0/c6d3119aeea8abbb6494b3a3a632668bbee57e4f4e1786783908f3e19deb3b764f56e7e518849a17f3eda6db213bcc147a87fd0baf98941596466601d823478b - languageName: node - linkType: hard - "@mui/core-downloads-tracker@npm:^5.15.20": version: 5.15.20 resolution: "@mui/core-downloads-tracker@npm:5.15.20" @@ -8222,35 +8169,6 @@ __metadata: languageName: node linkType: hard -"@mui/lab@npm:^5.0.0-alpha.170": - version: 5.0.0-alpha.170 - resolution: "@mui/lab@npm:5.0.0-alpha.170" - dependencies: - "@babel/runtime": "npm:^7.23.9" - "@mui/base": "npm:5.0.0-beta.40" - "@mui/system": "npm:^5.15.15" - "@mui/types": "npm:^7.2.14" - "@mui/utils": "npm:^5.15.14" - clsx: "npm:^2.1.0" - prop-types: "npm:^15.8.1" - peerDependencies: - "@emotion/react": ^11.5.0 - "@emotion/styled": ^11.3.0 - "@mui/material": ">=5.15.0" - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - react-dom: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@emotion/react": - optional: true - "@emotion/styled": - optional: true - "@types/react": - optional: true - checksum: 10c0/56b095b2aee8cd1a45525fc5d0aac26d29f0111f12fbe05fe4fcf8eca2dedbb447d8d912330b469c35ab553a5776b5e91b9b7a44be5a214253301ec806c9f586 - languageName: node - linkType: hard - "@mui/material@npm:^5.12.2, @mui/material@npm:^5.15.20, @mui/material@npm:^5.15.7": version: 5.15.20 resolution: "@mui/material@npm:5.15.20" @@ -8353,7 +8271,7 @@ __metadata: languageName: node linkType: hard -"@mui/system@npm:^5.15.15, @mui/system@npm:^5.15.20": +"@mui/system@npm:^5.15.20": version: 5.15.20 resolution: "@mui/system@npm:5.15.20" dependencies: @@ -8381,7 +8299,7 @@ __metadata: languageName: node linkType: hard -"@mui/types@npm:^7.2.13, @mui/types@npm:^7.2.14, @mui/types@npm:^7.2.14-dev.20240529-082515-213b5e33ab": +"@mui/types@npm:^7.2.13, @mui/types@npm:^7.2.14": version: 7.2.14 resolution: "@mui/types@npm:7.2.14" peerDependencies: @@ -8411,72 +8329,6 @@ __metadata: languageName: node linkType: hard -"@mui/utils@npm:^6.0.0-dev.20240529-082515-213b5e33ab": - version: 6.0.0-dev.20240529-082515-213b5e33ab - resolution: "@mui/utils@npm:6.0.0-dev.20240529-082515-213b5e33ab" - dependencies: - "@babel/runtime": "npm:^7.24.6" - "@types/prop-types": "npm:^15.7.12" - prop-types: "npm:^15.8.1" - react-is: "npm:^18.2.0" - peerDependencies: - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@types/react": - optional: true - checksum: 10c0/6fbd5d874936d818e9c8ae595b9111da11422e1b4d3ce973779acdf34431f01f27fbbe175ca5912c4f4f2c7f1b10b98a5cb571cf8da92d5bb46d43fe0811ff85 - languageName: node - linkType: hard - -"@mui/x-date-pickers@npm:^7.7.0": - version: 7.7.0 - resolution: "@mui/x-date-pickers@npm:7.7.0" - dependencies: - "@babel/runtime": "npm:^7.24.7" - "@mui/base": "npm:^5.0.0-beta.40" - "@mui/system": "npm:^5.15.15" - "@mui/utils": "npm:^5.15.14" - "@types/react-transition-group": "npm:^4.4.10" - clsx: "npm:^2.1.1" - prop-types: "npm:^15.8.1" - react-transition-group: "npm:^4.4.5" - peerDependencies: - "@emotion/react": ^11.9.0 - "@emotion/styled": ^11.8.1 - "@mui/material": ^5.15.14 - date-fns: ^2.25.0 || ^3.2.0 - date-fns-jalali: ^2.13.0-0 || ^3.2.0-0 - dayjs: ^1.10.7 - luxon: ^3.0.2 - moment: ^2.29.4 - moment-hijri: ^2.1.2 - moment-jalaali: ^0.7.4 || ^0.8.0 || ^0.9.0 || ^0.10.0 - react: ^17.0.0 || ^18.0.0 - react-dom: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@emotion/react": - optional: true - "@emotion/styled": - optional: true - date-fns: - optional: true - date-fns-jalali: - optional: true - dayjs: - optional: true - luxon: - optional: true - moment: - optional: true - moment-hijri: - optional: true - moment-jalaali: - optional: true - checksum: 10c0/0df1b214ccc3fbdff1b4edb301a718a30db8c56900e4a0537de2769ace169e6c4bad8a5f91a65753bc3072831d565e8d489bf19ee016a954a45c5ba1bca5f9e2 - languageName: node - linkType: hard - "@n1ru4l/push-pull-async-iterable-iterator@npm:^3.1.0": version: 3.2.0 resolution: "@n1ru4l/push-pull-async-iterable-iterator@npm:3.2.0" @@ -12947,29 +12799,21 @@ __metadata: languageName: node linkType: hard -"@tanstack/query-core@npm:4.29.1": - version: 4.29.1 - resolution: "@tanstack/query-core@npm:4.29.1" - checksum: 10c0/38fb775e370e7cd43fa4084620d855a08cb02e52adc8c3dd9eaea92ca4aa6ba3ae3a0ab627162e2f4a974f629478b660dc6f1a77723e7aaaf7408ab7c1840847 +"@tanstack/query-core@npm:5.101.2": + version: 5.101.2 + resolution: "@tanstack/query-core@npm:5.101.2" + checksum: 10c0/c3288757bfd563ca35cee21bf6ed0edb2f4425a8c92f75d84dcb36a0580a59e48bd97fcdbbc7c8d8e95a4c40376edfc5772b14665b85d183079a0ba7e17793b2 languageName: node linkType: hard -"@tanstack/react-query@npm:4.29.1": - version: 4.29.1 - resolution: "@tanstack/react-query@npm:4.29.1" +"@tanstack/react-query@npm:^5.101.0": + version: 5.101.2 + resolution: "@tanstack/react-query@npm:5.101.2" dependencies: - "@tanstack/query-core": "npm:4.29.1" - use-sync-external-store: "npm:^1.2.0" + "@tanstack/query-core": "npm:5.101.2" peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-native: "*" - peerDependenciesMeta: - react-dom: - optional: true - react-native: - optional: true - checksum: 10c0/a267bb4e5192ef3518aa0313c8f9a92bb0ea902caeb5598e2ea0d542d7253a99f438dcbb1a58eb40e3ad54ca52a06b024188dc1864e1d153ad1a6a4f54d088ba + react: ^18 || ^19 + checksum: 10c0/076b2db0d85a6dc96d461789715ae0df2e439d9a20a41e629446275f8177a856c3b89d242ad3d31eadaf421f080b9834bcd9f94e5143f4cd7f947a10af9e42b3 languageName: node linkType: hard @@ -13600,7 +13444,7 @@ __metadata: languageName: node linkType: hard -"@types/lodash@npm:^4.17.13, @types/lodash@npm:^4.17.5": +"@types/lodash@npm:^4.17.13": version: 4.17.13 resolution: "@types/lodash@npm:4.17.13" checksum: 10c0/c3d0b7efe7933ac0369b99f2f7bff9240d960680fdb74b41ed4bd1b3ca60cca1e31fe4046d9abbde778f941a41bc2a75eb629abf8659fa6c27b66efbbb0802a9 @@ -13628,7 +13472,7 @@ __metadata: languageName: node linkType: hard -"@types/luxon@npm:^3, @types/luxon@npm:^3.0.0, @types/luxon@npm:^3.4.2, @types/luxon@npm:~3.4.0": +"@types/luxon@npm:^3, @types/luxon@npm:^3.0.0, @types/luxon@npm:~3.4.0": version: 3.4.2 resolution: "@types/luxon@npm:3.4.2" checksum: 10c0/d835467de3daf7e17ba78b50bb5a14efd94272439ca067990d71332a54b311544459c69623eddd243b511b28d70194c9591a9ee8cf9c038962c965f991affd7e @@ -13742,7 +13586,7 @@ __metadata: languageName: node linkType: hard -"@types/prop-types@npm:*, @types/prop-types@npm:^15.0.0, @types/prop-types@npm:^15.7.11, @types/prop-types@npm:^15.7.12, @types/prop-types@npm:^15.7.3": +"@types/prop-types@npm:*, @types/prop-types@npm:^15.0.0, @types/prop-types@npm:^15.7.11, @types/prop-types@npm:^15.7.3": version: 15.7.12 resolution: "@types/prop-types@npm:15.7.12" checksum: 10c0/1babcc7db6a1177779f8fde0ccc78d64d459906e6ef69a4ed4dd6339c920c2e05b074ee5a92120fe4e9d9f1a01c952f843ebd550bee2332fc2ef81d1706878f8 @@ -13781,16 +13625,6 @@ __metadata: languageName: node linkType: hard -"@types/react-calendar-timeline@npm:^0.28.6": - version: 0.28.6 - resolution: "@types/react-calendar-timeline@npm:0.28.6" - dependencies: - "@types/react": "npm:*" - moment: "npm:^2.0.0" - checksum: 10c0/6f7b1888ad8d62bd59a6157ed451aa268adbb670c136c4f78dfa52ba72deaf8fcf35f99e44b2c53e4a7123203eccee76d19c7aa1de60cbc587785b9bf38bd380 - languageName: node - linkType: hard - "@types/react-dom@npm:^18.3": version: 18.3.7 resolution: "@types/react-dom@npm:18.3.7" @@ -15298,6 +15132,8 @@ __metadata: "@backstage/frontend-plugin-api": "npm:^0.17.2" "@backstage/integration-react": "npm:^1.2.19" "@backstage/plugin-api-docs": "npm:^0.14.2" + "@backstage/plugin-app": "npm:^0.5.0" + "@backstage/plugin-app-react": "npm:^0.2.4" "@backstage/plugin-catalog": "npm:^2.0.6" "@backstage/plugin-catalog-common": "npm:^1.1.10" "@backstage/plugin-catalog-graph": "npm:^0.6.5" @@ -16187,13 +16023,6 @@ __metadata: languageName: node linkType: hard -"batch-processor@npm:1.0.0": - version: 1.0.0 - resolution: "batch-processor@npm:1.0.0" - checksum: 10c0/048b868811bed4cd03a0eec35264055f0f3fe4ab62f501809dce4a8a7b845d905fa5051b4af8b3c5123181116b1e2b6dfabf608829043b60cf61f4da3a359b60 - languageName: node - linkType: hard - "batch@npm:0.6.1": version: 0.6.1 resolution: "batch@npm:0.6.1" @@ -18050,19 +17879,6 @@ __metadata: languageName: node linkType: hard -"create-react-context@npm:^0.3.0": - version: 0.3.0 - resolution: "create-react-context@npm:0.3.0" - dependencies: - gud: "npm:^1.0.0" - warning: "npm:^4.0.3" - peerDependencies: - prop-types: ^15.0.0 - react: ^0.14.0 || ^15.0.0 || ^16.0.0 - checksum: 10c0/3f9dfde23da59e3f748b5f1b06c7ff8cbf48095cf2d62212427195860f1ee4b2b0b475280c19592f7fffb9fd100fd739af687281d7c5c93806d519bf66f6dd86 - languageName: node - linkType: hard - "create-require@npm:^1.1.0, create-require@npm:^1.1.1": version: 1.1.1 resolution: "create-require@npm:1.1.1" @@ -18640,6 +18456,13 @@ __metadata: languageName: node linkType: hard +"dayjs@npm:^1.11.10": + version: 1.11.21 + resolution: "dayjs@npm:1.11.21" + checksum: 10c0/bd97dfdc4bfea3c66268635690313828b386faa040fbc1f829ff42a2bd748b72c9d9b3c8f9616ce9e61fcb78923f1461a462c969c54b1084458ae1b715898fb0 + languageName: node + linkType: hard + "debounce-fn@npm:^4.0.0": version: 4.0.0 resolution: "debounce-fn@npm:4.0.0" @@ -19400,15 +19223,6 @@ __metadata: languageName: node linkType: hard -"element-resize-detector@npm:^1.1.12": - version: 1.2.4 - resolution: "element-resize-detector@npm:1.2.4" - dependencies: - batch-processor: "npm:1.0.0" - checksum: 10c0/8c180c8c2a6d5b83678f994e937890f06db6355009cce2bde3c690a45510c92f53f927431926b27db416739aa7b661c7d3afe237d17cd16491ecccfa740cda08 - languageName: node - linkType: hard - "elliptic@npm:^6.5.3, elliptic@npm:^6.5.5": version: 6.6.1 resolution: "elliptic@npm:6.6.1" @@ -22149,13 +21963,6 @@ __metadata: languageName: node linkType: hard -"gud@npm:^1.0.0": - version: 1.0.0 - resolution: "gud@npm:1.0.0" - checksum: 10c0/a4db6edc18e2c4e3a22dc9e639e40a4e5650d53dae9cf384a96d5380dfa17ddda376cf6b7797a5c30d140d2532e5a69d167bdb70c2c151dd673253bac6b027f3 - languageName: node - linkType: hard - "gzip-size@npm:^6.0.0": version: 6.0.0 resolution: "gzip-size@npm:6.0.0" @@ -25940,7 +25747,7 @@ __metadata: languageName: node linkType: hard -"luxon@npm:^3.0.0, luxon@npm:^3.2.1, luxon@npm:^3.4.3, luxon@npm:^3.4.4, luxon@npm:^3.5.0": +"luxon@npm:^3.0.0, luxon@npm:^3.2.1, luxon@npm:^3.4.3, luxon@npm:^3.5.0": version: 3.5.0 resolution: "luxon@npm:3.5.0" checksum: 10c0/335789bba95077db831ef99894edadeb23023b3eb2137a1b56acd0d290082b691cf793143d69e30bc069ec95f0b49f36419f48e951c68014f19ffe12045e3494 @@ -26409,6 +26216,13 @@ __metadata: languageName: node linkType: hard +"memoize-one@npm:^6.0.0": + version: 6.0.0 + resolution: "memoize-one@npm:6.0.0" + checksum: 10c0/45c88e064fd715166619af72e8cf8a7a17224d6edf61f7a8633d740ed8c8c0558a4373876c9b8ffc5518c2b65a960266adf403cc215cb1e90f7e262b58991f54 + languageName: node + linkType: hard + "memoizee@npm:^0.4.15": version: 0.4.17 resolution: "memoizee@npm:0.4.17" @@ -27259,13 +27073,6 @@ __metadata: languageName: node linkType: hard -"moment@npm:^2.0.0, moment@npm:^2.30.1": - version: 2.30.1 - resolution: "moment@npm:2.30.1" - checksum: 10c0/865e4279418c6de666fca7786607705fd0189d8a7b7624e2e56be99290ac846f90878a6f602e34b4e0455c549b85385b1baf9966845962b313699e7cb847543a - languageName: node - linkType: hard - "moo@npm:^0.5.0": version: 0.5.2 resolution: "moo@npm:0.5.2" @@ -30483,22 +30290,19 @@ __metadata: languageName: node linkType: hard -"react-calendar-timeline@npm:^0.28.0": - version: 0.28.0 - resolution: "react-calendar-timeline@npm:0.28.0" +"react-calendar-timeline@npm:^0.30.0-beta.4": + version: 0.30.0-beta.18 + resolution: "react-calendar-timeline@npm:0.30.0-beta.18" dependencies: - classnames: "npm:^2.2.6" - create-react-context: "npm:^0.3.0" - element-resize-detector: "npm:^1.1.12" - lodash.isequal: "npm:^4.5.0" - memoize-one: "npm:^5.1.1" + classnames: "npm:^2.5.1" + lodash: "npm:^4.17.21" + memoize-one: "npm:^6.0.0" peerDependencies: - interactjs: ^1.3.4 - moment: "*" - prop-types: ^15.6.2 - react: ">=16.3" - react-dom: ">=16.3" - checksum: 10c0/7943d570a746c764daad7b1f734782d3fdf4fb20bd217a41501bc7c70b6a3218724dcc4512f859b0a2e996017722f8c16aae2c48e231b428ea4dd25a792af78a + dayjs: ^1.11.10 + interactjs: 1.10.27 + react: ^18 || ^19 + react-dom: ^18 || ^19 + checksum: 10c0/faeb4398c51f068829e583210ffa544b0cc489bd541339d30065a19dbd55921b6a4d7baedf9f53aa7679102bd510c3a307c7988312440257f71d163ad44dfc83 languageName: node linkType: hard @@ -31942,6 +31746,7 @@ __metadata: resolution: "root@workspace:." dependencies: "@backstage/cli": "npm:^0.36.3" + "@backstage/cli-defaults": "npm:^0.1.3" "@backstage/e2e-test-utils": "npm:^0.1.2" "@backstage/repo-tools": "npm:^0.17.3" "@changesets/cli": "npm:^2.28.1" @@ -35693,15 +35498,6 @@ __metadata: languageName: node linkType: hard -"warning@npm:^4.0.3": - version: 4.0.3 - resolution: "warning@npm:4.0.3" - dependencies: - loose-envify: "npm:^1.0.0" - checksum: 10c0/aebab445129f3e104c271f1637fa38e55eb25f968593e3825bd2f7a12bd58dc3738bb70dc8ec85826621d80b4acfed5a29ebc9da17397c6125864d72301b937e - languageName: node - linkType: hard - "watchpack@npm:^2.5.1": version: 2.5.1 resolution: "watchpack@npm:2.5.1"