Fix and refactor checks retry (#7456)

* fix const

* add api function

* add domain

* add query

* update domain

* use fsd in checks

* add check api

* update keys

* add domain

* add mutation

* update query

* cleanup useless style

* remove refetch

* update mutation

* remove unused file

* remove unused file

* add api

* update query keys

* add domain

* add query

* update component

* remove file

* add changelog

* add errors check

* fix type

* use as const

* update type

* update ui for retry

* update retry all ui

* ensure kind

* revert tooltip

* improve TS

* rephrase changelog

---------

Co-authored-by: bilalabbad <[email protected]>

Author: pa-lem

changelog/+checks.fixed.md

@@ -0,0 +1 @@
+Resolved a problem that caused generator checks to fail when retrying requests

frontend/app/src/config/constants.ts

@@ -1,3 +1,5 @@
+import { CheckType } from "@/shared/api/graphql/generated/graphql";
+
 import { RelationshipKind } from "@/entities/nodes/types";
 import { PROPOSED_CHANGE_OBJECT } from "@/entities/proposed-changes/constants";
 
@@ -115,9 +117,10 @@ export const CHECKS_LABEL = {
   IN_PROGRESS: "In progress",
 };
 
-export const VALIDATIONS_ENUM_MAP: { [key: string]: string } = {
+export const VALIDATIONS_ENUM_MAP: { [key: string]: CheckType } = {
   CoreArtifactValidator: "ARTIFACT",
   CoreDataValidator: "DATA",
+  CoreGeneratorValidator: "GENERATOR",
   CoreRepositoryValidator: "REPOSITORY",
   CoreSchemaValidator: "SCHEMA",
   CoreUserValidator: "USER",

frontend/app/src/entities/diff/api/getCheckDetails.ts renamed to frontend/app/src/entities/diff/api/get-check-details-from-api.ts

@@ -1,8 +1,14 @@
 import { gql } from "@apollo/client";
 
-export const GET_CHECKS = gql`
-  query GET_CORE_CHECKS($ids: [ID]!) {
-    CoreCheck(ids: $ids) {
+import {
+  Get_Check_DetailsQuery,
+  Get_Check_DetailsQueryVariables,
+} from "@/shared/api/graphql/generated/graphql";
+import graphqlClient from "@/shared/api/graphql/graphqlClientApollo";
+
+const GET_CHECK_DETAILS = gql`
+  query GET_CHECK_DETAILS($id: ID!) {
+    CoreCheck(ids: [$id]) {
       edges {
         node {
           id
@@ -63,3 +69,12 @@ export const GET_CHECKS = gql`
     }
   }
 `;
+
+export interface GetCheckDetailsFromApiParams extends Get_Check_DetailsQueryVariables {}
+
+export const getCheckDetailsFromApi = async (variables: GetCheckDetailsFromApiParams) => {
+  return graphqlClient.query<Get_Check_DetailsQuery, Get_Check_DetailsQueryVariables>({
+    query: GET_CHECK_DETAILS,
+    variables,
+  });
+};

frontend/app/src/entities/diff/api/get-validators-from-api.ts

@@ -0,0 +1,54 @@
+import { gql } from "@apollo/client";
+
+import {
+  Get_Check_DetailsQueryVariables,
+  Get_Core_ValidatorsQuery,
+} from "@/shared/api/graphql/generated/graphql";
+import graphqlClient from "@/shared/api/graphql/graphqlClientApollo";
+
+const GET_VALIDATORS = gql`
+  query GET_CORE_VALIDATORS($id: ID!) {
+    CoreValidator(proposed_change__ids: [$id]) {
+      edges {
+        node {
+          id
+          display_label
+          conclusion {
+            value
+          }
+          started_at {
+            value
+          }
+          completed_at {
+            value
+          }
+          state {
+            value
+          }
+          checks {
+            edges {
+              node {
+                conclusion {
+                  value
+                }
+                severity {
+                  value
+                }
+              }
+            }
+          }
+          __typename
+        }
+      }
+    }
+  }
+`;
+
+export interface GetValidatorsFromApiParams extends Get_Check_DetailsQueryVariables {}
+
+export const getValidatorsFromApi = async (variables: GetValidatorsFromApiParams) => {
+  return graphqlClient.query<Get_Core_ValidatorsQuery, Get_Check_DetailsQueryVariables>({
+    query: GET_VALIDATORS,
+    variables,
+  });
+};

frontend/app/src/entities/diff/api/getValidators.ts

@@ -0,0 +1,32 @@
+import { gql } from "@apollo/client";
+
+import {
+  Run_CheckMutation,
+  Run_CheckMutationVariables,
+} from "@/shared/api/graphql/generated/graphql";
+import graphqlClient from "@/shared/api/graphql/graphqlClientApollo";
+
+export const RUN_CHECK = gql`
+  mutation RUN_CHECK($proposedChangeId: String!, $checkType: CheckType) {
+    CoreProposedChangeRunCheck (
+      data: {
+        id: $proposedChangeId,
+        check_type: $checkType
+      }
+    ) {
+      ok
+    }
+  }
+`;
+
+export interface RunCheckFromApiParams extends Run_CheckMutationVariables {}
+
+export const runCheckFromApi = ({ proposedChangeId, checkType }: RunCheckFromApiParams) => {
+  return graphqlClient.mutate<Run_CheckMutation, Run_CheckMutationVariables>({
+    mutation: RUN_CHECK,
+    variables: {
+      proposedChangeId,
+      checkType,
+    },
+  });
+};

frontend/app/src/entities/diff/api/run-check-from-api.ts

@@ -1,24 +1,22 @@
 import { Icon } from "@iconify-icon/react";
 import { useAtomValue } from "jotai";
 
-import useQuery from "@/shared/api/graphql/useQuery";
 import { InfoButton } from "@/shared/components/buttons/info-button";
 import Accordion from "@/shared/components/display/accordion";
 import { DateDisplay } from "@/shared/components/display/date-display";
 import { CodeViewer } from "@/shared/components/editor/code/code-viewer";
 import ErrorScreen from "@/shared/components/errors/error-screen";
-import { Skeleton } from "@/shared/components/skeleton";
+import { LoadingIndicator } from "@/shared/components/loading/loading-indicator";
 import { List } from "@/shared/components/table/list";
 import { Popover, PopoverContent, PopoverTrigger } from "@/shared/components/ui/popover";
 import { Tooltip } from "@/shared/components/ui/tooltip";
 import { classNames } from "@/shared/utils/common";
 
-import { GET_CHECKS } from "@/entities/diff/api/getCheckDetails";
+import { DataIntegrityConflicts } from "@/entities/diff/checks/data-integrity-conflicts";
+import { SchemaIntegrityConflicts } from "@/entities/diff/checks/schema-integrity-conflicts";
+import { useGetCheckDetails } from "@/entities/diff/domain/get-check-details.query";
 import { schemaKindLabelState } from "@/entities/schema/stores/schemaKindLabel.atom";
 
-import { DataIntegrityConflicts } from "./data-integrity-conflicts";
-import { SchemaIntegrityConflicts } from "./schema-integrity-conflicts";
-
 type tCheckProps = {
   id: string;
 };
@@ -75,9 +73,23 @@ const getCheckBorderColor = (severity?: string) => {
 export const Check = ({ id }: tCheckProps) => {
   const schemaKindLabel = useAtomValue(schemaKindLabelState);
 
-  const { loading, error, data } = useQuery(GET_CHECKS, { variables: { ids: [id] } });
+  const { isPending, error, data: check } = useGetCheckDetails({ checkId: id });
+
+  if (error) {
+    return (
+      <div className={"flex flex-col rounded-md border-l-4 bg-white p-2"}>
+        <ErrorScreen message="Something went wrong when fetching the check details" />
+      </div>
+    );
+  }
+
+  if (isPending) {
+    return <LoadingIndicator />;
+  }
 
-  const check = data?.CoreCheck?.edges?.[0]?.node ?? {};
+  if (!check) {
+    return null;
+  }
 
   const {
     __typename,
@@ -92,14 +104,6 @@ export const Check = ({ id }: tCheckProps) => {
     conflicts,
   } = check;
 
-  if (error) {
-    return (
-      <div className={"flex flex-col rounded-md border-l-4 bg-white p-2"}>
-        <ErrorScreen message="Something went wrong when fetching the check details" />
-      </div>
-    );
-  }
-
   const columns = [
     {
       name: "type",
@@ -133,20 +137,12 @@ export const Check = ({ id }: tCheckProps) => {
       <div className="mb-2 flex">
         <div className="flex flex-1 flex-col">
           <div className="flex items-center">
-            {loading ? (
-              <Skeleton className="mr-2 h-3 w-3 rounded-sm" />
-            ) : (
-              getCheckIcon(conclusion?.value)
-            )}
+            {getCheckIcon(conclusion?.value)}
 
-            {loading ? <Skeleton className="h-3 w-40" /> : name?.value || display_label}
+            {name?.value || display_label}
 
             <div className="flex flex-1 items-center justify-end">
-              {loading ? (
-                <Skeleton className="h-3 w-24" />
-              ) : (
-                created_at?.value && <DateDisplay date={created_at?.value} />
-              )}
+              {created_at?.value && <DateDisplay date={created_at?.value} />}
 
               <Popover>
                 <PopoverTrigger asChild>