chayns-components
Version:
A set of beautiful React components for developing chayns® applications.
151 lines (148 loc) • 7.7 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _reactTransitionGroup = require("react-transition-group");
var _react = _interopRequireWildcard(require("react"));
var _lodash = _interopRequireDefault(require("lodash.isequal"));
var _propTypes = _interopRequireDefault(require("prop-types"));
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 */
class ReceiverSearchPopup extends _react.Component {
shouldComponentUpdate(nextProps) {
const {
chosenReceivers,
foundReceivers,
showIdInPopup,
onlyPersons,
isLocation,
onlySites,
position,
width,
show
} = this.props;
return !(0, _lodash.default)(chosenReceivers, nextProps.chosenReceivers) || !(0, _lodash.default)(foundReceivers, nextProps.foundReceivers) || showIdInPopup !== nextProps.showIdInPopup || !(0, _lodash.default)(position, nextProps.position) || onlyPersons !== nextProps.onlyPersons || isLocation !== nextProps.isLocation || onlySites !== nextProps.onlySites || width !== nextProps.width || show !== nextProps.show;
}
render() {
const {
updateReceiverSearchString,
updateChosenReceivers,
chosenReceivers,
foundReceivers,
showIdInPopup,
onlyPersons,
isLocation,
onlySites,
position,
width,
show
} = this.props;
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 = [];
const groups = [];
const users = [];
foundReceivers.locations.values.forEach(l => {
locations.push( /*#__PURE__*/_react.default.createElement(_Receiver.default, {
imgUrl: `https://sub60.tobit.com/l/${l.locationID}?size=30`,
name: l.appstoreName !== '' ? l.appstoreName : l.showName,
updateReceiverSearchString: updateReceiverSearchString,
updateChosenReceivers: updateChosenReceivers,
key: `locationId_${l.locationID}`,
chosenReceivers: chosenReceivers,
showIdInPopup: showIdInPopup,
locationId: l.locationID,
siteId: l.siteID
}));
});
foundReceivers.users.values.forEach(u => {
users.push( /*#__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
}));
});
if (isLocation) {
foundReceivers.groups.values.forEach(g => {
groups.push( /*#__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 = {};
if (position) {
if (position.top) {
receiverPopupStyles.top = position.top;
}
if (position.left) {
receiverPopupStyles.left = position.left;
}
if (width) {
receiverPopupStyles.width = width;
}
}
const showPopup = show && (locationResultState !== 3 || userResultState !== 3 || groupResultState !== 3 && isLocation);
return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.TransitionGroup, null, /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
key: showPopup,
timeout: 300,
classNames: "swipe-up"
}, showPopup ? /*#__PURE__*/_react.default.createElement("div", {
className: "receiver-popup",
style: receiverPopupStyles
}, onlyPersons ? false : /*#__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 : /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
})), onlySites ? false : /*#__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 : /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
})), !isLocation ? false : /*#__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 : /*#__PURE__*/_react.default.createElement("div", {
className: "popup-item"
}))) : /*#__PURE__*/_react.default.createElement("div", null)));
}
}
exports.default = ReceiverSearchPopup;
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';
//# sourceMappingURL=ReceiverSearchPopup.js.map