feat: display the number of validation error when saving

checkmarble · Aug 21, 2023 · fb80b83 · fb80b83
1 parent a5d8737
commit fb80b83
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 11 deletions.
diff --git a/packages/app-builder/src/repositories/EditorRepository.ts b/packages/app-builder/src/repositories/EditorRepository.ts
@@ -35,7 +35,7 @@ function adaptNodeEvaluation(dto: NodeEvaluationDto): NodeEvaluation {
   };
 }
 
-function adaptScenarioValidation(
+export function adaptScenarioValidation(
   dto: ScenarioValidationDto
 ): ScenarioValidation {
   return {
@@ -45,6 +45,29 @@ function adaptScenarioValidation(
   };
 }
 
+// return just an array of error from a recursive evaluation
+export function flattenNodeEvaluationErrors(
+  evaluation: NodeEvaluation
+): EvaluationError[] {
+  return [
+    ...(evaluation.errors ?? []),
+    ...evaluation.children.map(flattenNodeEvaluationErrors).flat(),
+    ...Object.values(evaluation.namedChildren)
+      .map(flattenNodeEvaluationErrors)
+      .flat(),
+  ];
+}
+
+export function countValidationErrors(validation: ScenarioValidation): number {
+  return (
+    validation.errors.length +
+    [validation.triggerEvaluation, ...validation.rulesEvaluations].reduce(
+      (acc, evaluation) => acc + flattenNodeEvaluationErrors(evaluation).length,
+      0
+    )
+  );
+}
+
 export function getEditorRepository() {
   return (marbleApiClient: MarbleApi) => ({
     listIdentifiers: async ({ scenarioId }: { scenarioId: string }) => {

diff --git a/...-builder/src/routes/__builder/scenarios/$scenarioId/i/$iterationId/edit.rules.$ruleId.tsx b/...-builder/src/routes/__builder/scenarios/$scenarioId/i/$iterationId/edit.rules.$ruleId.tsx
@@ -14,6 +14,7 @@ import type {
   ScenarioValidation,
 } from '@app-builder/models';
 import { type AstOperator } from '@app-builder/models/ast-operators';
+import { countValidationErrors } from '@app-builder/repositories/EditorRepository';
 import { EditRule } from '@app-builder/routes/ressources/scenarios/$scenarioId/$iterationId/rules/$ruleId/edit';
 import { DeleteRule } from '@app-builder/routes/ressources/scenarios/$scenarioId/$iterationId/rules/delete';
 import {
@@ -44,7 +45,7 @@ interface EditRuleLoaderResult {
     customListAccessors: EditorIdentifier[];
   };
   operators: AstOperator[];
-  scenarioValidation: ScenarioValidation | null;
+  scenarioValidation: ScenarioValidation;
   scenarioId: string;
 }
 
@@ -56,6 +57,7 @@ export async function loader({ request, params }: LoaderArgs) {
 
   const ruleId = fromParams(params, 'ruleId');
   const scenarioId = fromParams(params, 'scenarioId');
+  const iterationId = fromParams(params, 'iterationId');
 
   const scenarioIterationRule = scenario.getScenarioIterationRule({
     ruleId,
@@ -69,7 +71,9 @@ export async function loader({ request, params }: LoaderArgs) {
     scenarioId,
   });
 
-  const scenarioValidation: ScenarioValidation | null = null;
+  const scenarioValidation: ScenarioValidation = await editor.validate({
+    iterationId: iterationId,
+  });
 
   return json<EditRuleLoaderResult>({
     rule: await scenarioIterationRule,
@@ -92,7 +96,6 @@ export async function action({ request, params }: ActionArgs) {
 
   try {
     const ruleId = fromParams(params, 'ruleId');
-    const iterationId = fromParams(params, 'iterationId');
 
     const expression = (await request.json()) as {
       astNode: AstNode;
@@ -103,10 +106,6 @@ export async function action({ request, params }: ActionArgs) {
       astNode: expression.astNode,
     });
 
-    const scenarioValidation = await editor.validate({
-      iterationId: iterationId,
-    });
-
     setToastMessage(session, {
       type: 'success',
       messageKey: 'common:success.save',
@@ -116,7 +115,6 @@ export async function action({ request, params }: ActionArgs) {
         success: true as const,
         error: null,
         values: expression,
-        scenarioValidation,
       },
       { headers: { 'Set-Cookie': await commitSession(session) } }
     );
@@ -130,7 +128,6 @@ export async function action({ request, params }: ActionArgs) {
         success: false as const,
         error: null,
         values: null,
-        scenarioValidation: null,
       },
       { headers: { 'Set-Cookie': await commitSession(session) } }
     );
@@ -165,6 +162,8 @@ export default function RuleEdit() {
     defaultValues: { astNode: rule.astNode },
   });
 
+  const numberOfValidationErrors = countValidationErrors(scenarioValidation);
+
   return (
     <ScenarioPage.Container>
       <ScenarioPage.Header>
@@ -180,9 +179,18 @@ export default function RuleEdit() {
         </div>
       </ScenarioPage.Header>
       <ScenarioPage.Content className="max-w-3xl">
+        {numberOfValidationErrors && (
+          <Callout>{numberOfValidationErrors} validation error(s)</Callout>
+        )}
         {scenarioValidation && (
           <Callout>
-            <pre>{JSON.stringify(scenarioValidation)}</pre>
+            <pre
+              style={{
+                whiteSpace: 'pre',
+              }}
+            >
+              {JSON.stringify(scenarioValidation, null, 2)}
+            </pre>
           </Callout>
         )}
         <EditRule

diff --git a/...es/app-builder/src/routes/__builder/scenarios/$scenarioId/i/$iterationId/edit/trigger.tsx b/...es/app-builder/src/routes/__builder/scenarios/$scenarioId/i/$iterationId/edit/trigger.tsx
@@ -45,6 +45,7 @@ export async function action({ request, params }: ActionArgs) {
       type: 'success',
       messageKey: 'common:success.save',
     });
+
     return json(
       {
         success: true as const,