@talend/react-faceted-search
Version:
129 lines (127 loc) • 4 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.BadgeMenu = void 0;
var _react = require("react");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _facetedSearch = require("../../facetedSearch.propTypes");
var _BadgeFaceted = require("../BadgeFaceted");
var _BadgeMenuForm = require("./BadgeMenuForm.component");
var _reactComponents = require("@talend/react-components");
var _lodash = require("lodash");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const getSelectBadgeLabel = (value, t) => {
const labelAll = t('FACETED_SEARCH_VALUE_ALL', {
defaultValue: 'All'
});
if (!(0, _lodash.isEmpty)(value)) {
return value.label;
}
return labelAll;
};
// eslint-disable-next-line import/prefer-default-export
const BadgeMenu = ({
id,
readOnly,
removable,
label,
initialOperatorOpened,
initialValueOpened,
operator,
operators,
size,
value,
values,
displayType,
filterBarPlaceholder,
t,
callbacks,
...rest
}) => {
const [options, setOptions] = (0, _react.useState)(values);
const currentOperators = (0, _react.useMemo)(() => operators, [operators]);
const currentOperator = operator || currentOperators && currentOperators[0];
const [isLoading, setIsLoading] = (0, _react.useState)(true);
const callback = callbacks && callbacks[rest.attribute];
(0, _react.useEffect)(() => {
if (!callback || !callback.getOptions) {
setIsLoading(false);
return;
}
setIsLoading(true);
callback.getOptions().then(data => {
setOptions(data.map(item => {
if ((0, _lodash.isObject)(item)) {
return {
id: item.id,
label: item.label
};
}
return {
id: item,
label: item
};
}));
}).finally(() => {
setIsLoading(false);
});
}, [callback]);
const badgeMenuId = `${id}-badge-menu`;
const badgeLabel = (0, _react.useMemo)(() => getSelectBadgeLabel(value, t), [value, t]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BadgeFaceted.BadgeFaceted, {
badgeId: id,
displayType: displayType,
id: badgeMenuId,
initialOperatorOpened: initialOperatorOpened,
initialValueOpened: initialValueOpened,
labelCategory: label,
labelValue: badgeLabel,
operator: currentOperator,
operators: currentOperators,
readOnly: readOnly,
removable: removable,
size: size,
t: t,
value: value || {},
children: ({
onSubmitBadge,
onChangeValue,
badgeValue
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BadgeMenuForm.BadgeMenuForm, {
id: badgeMenuId,
onChange: onChangeValue,
onSubmit: onSubmitBadge,
value: badgeValue,
values: options,
filterBarPlaceholder: filterBarPlaceholder,
isLoading: isLoading,
t: t,
...rest
})
});
};
exports.BadgeMenu = BadgeMenu;
BadgeMenu.propTypes = {
label: _propTypes.default.string.isRequired,
id: _propTypes.default.string.isRequired,
initialOperatorOpened: _propTypes.default.bool,
initialValueOpened: _propTypes.default.bool,
operator: _facetedSearch.operatorPropTypes,
operators: _facetedSearch.operatorsPropTypes,
size: _propTypes.default.oneOf(Object.values(_reactComponents.Badge.SIZES)),
value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({
checked: _propTypes.default.bool,
id: _propTypes.default.string.isRequired,
label: _propTypes.default.string.isRequired
})]),
readOnly: _propTypes.default.bool,
removable: _propTypes.default.bool,
values: _propTypes.default.array,
callbacks: _facetedSearch.callbacksPropTypes,
t: _propTypes.default.func.isRequired,
displayType: _propTypes.default.oneOf(Object.values(_reactComponents.Badge.TYPES)),
filterBarPlaceholder: _propTypes.default.string
};
//# sourceMappingURL=BadgeMenu.component.js.map