chayns-components
Version:
A set of beautiful React components for developing chayns® applications.
127 lines (124 loc) • 6.67 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactTransitionState = require("react-transition-state");
var _mapStatusToClass = require("../../../utils/mapStatusToClass");
var _Receiver = _interopRequireDefault(require("./Receiver"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
/* eslint-disable no-nested-ternary,react/forbid-prop-types */
const ReceiverSearchPopup = _ref => {
let {
updateReceiverSearchString,
updateChosenReceivers,
chosenReceivers,
foundReceivers,
showIdInPopup,
onlyPersons,
isLocation,
onlySites,
position,
width,
show
} = _ref;
const locationResultState = foundReceivers.locations.state;
const groupResultState = foundReceivers.groups.state;
const userResultState = foundReceivers.users.state;
const tooManyResultsError = /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item error-message"
}, "Zu viele Ergebnisse gefunden");
const noMatchError = /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item error-message"
}, "Keine passenden Ergebnisse gefunden");
const locations = foundReceivers.locations.values.map(l => /*#__PURE__*/_react.default.createElement(_Receiver.default, {
imgUrl: `https://sub60.tobit.com/l/${l.locationID}?size=30`,
name: l.appstoreName || l.showName,
updateReceiverSearchString: updateReceiverSearchString,
updateChosenReceivers: updateChosenReceivers,
key: `locationId_${l.locationID}`,
chosenReceivers: chosenReceivers,
showIdInPopup: showIdInPopup,
locationId: l.locationID,
siteId: l.siteID
}));
const users = foundReceivers.users.values.map(u => /*#__PURE__*/_react.default.createElement(_Receiver.default, {
imgUrl: `https://sub60.tobit.com/u/${u.userId}?size=30`,
updateReceiverSearchString: updateReceiverSearchString,
updateChosenReceivers: updateChosenReceivers,
chosenReceivers: chosenReceivers,
showIdInPopup: showIdInPopup,
key: `userId_${u.userId}`,
personId: u.personId,
userId: u.userId,
name: u.name
}));
const groups = isLocation && foundReceivers.groups.values.map(g => /*#__PURE__*/_react.default.createElement(_Receiver.default, {
updateReceiverSearchString: updateReceiverSearchString,
updateChosenReceivers: updateChosenReceivers,
chosenReceivers: chosenReceivers,
key: `groupId_${g.groupId}`,
includedUsers: g.userIds,
groupId: g.groupId,
name: g.showName
}));
const receiverPopupStyles = {
top: position === null || position === void 0 ? void 0 : position.top,
left: position === null || position === void 0 ? void 0 : position.left,
width
};
const showPopup = show && (locationResultState !== 3 || userResultState !== 3 || groupResultState !== 3 && isLocation);
const [{
status,
isMounted
}, toggle] = (0, _reactTransitionState.useTransitionState)({
timeout: 300,
mountOnEnter: true,
unmountOnExit: true,
preEnter: true
});
(0, _react.useEffect)(() => {
toggle(showPopup);
}, [showPopup, toggle]);
if (!isMounted) return null;
return /*#__PURE__*/_react.default.createElement("div", {
className: `receiver-popup ${(0, _mapStatusToClass.mapStatusToClass)(status, 'swipe-up')}`,
style: receiverPopupStyles
}, !onlyPersons && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
className: "group-headline popup-item"
}, "Sites"), locations, locationResultState > 0 && (locationResultState === 2 ? tooManyResultsError : noMatchError), locationResultState === 0 && /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
})), !onlySites && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
className: "group-headline popup-item"
}, "Personen"), users, userResultState > 0 && (userResultState === 2 ? tooManyResultsError : noMatchError), userResultState === 0 && /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
})), isLocation && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
className: "group-headline popup-item"
}, "Gruppen"), groups, groupResultState > 0 && (groupResultState === 2 ? tooManyResultsError : noMatchError), groupResultState === 0 && /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
})));
};
ReceiverSearchPopup.propTypes = {
updateReceiverSearchString: _propTypes.default.func.isRequired,
updateChosenReceivers: _propTypes.default.func.isRequired,
chosenReceivers: _propTypes.default.array.isRequired,
foundReceivers: _propTypes.default.object.isRequired,
isLocation: _propTypes.default.bool.isRequired,
position: _propTypes.default.object.isRequired,
width: _propTypes.default.number.isRequired,
show: _propTypes.default.bool.isRequired,
showIdInPopup: _propTypes.default.bool,
onlyPersons: _propTypes.default.bool,
onlySites: _propTypes.default.bool
};
ReceiverSearchPopup.defaultProps = {
showIdInPopup: false,
onlyPersons: false,
onlySites: false
};
ReceiverSearchPopup.displayName = 'ReceiverSearchPopup';
var _default = ReceiverSearchPopup;
exports.default = _default;
//# sourceMappingURL=ReceiverSearchPopup.js.map