DEVPROD-7444 Add task scheduling warnings (#309)

apps/spruce/src/components/Banners/TaskSchedulingWarningBanner.tsx

@@ -0,0 +1,20 @@
+import Banner from "@leafygreen-ui/banner";
+import { StyledLink } from "components/styles";
+import { taskSchedulingLimitsDocumentationUrl } from "constants/externalResources";
+
+interface TaskSchedulingWarningBannerProps {
+  totalTasks: number;
+}
+const largeNumFinalizedTasksThreshold = 1000;
+
+export const TaskSchedulingWarningBanner: React.FC<
+  TaskSchedulingWarningBannerProps
+> = ({ totalTasks }) =>
+  totalTasks >= largeNumFinalizedTasksThreshold ? (
+    <Banner variant="warning">
+      This is a large operation, expected to schedule {totalTasks} tasks. Please
+      confirm that this number of tasks is necessary before continuing. For more
+      information, please refer to our{" "}
+      <StyledLink href={taskSchedulingLimitsDocumentationUrl}>docs.</StyledLink>
+    </Banner>
+  ) : null;

apps/spruce/src/components/PatchActionButtons/ScheduleTasks/testData.ts

@@ -19,6 +19,7 @@ const mocks: ApolloMock<
         version: {
           __typename: "Version",
           id: "version_id",
+          generatedTaskCounts: [],
           tasks: {
             __typename: "VersionTasks",
             data: [
@@ -150,6 +151,7 @@ const mocks: ApolloMock<
         version: {
           __typename: "Version",
           id: "version_empty",
+          generatedTaskCounts: [],
           tasks: {
             __typename: "VersionTasks",
             data: [],

apps/spruce/src/components/ScheduleTasksModal/index.tsx

@@ -5,6 +5,7 @@ import Checkbox from "@leafygreen-ui/checkbox";
 import { Body } from "@leafygreen-ui/typography";
 import { Skeleton } from "antd";
 import { Accordion } from "components/Accordion";
+import { TaskSchedulingWarningBanner } from "components/Banners/TaskSchedulingWarningBanner";
 import { ConfirmationModal } from "components/ConfirmationModal";
 import { size } from "constants/tokens";
 import { useToastContext } from "context/toast";
@@ -16,6 +17,7 @@ import {
 } from "gql/generated/types";
 import { SCHEDULE_TASKS } from "gql/mutations";
 import { UNSCHEDULED_TASKS } from "gql/queries";
+import { sumActivatedTasksInSet } from "utils/tasks/estimatedActivatedTasks";
 import { initialState, reducer } from "./reducer";
 
 interface ScheduleTasksModalProps {
@@ -70,6 +72,13 @@ export const ScheduleTasksModal: React.FC<ScheduleTasksModalProps> = ({
     dispatch({ type: "ingestData", taskData });
   }, [taskData]);
 
+  const { generatedTaskCounts = [] } = taskData?.version ?? {};
+
+  const estimatedActivatedTasksCount = sumActivatedTasksInSet(
+    selectedTasks,
+    generatedTaskCounts,
+  );
+
   return (
     <ConfirmationModal
       buttonText="Schedule"
@@ -159,6 +168,9 @@ export const ScheduleTasksModal: React.FC<ScheduleTasksModalProps> = ({
                 );
               },
             )}
+            <TaskSchedulingWarningBanner
+              totalTasks={estimatedActivatedTasksCount}
+            />
           </>
         )}
         {!loadingTaskData && !sortedBuildVariantGroups.length && (

apps/spruce/src/components/VersionRestartModal/VersionRestartModal.tsx

@@ -7,6 +7,7 @@ import { Skeleton } from "antd";
 import { TaskStatus } from "@evg-ui/lib/types/task";
 import { useVersionAnalytics } from "analytics";
 import { Accordion } from "components/Accordion";
+import { TaskSchedulingWarningBanner } from "components/Banners/TaskSchedulingWarningBanner";
 import { ConfirmationModal } from "components/ConfirmationModal";
 import { finishedTaskStatuses } from "constants/task";
 import { size } from "constants/tokens";
@@ -24,6 +25,7 @@ import {
   versionSelectedTasks,
   selectedStrings,
 } from "hooks/useVersionTaskStatusSelect";
+import { sumActivatedTasksInSelectedTasks } from "utils/tasks/estimatedActivatedTasks";
 import VersionTasks from "./VersionTasks";
 
 interface VersionRestartModalProps {
@@ -110,6 +112,11 @@ const VersionRestartModal: React.FC<VersionRestartModalProps> = ({
 
   const selectedTotal = selectTasksTotal(selectedTasks || {});
 
+  const { generatedTaskCounts = [] } = version ?? {};
+  const estimatedActivatedTasksCount = sumActivatedTasksInSelectedTasks(
+    selectedTasks || {},
+    generatedTaskCounts,
+  );
   return (
     <ConfirmationModal
       buttonText="Restart"
@@ -167,6 +174,9 @@ const VersionRestartModal: React.FC<VersionRestartModalProps> = ({
               <br />
             </div>
           )}
+          <TaskSchedulingWarningBanner
+            totalTasks={estimatedActivatedTasksCount}
+          />
           <ConfirmationMessage data-cy="confirmation-message" weight="medium">
             Are you sure you want to restart the {selectedTotal} selected tasks?
           </ConfirmationMessage>

apps/spruce/src/constants/externalResources.ts

@@ -50,6 +50,8 @@ export const cliDocumentationUrl = `${wikiBaseUrl}/CLI`;
 
 export const containersOnboardingDocumentationUrl = `${wikiBaseUrl}/Containers/Container-Tasks`;
 
+export const taskSchedulingLimitsDocumentationUrl = `${wikiBaseUrl}/Reference/Limits#task-scheduling-limits`;
+
 export const windowsPasswordRulesURL =
   "https://docs.microsoft.com/en-us/previous-versions/windows/it-pro/windows-server-2003/cc786468(v=ws.10)?redirectedfrom=MSDN";
 

apps/spruce/src/gql/generated/types.ts

@@ -5836,7 +5836,17 @@ export type BuildVariantsWithChildrenQuery = {
           status: string;
         }> | null;
       }> | null;
+      generatedTaskCounts: Array<{
+        __typename?: "GeneratedTaskCountResults";
+        estimatedTasks: number;
+        taskId?: string | null;
+      }>;
     }> | null;
+    generatedTaskCounts: Array<{
+      __typename?: "GeneratedTaskCountResults";
+      estimatedTasks: number;
+      taskId?: string | null;
+    }>;
   };
 };
 
@@ -6845,6 +6855,12 @@ export type ConfigurePatchQuery = {
         tasks: Array<string>;
       }>;
     }> | null;
+    generatedTaskCounts: Array<{
+      __typename?: "GeneratedTaskCountResults";
+      buildVariantName?: string | null;
+      estimatedTasks: number;
+      taskName?: string | null;
+    }>;
     patchTriggerAliases: Array<{
       __typename?: "PatchTriggerAlias";
       alias: string;
@@ -9014,6 +9030,11 @@ export type UndispatchedTasksQuery = {
   version: {
     __typename?: "Version";
     id: string;
+    generatedTaskCounts: Array<{
+      __typename?: "GeneratedTaskCountResults";
+      estimatedTasks: number;
+      taskId?: string | null;
+    }>;
     tasks: {
       __typename?: "VersionTasks";
       data: Array<{

apps/spruce/src/gql/queries/build-variants-with-children.graphql

@@ -23,10 +23,18 @@ query BuildVariantsWithChildren($id: String!, $statuses: [String!]!) {
         }
         variant
       }
+      generatedTaskCounts {
+        estimatedTasks
+        taskId
+      }
       id
       project
       projectIdentifier
     }
+    generatedTaskCounts {
+      estimatedTasks
+      taskId
+    }
     id
   }
 }

apps/spruce/src/gql/queries/patch-configure.graphql

@@ -15,6 +15,11 @@ query ConfigurePatch($id: String!) {
         tasks
       }
     }
+    generatedTaskCounts {
+      buildVariantName
+      estimatedTasks
+      taskName
+    }
     patchTriggerAliases {
       alias
       childProjectId

apps/spruce/src/gql/queries/undispatched-tasks.graphql

@@ -1,5 +1,9 @@
 query UndispatchedTasks($versionId: String!) {
   version(versionId: $versionId) {
+    generatedTaskCounts {
+      estimatedTasks
+      taskId
+    }
     id
     tasks(
       options: { statuses: ["unscheduled"], includeNeverActivatedTasks: true }

apps/spruce/src/pages/configurePatch/configurePatchCore/__snapshots__/ConfigurePatchCore_ConfigureTasksDefault.storyshot

@@ -1,9 +1,9 @@
 <div>
   <div
-    class="css-d31jx9-FlexRow ek3m3u40"
+    class="css-d31jx9-FlexRow ek3m3u41"
   >
     <div
-      class="leafygreen-ui-1br9h7w css-pjeyga-StyledInput ek3m3u42"
+      class="leafygreen-ui-1br9h7w css-pjeyga-StyledInput ek3m3u43"
       data-lgid="lg-text_input"
     >
       <div
@@ -50,7 +50,7 @@
       />
     </div>
     <div
-      class="css-8i32g1-ButtonWrapper ek3m3u41"
+      class="css-8i32g1-ButtonWrapper ek3m3u42"
     >
       <button
         aria-disabled="true"
@@ -70,6 +70,9 @@
       </button>
     </div>
   </div>
+  <div
+    class="css-1guqtnq-BannerContainer ek3m3u40"
+  />
   <section
     class="css-1fnoxta-PageLayout e1xf068s9"
   >

apps/spruce/src/pages/configurePatch/configurePatchCore/index.tsx

@@ -5,6 +5,7 @@ import Button from "@leafygreen-ui/button";
 import { Tab } from "@leafygreen-ui/tabs";
 import TextInput from "@leafygreen-ui/text-input";
 import { useNavigate } from "react-router-dom";
+import { TaskSchedulingWarningBanner } from "components/Banners/TaskSchedulingWarningBanner";
 import { LoadingButton } from "components/Buttons";
 import { CodeChanges } from "components/CodeChanges";
 import {
@@ -33,6 +34,7 @@ import {
   ProjectBuildVariant,
 } from "gql/generated/types";
 import { SCHEDULE_PATCH } from "gql/mutations";
+import { sumActivatedTasksInVariantsTasks } from "utils/tasks/estimatedActivatedTasks";
 import { ConfigureBuildVariants } from "./ConfigureBuildVariants";
 import ConfigureTasks from "./ConfigureTasks";
 import { ParametersContent } from "./ParametersContent";
@@ -56,6 +58,7 @@ const ConfigurePatchCore: React.FC<ConfigurePatchCoreProps> = ({ patch }) => {
     author,
     childPatchAliases,
     childPatches,
+    generatedTaskCounts,
     id,
     patchTriggerAliases,
     project,
@@ -154,6 +157,12 @@ const ConfigurePatchCore: React.FC<ConfigurePatchCoreProps> = ({ patch }) => {
     );
   }
 
+  const estimatedActivatedTasksCount = sumActivatedTasksInVariantsTasks(
+    selectedBuildVariantTasks,
+    generatedTaskCounts,
+    initialPatch.variantsTasks,
+  );
+
   return (
     <>
       <FlexRow>
@@ -187,6 +196,11 @@ const ConfigurePatchCore: React.FC<ConfigurePatchCoreProps> = ({ patch }) => {
           </LoadingButton>
         </ButtonWrapper>
       </FlexRow>
+      <BannerContainer>
+        <TaskSchedulingWarningBanner
+          totalTasks={estimatedActivatedTasksCount}
+        />
+      </BannerContainer>
       <PageLayout hasSider>
         <PageSider>
           <MetadataCard>
@@ -348,4 +362,8 @@ const FlexRow = styled.div`
   gap: ${size.s};
 `;
 
+const BannerContainer = styled.div`
+  margin-bottom: ${size.s};
+`;
+
 export default ConfigurePatchCore;

apps/spruce/src/pages/configurePatch/configurePatchCore/testData.ts

@@ -14,6 +14,7 @@ export const patchQuery: ConfigurePatchQuery = {
     projectIdentifier: "spruce",
     author: "mohamed.khelif",
     activated: false,
+    generatedTaskCounts: [],
     status: "created",
     time: {
       submittedAt: "2020-08-28T15:00:17Z",

apps/spruce/src/pages/projectSettings/tabs/GithubCommitQueueTab/GithubCommitQueueTab.tsx

@@ -89,7 +89,7 @@ export const GithubCommitQueueTab: React.FC<TabProps> = ({
   return (
     <>
       {!githubWebhooksEnabled && (
-        <Banner data-cy="disabled-webhook-banner" variant="warning">
+        <Banner variant="warning">
           GitHub features are disabled because the Evergreen GitHub App is not
           installed on the saved owner/repo. Contact IT to install the App and
           enable GitHub features.