@chayns-components/person-finder
Version:
A set of beautiful React components for developing your own applications with chayns.
78 lines (77 loc) • 4.31 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _core = require("@chayns-components/core");
var _personFinder = require("../../../../../types/personFinder");
var _personFinder2 = require("../../../../../utils/personFinder");
var _PersonFinderGroup = require("./PersonFinderGroup.styles");
var _PersonFinderProvider = require("../../../../PersonFinderProvider");
var _PersonFinderItem = _interopRequireDefault(require("./person-finder-item/PersonFinderItem"));
var _personFinder3 = require("../../../../../hooks/personFinder");
var _PersonFinderSmallItem = _interopRequireDefault(require("./person-finder-small-item/PersonFinderSmallItem"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const PersonFinderGroup = ({
entries,
filterKey,
count,
shouldShowGroupName,
onAdd,
onRemove
}) => {
const {
loadMore,
loadingState: loadingStateFromState,
search
} = (0, _PersonFinderProvider.usePersonFinder)();
const areOnlyFriendsGiven = (0, _personFinder3.useOnlyFriends)(entries) || filterKey === _personFinder.PersonFinderFilterTypes.UAC;
const groupName = (0, _personFinder2.getGroupName)(filterKey);
const loadingState = loadingStateFromState ? loadingStateFromState[filterKey] ?? _personFinder.LoadingState.None : _personFinder.LoadingState.None;
const shouldShowLoadMoreButton = entries.length < count;
const waitCursor = (entries.length === 0 || areOnlyFriendsGiven) && loadingState === _personFinder.LoadingState.Pending ? /*#__PURE__*/_react.default.createElement(_PersonFinderGroup.StyledPersonFinderGroupWaitCursor, null, /*#__PURE__*/_react.default.createElement(_core.SmallWaitCursor, {
shouldHideBackground: true
})) : null;
const errorMessage = (0, _personFinder3.useErrorMessage)({
areOnlyFriendsGiven,
entries,
loadingState,
search: search ?? '',
groupName
});
const handleLoadMore = (0, _react.useCallback)(() => {
if (typeof loadMore === 'function') {
loadMore(filterKey);
}
}, [filterKey, loadMore]);
const handlePreventDefault = event => {
event.preventDefault();
event.stopPropagation();
};
return /*#__PURE__*/_react.default.createElement(_PersonFinderGroup.StyledPersonFinderGroup, {
onClick: handlePreventDefault
}, shouldShowGroupName && /*#__PURE__*/_react.default.createElement(_PersonFinderGroup.StyledPersonFinderGroupName, {
className: "person-finder-group-name"
}, groupName), entries.length > 0 && /*#__PURE__*/_react.default.createElement(_core.List, null, entries.map(entry => typeof entry.id === 'number' ? /*#__PURE__*/_react.default.createElement(_PersonFinderSmallItem.default, {
key: `person-finder-entry--${entry.id}`,
entry: entry,
onAdd: onAdd,
onRemove: onRemove
}) : /*#__PURE__*/_react.default.createElement(_PersonFinderItem.default, {
key: `person-finder-entry--${entry.id}`,
entry: entry,
onAdd: onAdd,
onRemove: onRemove
}))), waitCursor, errorMessage, shouldShowLoadMoreButton && /*#__PURE__*/_react.default.createElement(_PersonFinderGroup.StyledPersonFinderGroupButtonWrapper, {
key: `more-button-wrapper--${filterKey}`
}, /*#__PURE__*/_react.default.createElement(_core.Button, {
key: `more-button--${filterKey}`,
shouldShowWaitCursor: loadingState === _personFinder.LoadingState.Pending,
onClick: handleLoadMore
}, "Mehr ", (0, _personFinder2.getGroupName)(filterKey))));
};
PersonFinderGroup.displayName = 'PersonFinderGroup';
var _default = exports.default = PersonFinderGroup;
//# sourceMappingURL=PersonFinderGroup.js.map