@abgov/jsonforms-components 1.55.0 → 1.55.1

package/index.esm.js

@@ -6009,6 +6009,7 @@ const stepperReducer = (state, action) => {
           state.hasNextButton = id <= lastId;
           state.hasPrevButton = id !== 0;
           state.isOnReview = false;
+          state.maxReachedStep = Math.max(state.maxReachedStep, activeId);
           return Object.assign({}, state);
         }
       }
@@ -6078,7 +6079,8 @@ const createStepperContextInitData = props => {
     hasPrevButton: activeId > 0 && activeId !== (categories === null || categories === void 0 ? void 0 : categories.length),
     path,
     isOnReview: activeId === (categories === null || categories === void 0 ? void 0 : categories.length),
-    isValid: valid === true
+    isValid: valid === true,
+    maxReachedStep: 0
   };
 };
 const JsonFormsStepperContext = /*#__PURE__*/createContext(undefined);
@@ -6115,6 +6117,17 @@ const JsonFormsStepperContextProvider = ({
       selectCategory: id => {
         return stepperState.categories[id];
       },
+      validatePage: id => {
+        var _a;
+        stepperDispatch({
+          type: 'update/category',
+          payload: {
+            errors: (_a = ctx === null || ctx === void 0 ? void 0 : ctx.core) === null || _a === void 0 ? void 0 : _a.errors,
+            id,
+            ajv
+          }
+        });
+      },
       goToPage: (id, updateCategoryId) => {
         var _a, _b, _c;
         ajv.validate(schema, ((_a = ctx.core) === null || _a === void 0 ? void 0 : _a.data) || {});
@@ -6147,6 +6160,7 @@ const JsonFormsStepperContextProvider = ({
   }, [stepperDispatch, stepperState, (_a = ctx.core) === null || _a === void 0 ? void 0 : _a.errors]);
   useEffect(() => {
     if ((context === null || context === void 0 ? void 0 : context.isProvided) === true) {
+      /* The block is used to cache the state for the tenant web app review editor  */
       stepperDispatch({
         type: 'update/uischema',
         payload: {
@@ -6155,21 +6169,10 @@ const JsonFormsStepperContextProvider = ({
           }))
         }
       });
+      context.goToPage(stepperState.maxReachedStep);
+      context.goToPage(stepperState.activeId);
     }
   }, [JSON.stringify(StepperProps.uischema), JSON.stringify(StepperProps.schema)]);
-  useEffect(() => {
-    const newState = createStepperContextInitData(Object.assign(Object.assign({}, StepperProps), {
-      activeId: stepperState === null || stepperState === void 0 ? void 0 : stepperState.activeId
-    }));
-    if (JSON.stringify(newState) !== JSON.stringify(stepperState)) {
-      stepperDispatch({
-        type: 'update/uischema',
-        payload: {
-          state: newState
-        }
-      });
-    }
-  }, [StepperProps]);
   return jsx(JsonFormsStepperContext.Provider, {
     value: context,
     children: children
@@ -6429,17 +6432,19 @@ const FormPagesView = props => {
   } = props;
   const enumerators = useContext(JsonFormContext);
   const formStepperCtx = useContext(JsonFormsStepperContext);
+  const {
+    validatePage,
+    goToPage
+  } = formStepperCtx;
   const {
     categories,
     isOnReview,
-    isValid
+    isValid,
+    activeId
   } = formStepperCtx.selectStepperState();
   const submitFormFunction = enumerators === null || enumerators === void 0 ? void 0 : enumerators.submitFunction.get('submit-form');
   const submitForm = submitFormFunction && submitFormFunction();
-  uischema.options || {};
   const [isOpen, setIsOpen] = useState(false);
-  useState(false);
-  const [selectedPage, setSelectedPage] = useState(0);
   const handleSubmit = () => {
     if (submitForm) {
       submitForm(data);
@@ -6450,8 +6455,9 @@ const FormPagesView = props => {
   const onCloseModal = () => {
     setIsOpen(false);
   };
-  // eslint-disable-next-line
-  uischema.options;
+  useEffect(() => {
+    validatePage(activeId);
+  }, [data]);
   return jsxs("div", {
     "data-testid": "form-stepper-test-wrapper",
     children: [jsx(Visible, {
@@ -6471,7 +6477,7 @@ const FormPagesView = props => {
               cells,
               data
             };
-            if (index === selectedPage && !isOnReview) {
+            if (index === activeId && !isOnReview) {
               return jsxs("div", {
                 "data-testid": `step_${index}-content-pages`,
                 style: {
@@ -6479,7 +6485,7 @@ const FormPagesView = props => {
                 },
                 children: [index > 0 && jsx(BackButton, {
                   testId: "back-button",
-                  link: () => setSelectedPage(index - 1),
+                  link: () => goToPage(activeId - 1),
                   text: "Back"
                 }), jsxs(PageRenderPadding, {
                   children: [jsxs("h3", {
@@ -6488,8 +6494,8 @@ const FormPagesView = props => {
                 }), jsx(PageRenderPadding, {
                   children: index !== categories.length - 1 ? jsx(GoAButton, {
                     type: "submit",
-                    onClick: () => setSelectedPage(index + 1),
-                    disabled: !category.isValid,
+                    onClick: () => goToPage(activeId + 1),
+                    disabled: !(category.isValid && category.isCompleted),
                     testId: "pages-save-continue-btn",
                     children: "Save and continue"
                   }) : jsx(GoAButton, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.55.0",
+  "version": "1.55.1",
   "license": "Apache-2.0",
   "description": "Government of Alberta - React renderers for JSON Forms based on the design system.",
   "repository": "https://github.com/GovAlta/adsp-monorepo",

package/src/lib/Controls/FormStepper/context/StepperContext.d.ts

@@ -18,6 +18,7 @@ export interface JsonFormsStepperContextProps {
     selectPath: () => string;
     selectCategory: (id: number) => CategoryState;
     goToPage: (id: number, updateCategoryId?: number) => void;
+    validatePage: (id: number) => void;
     isProvided?: boolean;
 }
 export declare const JsonFormsStepperContext: import("react").Context<JsonFormsStepperContextProps | undefined>;

package/src/lib/Controls/FormStepper/context/types.d.ts

@@ -23,5 +23,6 @@ export interface StepperContextDataType {
     path: string;
     isOnReview: boolean;
     isValid: boolean;
+    maxReachedStep: number;
 }
 export type CategorizationElement = Category | Categorization;