From 8044005cd440ef9efb29aee16690be8c009dca78 Mon Sep 17 00:00:00 2001 From: Mohamed Khelif Date: Thu, 7 Sep 2023 15:56:42 +0100 Subject: [PATCH] EVG-20606 Display an error for previous commit selector (#2022) --- src/pages/task/ActionButtons.tsx | 2 +- .../previousCommits/PreviousCommits.test.tsx | 27 +++++++++++++------ .../{PreviousCommits.tsx => index.tsx} | 15 +++++++++++ 3 files changed, 35 insertions(+), 9 deletions(-) rename src/pages/task/actionButtons/previousCommits/{PreviousCommits.tsx => index.tsx} (91%) diff --git a/src/pages/task/ActionButtons.tsx b/src/pages/task/ActionButtons.tsx index 02b35f4009..9a36f7c1a5 100644 --- a/src/pages/task/ActionButtons.tsx +++ b/src/pages/task/ActionButtons.tsx @@ -38,7 +38,7 @@ import { import { useLGButtonRouterLink } from "hooks/useLGButtonRouterLink"; import { useQueryParam } from "hooks/useQueryParam"; import { TaskStatus } from "types/task"; -import { PreviousCommits } from "./actionButtons/previousCommits/PreviousCommits"; +import { PreviousCommits } from "./actionButtons/previousCommits"; import { TaskNotificationModal } from "./actionButtons/TaskNotificationModal"; interface Props { diff --git a/src/pages/task/actionButtons/previousCommits/PreviousCommits.test.tsx b/src/pages/task/actionButtons/previousCommits/PreviousCommits.test.tsx index 89c7c30543..6c85442d46 100644 --- a/src/pages/task/actionButtons/previousCommits/PreviousCommits.test.tsx +++ b/src/pages/task/actionButtons/previousCommits/PreviousCommits.test.tsx @@ -1,4 +1,5 @@ import { MockedProvider } from "@apollo/client/testing"; +import { RenderFakeToastContext } from "context/toast/__mocks__"; import { BaseVersionAndTaskQuery, BaseVersionAndTaskQueryVariables, @@ -11,7 +12,7 @@ import { } from "gql/queries"; import { renderWithRouterMatch, screen, userEvent, waitFor } from "test_utils"; import { ApolloMock } from "types/gql"; -import { PreviousCommits } from "./PreviousCommits"; +import { PreviousCommits } from "."; const goButton = { name: "Go" }; const select = { name: "Previous commits for this task" }; @@ -22,11 +23,12 @@ describe("previous commits", () => { // mainline commits needs to run another query GET_LAST_MAINLINE_COMMIT to get previous task. describe("patch specific", () => { it("the GO button is disabled when there is no base task", async () => { - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( "aria-disabled", @@ -47,13 +49,15 @@ describe("previous commits", () => { describe("mainline commits specific", () => { it("the GO button is disabled when getParentTask returns null", async () => { - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); + await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( "aria-disabled", @@ -72,13 +76,15 @@ describe("previous commits", () => { }); it("the GO button is disabled when getParentTask returns an error", async () => { - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); + await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( "aria-disabled", @@ -98,11 +104,13 @@ describe("previous commits", () => { }); it("the select & GO button are disabled when no base version exists", async () => { - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); + await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( "aria-disabled", @@ -119,11 +127,12 @@ describe("previous commits", () => { it("when base task is passing, all dropdown items generate the same link.", async () => { const user = userEvent.setup(); - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( @@ -151,13 +160,14 @@ describe("previous commits", () => { it("when base task is failing, 'Go to base commit' and 'Go to last executed' dropdown items generate the same link and 'Go to last passing version' will be different.", async () => { const user = userEvent.setup(); - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( ); + renderWithRouterMatch(); await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( @@ -187,7 +197,7 @@ describe("previous commits", () => { it("when base task is not in a finished state, the last executed & passing task is not the same as the base commit", async () => { const user = userEvent.setup(); - renderWithRouterMatch( + const { Component } = RenderFakeToastContext( { ); + renderWithRouterMatch(); await waitFor(() => { expect(screen.getByRole("link", goButton)).toHaveAttribute( diff --git a/src/pages/task/actionButtons/previousCommits/PreviousCommits.tsx b/src/pages/task/actionButtons/previousCommits/index.tsx similarity index 91% rename from src/pages/task/actionButtons/previousCommits/PreviousCommits.tsx rename to src/pages/task/actionButtons/previousCommits/index.tsx index ec3b774df4..68bb9abe8e 100644 --- a/src/pages/task/actionButtons/previousCommits/PreviousCommits.tsx +++ b/src/pages/task/actionButtons/previousCommits/index.tsx @@ -2,12 +2,14 @@ import { useReducer, useEffect } from "react"; import { useLazyQuery, useQuery } from "@apollo/client"; import styled from "@emotion/styled"; import Button from "@leafygreen-ui/button"; +import { Spinner } from "@leafygreen-ui/loading-indicator"; import { Option, Select } from "@leafygreen-ui/select"; import Tooltip from "@leafygreen-ui/tooltip"; import { useTaskAnalytics } from "analytics"; import { ConditionalWrapper } from "components/ConditionalWrapper"; import { finishedTaskStatuses } from "constants/task"; import { size } from "constants/tokens"; +import { useToastContext } from "context/toast"; import { BaseVersionAndTaskQuery, BaseVersionAndTaskQueryVariables, @@ -44,6 +46,7 @@ export const PreviousCommits: React.FC = ({ taskId }) => { }, dispatch, ] = useReducer(reducer, initialState); + const dispatchToast = useToastContext(); const { data: taskData } = useQuery< BaseVersionAndTaskQuery, @@ -52,6 +55,8 @@ export const PreviousCommits: React.FC = ({ taskId }) => { variables: { taskId }, }); + // We don't error for this query because it is the default query that is run when the page loads. + // If it errors it probably means there is no base version, which is fine. const [fetchParentTask, { loading: parentLoading }] = useLazyQuery< LastMainlineCommitQuery, LastMainlineCommitQueryVariables @@ -74,6 +79,9 @@ export const PreviousCommits: React.FC = ({ taskId }) => { task: getTaskFromMainlineCommitsQuery(data), }); }, + onError: (err) => { + dispatchToast.error(`Last passing version unavailable: '${err.message}'`); + }, }); const [fetchLastExecuted, { loading: executedLoading }] = useLazyQuery< @@ -86,6 +94,11 @@ export const PreviousCommits: React.FC = ({ taskId }) => { task: getTaskFromMainlineCommitsQuery(data), }); }, + onError: (err) => { + dispatchToast.error( + `Could not fetch last task execution: '${err.message}'` + ); + }, }); const { baseTask, buildVariant, displayName, versionMetadata } = @@ -202,6 +215,8 @@ export const PreviousCommits: React.FC = ({ taskId }) => { disabled={disableButton} size="small" data-cy="previous-commits-go-button" + isLoading={loading} + loadingIndicator={} > Go