@steroidsjs/core 2.2.36 → 2.2.39

package/actions/form.d.ts

@@ -1,6 +1,7 @@
 export declare const FORM_INITIALIZE = "@form/initialize";
 export declare const FORM_CHANGE = "@form/change";
 export declare const FORM_RESET = "@form/reset";
+export declare const FORM_DESTROY = "@form/destroy";
 export declare const FORM_SET_ERRORS = "@form/set_errors";
 export declare const FORM_SUBMIT = "@form/submit";
 export declare const FORM_SET_SUBMITTING = "@form/set_submitting";
@@ -64,6 +65,14 @@ export declare const formReset: (formId: any) => {
     type: string;
     formId: any;
 };
+/**
+ * Удаление данных формы из redux хранилища
+ * @param formId
+ */
+export declare const formDestroy: (formId: any) => {
+    type: string;
+    formId: any;
+};
 export declare const formArrayAdd: (formId: any, name: any, rowsCount: any, initialValues: any) => {
     type: string;
     formId: any;

package/actions/form.js

@@ -1,9 +1,10 @@
 "use strict";
 exports.__esModule = true;
-exports.formArrayRemove = exports.formArrayAdd = exports.formReset = exports.formSetSubmitting = exports.formSubmit = exports.formSetErrors = exports.formChange = exports.formInitialize = exports.FORM_ARRAY_REMOVE = exports.FORM_ARRAY_ADD = exports.FORM_SET_SUBMITTING = exports.FORM_SUBMIT = exports.FORM_SET_ERRORS = exports.FORM_RESET = exports.FORM_CHANGE = exports.FORM_INITIALIZE = void 0;
+exports.formArrayRemove = exports.formArrayAdd = exports.formDestroy = exports.formReset = exports.formSetSubmitting = exports.formSubmit = exports.formSetErrors = exports.formChange = exports.formInitialize = exports.FORM_ARRAY_REMOVE = exports.FORM_ARRAY_ADD = exports.FORM_SET_SUBMITTING = exports.FORM_SUBMIT = exports.FORM_SET_ERRORS = exports.FORM_DESTROY = exports.FORM_RESET = exports.FORM_CHANGE = exports.FORM_INITIALIZE = void 0;
 exports.FORM_INITIALIZE = '@form/initialize';
 exports.FORM_CHANGE = '@form/change';
 exports.FORM_RESET = '@form/reset';
+exports.FORM_DESTROY = '@form/destroy';
 exports.FORM_SET_ERRORS = '@form/set_errors';
 exports.FORM_SUBMIT = '@form/submit';
 exports.FORM_SET_SUBMITTING = '@form/set_submitting';
@@ -76,6 +77,15 @@ var formReset = function (formId) { return ({
     formId: formId
 }); };
 exports.formReset = formReset;
+/**
+ * Удаление данных формы из redux хранилища
+ * @param formId
+ */
+var formDestroy = function (formId) { return ({
+    type: exports.FORM_DESTROY,
+    formId: formId
+}); };
+exports.formDestroy = formDestroy;
 var formArrayAdd = function (formId, name, rowsCount, initialValues) { return ({
     type: exports.FORM_ARRAY_ADD,
     formId: formId,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@steroidsjs/core",
-  "version": "2.2.36",
+  "version": "2.2.39",
   "description": "",
   "author": "Vladimir Kozhin <hello@kozhindev.com>",
   "repository": {

package/reducers/form.js

@@ -53,6 +53,8 @@ function reducerItem(state, action) {
             return dot_prop_immutable_1.set(state, 'isSubmitting', action.isSubmitting);
         case form_1.FORM_RESET:
             return __assign(__assign({}, state), { values: cloneDeep_1["default"](state.initialValues || {}) });
+        case form_1.FORM_DESTROY:
+            return null;
         case form_1.FORM_ARRAY_ADD:
             // eslint-disable-next-line no-case-declarations
             var newValue = [].concat(get_1["default"](state, 'values.' + action.name) || []);

package/ui/form/Form/Form.d.ts

@@ -28,6 +28,11 @@ export interface IFormProps {
      * @example POST
      */
     actionMethod?: string;
+    /**
+     * Текст ошибки при неудачной отправке данных. По-умолчанию: "Ошибка сервера"
+     * @example Упс, что-то пошло не так
+     */
+    submitErrorMessage?: string;
     /**
      * Шаблон для полей в форме
      * @example horizontal
@@ -135,6 +140,11 @@ export interface IFormProps {
      * @example true
      */
     isBordered?: boolean;
+    /**
+     * Очищать ли данные формы с redux хранилища при размонтировании компонента. По-умолчанию - false
+     * @example false
+     */
+    autoDestroy?: boolean;
     [key: string]: any;
 }
 export interface IFormViewProps {

package/ui/form/Form/Form.js

@@ -76,6 +76,7 @@ var isUndefined_1 = __importDefault(require("lodash-es/isUndefined"));
 var set_1 = __importDefault(require("lodash-es/set"));
 var react_1 = require("react");
 var react_use_1 = require("react-use");
+var notifications_1 = require("../../../actions/notifications");
 var useAddressBar_1 = __importDefault(require("../../../hooks/useAddressBar"));
 var AutoSaveHelper_1 = __importDefault(require("./AutoSaveHelper"));
 var hooks_1 = require("../../../hooks");
@@ -103,6 +104,7 @@ function Form(props) {
     }
     // Get components and dispatch method
     var components = hooks_1.useComponents();
+    var reduxDispatch = hooks_1.useDispatch();
     // Normalize layout
     var layout = react_1.useMemo(function () { return form_1.normalizeLayout(props.layout); }, [props.layout]);
     // Address bar synchronization
@@ -148,6 +150,12 @@ function Form(props) {
             //AutoSaveHelper.save(components.clientStorage, props.formId, values);
         }
     }, [props.autoSave, values]);
+    // Auto destroy
+    react_use_1.useUnmount(function () {
+        if (props.autoDestroy) {
+            dispatch(form_2.formDestroy(props.formId));
+        }
+    });
     // OnChange handler
     react_use_1.useUpdateEffect(function () {
         if (props.onChange) {
@@ -158,7 +166,7 @@ function Form(props) {
     var onSubmit = react_1.useCallback(function (e) {
         if (e === void 0) { e = null; }
         return __awaiter(_this, void 0, void 0, function () {
-            var cleanedValues, submitResult, captchaAttribute, googleCaptcha, captchaToken, options, response, _a, data;
+            var cleanedValues, submitResult, captchaAttribute, googleCaptcha, captchaToken, options, response, _a, requestError_1, data;
             var _b;
             var _this = this;
             return __generator(this, function (_c) {
@@ -239,31 +247,46 @@ function Form(props) {
                                 }); }
                                 : undefined
                         };
-                        if (!(typeof props.action === 'function')) return [3 /*break*/, 7];
-                        return [4 /*yield*/, props.action.call(null, components.api, cleanedValues, options)];
+                        _c.label = 6;
                     case 6:
+                        _c.trys.push([6, 11, , 12]);
+                        if (!(typeof props.action === 'function')) return [3 /*break*/, 8];
+                        return [4 /*yield*/, props.action.call(null, components.api, cleanedValues, options)];
+                    case 7:
                         _a = _c.sent();
-                        return [3 /*break*/, 9];
-                    case 7: return [4 /*yield*/, components.http.send(props.actionMethod, props.action || window.location.pathname, cleanedValues, options)];
-                    case 8:
-                        _a = _c.sent();
-                        _c.label = 9;
+                        return [3 /*break*/, 10];
+                    case 8: return [4 /*yield*/, components.http.send(props.actionMethod, props.action || window.location.pathname, cleanedValues, options)];
                     case 9:
+                        _a = _c.sent();
+                        _c.label = 10;
+                    case 10:
                         response = _a;
+                        return [3 /*break*/, 12];
+                    case 11:
+                        requestError_1 = _c.sent();
+                        console.error(requestError_1); // eslint-disable-line no-console
                         dispatch(form_2.formSetSubmitting(props.formId, false));
+                        reduxDispatch(notifications_1.showNotification(props.submitErrorMessage || __('Ошибка сервера'), 'danger'));
+                        return [2 /*return*/, null];
+                    case 12:
                         // Skip on 2fa
                         if (response.twoFactor) {
+                            dispatch(form_2.formSetSubmitting(props.formId, false));
                             return [2 /*return*/, null];
                         }
                         data = response.data || {};
                         // Event onAfterSubmit
                         if (props.onAfterSubmit && props.onAfterSubmit.call(null, cleanedValues, data, response) === false) {
+                            dispatch(form_2.formSetSubmitting(props.formId, false));
                             return [2 /*return*/, null];
                         }
                         if (data.errors) {
+                            dispatch(form_2.formSetSubmitting(props.formId, false));
                             setErrors(data.errors);
                             return [2 /*return*/, null];
                         }
+                        // Clean errors
+                        setErrors(null);
                         if (props.onComplete) {
                             props.onComplete.call(null, cleanedValues, data, response);
                         }
@@ -272,11 +295,13 @@ function Form(props) {
                             //const AutoSaveHelper = require('../ui/form/Form/AutoSaveHelper').default;
                             //AutoSaveHelper.remove(props.clientStorage, props.formId);
                         }
+                        dispatch(form_2.formSetSubmitting(props.formId, false));
                         return [2 /*return*/, null];
                 }
             });
         });
-    }, [components.api, components.http, components.resource, components.ui, props, setErrors, values, dispatch]);
+    }, [dispatch, props, values, components.ui, components.resource,
+        components.http, components.api, reduxDispatch, setErrors]);
     // Manual submit form by reducer action
     var prevSubmitCounter = react_use_1.usePrevious(submitCounter);
     react_use_1.useUpdateEffect(function () {