From f29bd07087c0e2d354fe565b8daea47451d6e6cc Mon Sep 17 00:00:00 2001 From: RachelElysia <71795832+RachelElysia@users.noreply.github.com> Date: Mon, 15 Nov 2021 10:31:54 -0500 Subject: [PATCH] Schedules Page: Remove teams call on schedules for Fleet free (#2843) --- cypress/integration/premium/admin.spec.ts | 2 +- frontend/context/app.tsx | 1 + .../ManageSchedulePage/ManageSchedulePage.tsx | 98 +++++++++---------- 3 files changed, 49 insertions(+), 52 deletions(-) diff --git a/cypress/integration/premium/admin.spec.ts b/cypress/integration/premium/admin.spec.ts index efedf38ed7..76b955854f 100644 --- a/cypress/integration/premium/admin.spec.ts +++ b/cypress/integration/premium/admin.spec.ts @@ -95,7 +95,7 @@ describe( cy.wait(2000); // eslint-disable-line cypress/no-unnecessary-waiting cy.findByText(/query all/i).click(); - cy.wait(2000); // eslint-disable-line cypress/no-unnecessary-waiting + cy.wait(1000); // eslint-disable-line cypress/no-unnecessary-waiting cy.findByText(/run query/i).should("exist"); cy.get(".ace_scroller") diff --git a/frontend/context/app.tsx b/frontend/context/app.tsx index 0ba845d146..0d027306cb 100644 --- a/frontend/context/app.tsx +++ b/frontend/context/app.tsx @@ -26,6 +26,7 @@ type InitialStateType = { isAnyTeamMaintainerOrTeamAdmin: boolean | undefined; isTeamObserver: boolean | undefined; isTeamMaintainer: boolean | undefined; + isTeamMaintainerOrTeamAdmin: boolean | undefined; isAnyTeamAdmin: boolean | undefined; isTeamAdmin: boolean | undefined; isOnlyObserver: boolean | undefined; diff --git a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx index 5647585686..f482512f77 100644 --- a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx +++ b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx @@ -1,15 +1,14 @@ /* Conditionally renders global schedule and team schedules */ import React, { useState, useCallback, useEffect, useContext } from "react"; +import { useQuery } from "react-query"; import { useDispatch, useSelector } from "react-redux"; import { AppContext } from "context/app"; - import { push } from "react-router-redux"; +import { find } from "lodash"; + // @ts-ignore import deepDifference from "utilities/deep_difference"; -import { IConfig } from "interfaces/config"; -import { IQuery } from "interfaces/query"; -import { IUser } from "interfaces/user"; import { ITeam } from "interfaces/team"; import { IGlobalScheduledQuery } from "interfaces/global_scheduled_query"; import { ITeamScheduledQuery } from "interfaces/team_scheduled_query"; @@ -17,9 +16,8 @@ import { ITeamScheduledQuery } from "interfaces/team_scheduled_query"; import globalScheduledQueryActions from "redux/nodes/entities/global_scheduled_queries/actions"; // @ts-ignore import teamScheduledQueryActions from "redux/nodes/entities/team_scheduled_queries/actions"; -// @ts-ignore -import queryActions from "redux/nodes/entities/queries/actions"; -import teamActions from "redux/nodes/entities/teams/actions"; +import fleetQueriesAPI from "services/entities/queries"; +import teamsAPI from "services/entities/teams"; // @ts-ignore import { renderFlash } from "redux/nodes/notifications/actions"; import permissionUtils from "utilities/permissions"; @@ -89,14 +87,11 @@ interface ITeamSchedulesPageProps { params: { team_id: string; }; + location: any; // no type in react-router v3 } + +// TODO: move team scheduled queries and global scheduled queries into services entities, remove redux interface IRootState { - app: { - config: IConfig; - }; - auth: { - user: IUser; - }; entities: { global_scheduled_queries: { isLoading: boolean; @@ -108,14 +103,6 @@ interface IRootState { data: ITeamScheduledQuery[]; errors: { name: string; reason: string }[]; }; - queries: { - isLoading: boolean; - data: IQuery[]; - }; - teams: { - isLoading: boolean; - data: ITeam[]; - }; }; } interface IFormData { @@ -138,23 +125,48 @@ interface ITeamOptions { const ManageSchedulePage = ({ params: { team_id }, + location, }: ITeamSchedulesPageProps): JSX.Element => { - let teamId = parseInt(team_id, 10); const dispatch = useDispatch(); - const { MANAGE_PACKS } = paths; + const { MANAGE_PACKS, MANAGE_SCHEDULE, MANAGE_TEAM_SCHEDULE } = paths; const handleAdvanced = () => dispatch(push(MANAGE_PACKS)); - const { currentUser, isOnGlobalTeam, isPremiumTier } = useContext(AppContext); + const { + currentUser, + isOnGlobalTeam, + isPremiumTier, + isAnyTeamMaintainerOrTeamAdmin, + } = useContext(AppContext); + const { data: teams } = useQuery(["teams"], () => teamsAPI.loadAll({}), { + enabled: !!isPremiumTier, + select: (data) => data.teams, + refetchOnMount: false, + refetchOnWindowFocus: false, + }); + + const { data: fleetQueries } = useQuery( + ["fleetQueries"], + () => fleetQueriesAPI.loadAll(), + { + select: (data) => data.queries, + refetchOnMount: false, + refetchOnWindowFocus: false, + } + ); + + let teamId = parseInt(team_id, 10); + + // isTeamMaintainerOrTeamAdmin set locally and not in AppContext const isTeamMaintainerOrTeamAdmin = (() => { return !!permissionUtils.isTeamMaintainerOrTeamAdmin(currentUser, teamId); })(); const onChangeSelectedTeam = (selectedTeamId: number) => { if (isNaN(selectedTeamId)) { - dispatch(push(`${paths.MANAGE_SCHEDULE}`)); + dispatch(push(MANAGE_SCHEDULE)); } else { - dispatch(push(`${paths.MANAGE_TEAM_SCHEDULE(selectedTeamId)}`)); + dispatch(push(MANAGE_TEAM_SCHEDULE(selectedTeamId))); } }; @@ -190,9 +202,8 @@ const ManageSchedulePage = ({ } } + // TODO: move team scheduled queries and global scheduled queries into services entities, remove redux useEffect(() => { - dispatch(queryActions.loadAll()); - dispatch(teamActions.loadAll()); dispatch( teamId ? teamScheduledQueryActions.loadAll(teamId) @@ -200,15 +211,6 @@ const ManageSchedulePage = ({ ); }, [dispatch, teamId]); - const user = useSelector( - (state: IRootState): IUser => { - return state.auth.user; - } - ); - - const allQueries = useSelector((state: IRootState) => state.entities.queries); - const allQueriesList = Object.values(allQueries.data); - const allScheduledQueries = useSelector((state: IRootState) => { if (teamId) { return state.entities.team_scheduled_queries; @@ -231,14 +233,10 @@ const ManageSchedulePage = ({ const inheritedQueryOrQueries = allTeamsScheduledQueriesList.length === 1 ? "query" : "queries"; - const allTeams = useSelector((state: IRootState) => state.entities.teams); - const allTeamsList = Object.values(allTeams.data); - const selectedTeam = isNaN(teamId) ? "global" : teamId; - const selectedTeamData = allTeamsList.find( - (team) => selectedTeam === team.id - ); + const selectedTeamData = + teams?.find((team: ITeam) => selectedTeam === team.id) || undefined; const [showInheritedQueries, setShowInheritedQueries] = useState( false @@ -271,8 +269,8 @@ const ManageSchedulePage = ({ const generateTeamOptionsDropdownItems = (): ITeamOptions[] => { const teamOptions: ITeamOptions[] = []; - if (isTeamMaintainerOrTeamAdmin) { - user.teams.forEach((team) => { + if (isAnyTeamMaintainerOrTeamAdmin && currentUser) { + currentUser.teams.forEach((team) => { if (team.role === "admin" || team.role === "maintainer") { teamOptions.push({ disabled: false, @@ -281,14 +279,14 @@ const ManageSchedulePage = ({ }); } }); - } else if (isOnGlobalTeam) { + } else if (isOnGlobalTeam && teams) { teamOptions.push({ disabled: false, label: "All teams", value: "global", }); - allTeamsList.forEach((team) => { + teams.forEach((team: ITeam) => { teamOptions.push({ disabled: false, label: team.name, @@ -436,9 +434,7 @@ const ManageSchedulePage = ({ const teamMaintainerTeams = generateTeamOptionsDropdownItems(); if (teamMaintainerTeams.length) { dispatch( - push( - `${paths.MANAGE_TEAM_SCHEDULE(Number(teamMaintainerTeams[0].value))}` - ) + push(MANAGE_TEAM_SCHEDULE(Number(teamMaintainerTeams[0].value))) ); } } @@ -552,7 +548,7 @@ const ManageSchedulePage = ({