@k-int/stripes-kint-components 1.5.0 → 1.6.0

package/es/lib/{Settings → EditableSettingsList}/EditableSettingsListFieldArray.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -11,9 +11,16 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _reactFinalForm = require("react-final-form");
 
-var _SettingField = _interopRequireDefault(require("./SettingField"));
+var _SettingField = require("./SettingField");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+(function () {
+  var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
+  enterModule && enterModule(module);
+})();
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -21,6 +28,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
+  return a;
+};
+
 var EditableSettingsListFieldArray = function EditableSettingsListFieldArray(_ref) {
   var data = _ref.data,
       fields = _ref.fields,
@@ -32,9 +43,9 @@ var EditableSettingsListFieldArray = function EditableSettingsListFieldArray(_re
   };
 
   return fields.map(function (setting, i) {
-    return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, {
-      key: setting,
-      component: _SettingField["default"],
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+      component: _SettingField.SettingField,
+      "data-testid": "editableSettingsListFieldArray[".concat(i, "]"),
       name: setting,
       onSave: function onSave() {
         return handleSave(i);
@@ -42,18 +53,38 @@ var EditableSettingsListFieldArray = function EditableSettingsListFieldArray(_re
       settingData: _objectSpread({
         currentSetting: fields.value[i]
       }, data)
-    });
+    }, setting);
   });
 };
 
 EditableSettingsListFieldArray.propTypes = {
-  fields: _propTypes["default"].object,
-  onSave: _propTypes["default"].func,
-  data: _propTypes["default"].shape({
-    refdatavalues: _propTypes["default"].arrayOf(_propTypes["default"].object)
+  fields: _propTypes.default.object,
+  onSave: _propTypes.default.func,
+  data: _propTypes.default.shape({
+    refdatavalues: _propTypes.default.arrayOf(_propTypes.default.object)
   }),
-  mutators: _propTypes["default"].object,
-  initialValues: _propTypes["default"].object
+  mutators: _propTypes.default.object,
+  initialValues: _propTypes.default.object
 };
 var _default = EditableSettingsListFieldArray;
-exports["default"] = _default;
+var _default2 = _default;
+exports.default = _default2;
+;
+
+(function () {
+  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;
+
+  if (!reactHotLoader) {
+    return;
+  }
+
+  reactHotLoader.register(EditableSettingsListFieldArray, "EditableSettingsListFieldArray", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/EditableSettingsListFieldArray.js");
+  reactHotLoader.register(_default, "default", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/EditableSettingsListFieldArray.js");
+})();
+
+;
+
+(function () {
+  var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
+  leaveModule && leaveModule(module);
+})();

package/es/lib/EditableSettingsList/EditableSettingsListFieldArray.test.js

@@ -0,0 +1,181 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+require("@folio/stripes-erm-components/test/jest/__mock__");
+
+var _helpers = require("@folio/stripes-erm-components/test/jest/helpers");
+
+var _reactFinalFormArrays = require("react-final-form-arrays");
+
+var _EditableSettingsListFieldArray = _interopRequireDefault(require("./EditableSettingsListFieldArray"));
+
+var _helpers2 = require("../../../test/jest/helpers");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+(function () {
+  var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
+  enterModule && enterModule(module);
+})();
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
+  return a;
+};
+
+var onSubmit = jest.fn();
+jest.mock('./SettingField', function () {
+  return {
+    SettingField: function SettingField() {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        children: "SettingField"
+      });
+    }
+  };
+});
+var settings = [{
+  id: 'ff8081817d94374a017d94449a660049',
+  key: 'S3BucketName',
+  section: 'fileStorage',
+  settingType: 'String',
+  value: 'diku-shared'
+}];
+var multipleSettings = [{
+  id: '2c91809c7da2041f017da20b99000045',
+  vocab: 'FileStorageEngines',
+  section: 'fileStorage',
+  value: 'DB',
+  settingType: 'String',
+  key: 'storageEngine'
+}, {
+  id: '2c91809c7da2041f017da20b99080046',
+  section: 'fileStorage',
+  value: 'http://s3_endpoint_host.domain:9000',
+  settingType: 'String',
+  key: 'S3Endpoint'
+}, {
+  id: '2c91809c7da2041f017da20b990d0047',
+  section: 'fileStorage',
+  value: 'ACCESS_KEY',
+  settingType: 'String',
+  key: 'S3AccessKey'
+}];
+describe('EditableSettingsListFieldArray', function () {
+  describe('with empty initial values', function () {
+    var renderComponent;
+    beforeEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              renderComponent = (0, _helpers2.renderWithKintHarness)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpers.TestForm, {
+                initialValues: {},
+                onSubmit: onSubmit,
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalFormArrays.FieldArray, {
+                  component: _EditableSettingsListFieldArray.default,
+                  name: "settings"
+                })
+              }));
+
+            case 1:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    })));
+    it('renders empty field', function () {
+      var _renderComponent = renderComponent,
+          queryAllByTestId = _renderComponent.queryAllByTestId;
+      expect(queryAllByTestId(/editableSettingsListFieldArray\[.*\]/).length).toEqual(0);
+    });
+  });
+  describe('with initial value set', function () {
+    var renderComponent;
+    beforeEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              renderComponent = (0, _helpers2.renderWithKintHarness)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpers.TestForm, {
+                initialValues: {
+                  settings: settings
+                },
+                onSubmit: onSubmit,
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalFormArrays.FieldArray, {
+                  component: _EditableSettingsListFieldArray.default,
+                  name: "settings"
+                })
+              }));
+
+            case 1:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    })));
+    it('renders the SettingField component', function () {
+      var _renderComponent2 = renderComponent,
+          getByText = _renderComponent2.getByText;
+      expect(getByText('SettingField')).toBeInTheDocument();
+    });
+  });
+  describe('with multiple initial values set', function () {
+    var renderComponent;
+    beforeEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              renderComponent = (0, _helpers2.renderWithKintHarness)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_helpers.TestForm, {
+                initialValues: {
+                  settings: multipleSettings
+                },
+                onSubmit: onSubmit,
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalFormArrays.FieldArray, {
+                  component: _EditableSettingsListFieldArray.default,
+                  name: "settings"
+                })
+              }));
+
+            case 1:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    })));
+    it('renders the correct number of SettingField components', function () {
+      var _renderComponent3 = renderComponent,
+          getAllByText = _renderComponent3.getAllByText;
+      expect(getAllByText('SettingField').length).toEqual(multipleSettings.length);
+    });
+  });
+});
+;
+
+(function () {
+  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;
+
+  if (!reactHotLoader) {
+    return;
+  }
+
+  reactHotLoader.register(onSubmit, "onSubmit", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/EditableSettingsListFieldArray.test.js");
+  reactHotLoader.register(settings, "settings", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/EditableSettingsListFieldArray.test.js");
+  reactHotLoader.register(multipleSettings, "multipleSettings", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/EditableSettingsListFieldArray.test.js");
+})();
+
+;
+
+(function () {
+  var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
+  leaveModule && leaveModule(module);
+})();

package/es/lib/{Settings → EditableSettingsList/SettingField}/EditSettingValue.js

@@ -3,17 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactIntl = require("react-intl");
+
 var _reactFinalForm = require("react-final-form");
 
 var _components = require("@folio/stripes/components");
 
-var _RefdataButtons = _interopRequireDefault(require("./RefdataButtons"));
+var _RefdataButtons = _interopRequireDefault(require("../../RefdataButtons"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+(function () {
+  var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
+  enterModule && enterModule(module);
+})();
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
@@ -27,11 +38,22 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
+var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
+  return a;
+};
+
 var EditSettingValue = function EditSettingValue(props) {
   var input = props.input,
       setting = props.currentSetting,
       refdata = props.refdata,
       templates = props.templates;
+  var intl = (0, _reactIntl.useIntl)();
+  var fieldLabel = intl.formatMessage({
+    id: 'stripes-kint-components.settings.valueFor',
+    values: {
+      name: setting.key
+    }
+  });
 
   switch (setting.settingType) {
     case 'Refdata':
@@ -40,17 +62,19 @@ var EditSettingValue = function EditSettingValue(props) {
       var RefdataComponent = _components.Select;
 
       if (refdata.length > 0 && refdata.length <= 4) {
-        RefdataComponent = _RefdataButtons["default"];
+        RefdataComponent = _RefdataButtons.default;
       }
 
-      return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+        "aria-label": fieldLabel,
         component: RefdataComponent,
         dataOptions: refdata,
         name: "".concat(input.name, ".value")
       });
 
     case 'Password':
-      return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+        "aria-label": fieldLabel,
         autoFocus: true,
         component: _components.TextField,
         name: "".concat(input.name, ".value"),
@@ -74,7 +98,8 @@ var EditSettingValue = function EditSettingValue(props) {
             label: t.name
           };
         })));
-        return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+          "aria-label": fieldLabel,
           component: _components.Select,
           dataOptions: selectTemplateValues,
           name: "".concat(input.name, ".value"),
@@ -86,7 +111,8 @@ var EditSettingValue = function EditSettingValue(props) {
 
     default:
       // If in doubt, go with String
-      return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+        "aria-label": fieldLabel,
         autoFocus: true,
         component: _components.TextField,
         name: "".concat(input.name, ".value"),
@@ -98,5 +124,42 @@ var EditSettingValue = function EditSettingValue(props) {
   }
 };
 
+__signature__(EditSettingValue, "useIntl{intl}", function () {
+  return [_reactIntl.useIntl];
+});
+
+EditSettingValue.propTypes = {
+  currentSetting: _propTypes.default.shape({
+    settingType: _propTypes.default.string
+  }),
+  input: _propTypes.default.shape({
+    name: _propTypes.default.string
+  }),
+  refdata: _propTypes.default.arrayOf(_propTypes.default.object),
+  templates: _propTypes.default.arrayOf(_propTypes.default.shape({
+    name: _propTypes.default.string,
+    id: _propTypes.default.string
+  }))
+};
 var _default = EditSettingValue;
-exports["default"] = _default;
+var _default2 = _default;
+exports.default = _default2;
+;
+
+(function () {
+  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;
+
+  if (!reactHotLoader) {
+    return;
+  }
+
+  reactHotLoader.register(EditSettingValue, "EditSettingValue", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/SettingField/EditSettingValue.js");
+  reactHotLoader.register(_default, "default", "/home/ethan/FolioModules/stripes-kint-components/src/lib/EditableSettingsList/SettingField/EditSettingValue.js");
+})();
+
+;
+
+(function () {
+  var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
+  leaveModule && leaveModule(module);
+})();