@procraft/widget-order
Version:
Order widget for landing
138 lines • 7.44 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ReviewsPopup = exports.calcRatingAverage = void 0;
const moment_1 = __importDefault(require("moment"));
const react_1 = __importStar(require("react"));
const react_dom_1 = __importDefault(require("react-dom"));
const utils_1 = require("../../../utils");
const Stars_1 = require("../Stars");
const Filters_1 = require("./Filters");
const Review_1 = require("./Review");
const Stats_1 = require("./Stats");
const styles_1 = require("./styles");
/**
* Подсчитываем средний рейтинг
*/
const calcRatingAverage = (item) => {
var _a, _b;
const reviewItems = (_b = (_a = item.reviews) === null || _a === void 0 ? void 0 : _a.edges) === null || _b === void 0 ? void 0 : _b.reduce((curr, next) => {
if (next) {
curr.push(next.node);
}
return curr;
}, []);
const preparedValue = ((reviewItems === null || reviewItems === void 0 ? void 0 : reviewItems.reduce((curr, next) => curr + next.rating, 0)) || 0) /
((reviewItems === null || reviewItems === void 0 ? void 0 : reviewItems.length) || 0);
const ratingHalfMean = (0, utils_1.roundByStep)(preparedValue, 0.5);
const ratingStd = (0, utils_1.roundStd)(preparedValue, 1);
return { ratingHalfMean, ratingStd };
};
exports.calcRatingAverage = calcRatingAverage;
const ReviewsPopup = ({ item, active, close, }) => {
var _a, _b;
const body = (_a = global.document) === null || _a === void 0 ? void 0 : _a.body;
// const preventClick = useCallback(
// (event: React.MouseEvent<HTMLDivElement>) => {
// event.preventDefault()
// event.stopPropagation()
// },
// []
// )
const [orderBy, orderBySetter] = (0, react_1.useState)('date_desc');
const [reviewsFilter, setReviewsFilter] = (0, react_1.useState)({});
const onSelectFilter = (0, react_1.useCallback)((stars, expect) => setReviewsFilter({
stars,
expect,
}), [setReviewsFilter]);
const reviewsNodes = (0, react_1.useMemo)(() => {
var _a, _b;
let reviewsNodes = [];
(_b = (_a = item.reviews) === null || _a === void 0 ? void 0 : _a.edges) === null || _b === void 0 ? void 0 : _b.forEach((n) => {
if (n === null || n === void 0 ? void 0 : n.node) {
reviewsNodes.push(n.node);
}
});
let sorter;
switch (orderBy) {
/**
* Сортировка по дате
*/
case 'date_desc':
sorter = (curr, next) => {
const currDate = (0, moment_1.default)(curr.timeCreated);
const nextDate = (0, moment_1.default)(next.timeCreated);
return currDate === nextDate ? 0 : currDate > nextDate ? -1 : 1;
};
break;
/**
* Сортировка по рейтингу
*/
case 'rating_desc':
sorter = (curr, next) => {
return curr.rating === next.rating
? 0
: curr.rating > next.rating
? -1
: 1;
};
break;
}
sorter && reviewsNodes.sort(sorter);
if (reviewsFilter.stars) {
reviewsNodes = reviewsNodes.filter((n) => reviewsFilter.stars === n.rating);
}
if (reviewsFilter.expect) {
reviewsNodes = reviewsNodes.filter((n) => reviewsFilter.expect === n.meetExpectation);
}
return reviewsNodes;
}, [(_b = item.reviews) === null || _b === void 0 ? void 0 : _b.edges, orderBy, reviewsFilter]);
return (0, react_1.useMemo)(() => {
if (!body || !active) {
return null;
}
const { ratingHalfMean, ratingStd } = (0, exports.calcRatingAverage)(item);
const portal = react_dom_1.default.createPortal(react_1.default.createElement(styles_1.ReviewsPopupStyled, null,
react_1.default.createElement(styles_1.ReviewsPopupContentStyled, null,
react_1.default.createElement("button", { className: "close", onClick: close },
react_1.default.createElement("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.34338 1.34315C1.96822 0.718306 2.98128 0.718307 3.60612 1.34315L7.00023 4.73726L10.3943 1.34315C11.0192 0.718307 12.0322 0.718307 12.6571 1.34315C13.2819 1.96799 13.2819 2.98105 12.6571 3.60589L9.26297 7L12.6571 10.3941C13.2819 11.019 13.2819 12.032 12.6571 12.6569C12.0322 13.2817 11.0192 13.2817 10.3943 12.6569L7.00023 9.26274L3.60612 12.6569C2.98128 13.2817 1.96822 13.2817 1.34338 12.6569C0.718538 12.032 0.718538 11.019 1.34338 10.3941L4.73749 7L1.34338 3.60589C0.718538 2.98105 0.718538 1.96799 1.34338 1.34315Z", fill: "#093258" }))),
react_1.default.createElement("div", { className: "content" },
react_1.default.createElement(styles_1.ReviewsPopupTitleStyled, null,
item.name,
item.reviewsCount ? (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("span", { className: "mean-val" }, ratingStd),
react_1.default.createElement(Stars_1.Stars, { rating: ratingHalfMean }),
' ',
react_1.default.createElement("span", { className: "reviews" }, item.reviewsCount))) : null),
react_1.default.createElement(Stats_1.ReviewsStats, { reviews: item.reviews, onSelectFilter: onSelectFilter }),
react_1.default.createElement(Filters_1.ReviewFilters, { orderBy: orderBy, orderBySetter: orderBySetter }),
reviewsNodes.map((n) => {
return n ? react_1.default.createElement(Review_1.Review, { key: n.id, review: n }) : null;
})))), body);
return react_1.default.createElement(react_1.default.Fragment, null, portal);
}, [active, body, close, item, orderBy, reviewsNodes, onSelectFilter]);
};
exports.ReviewsPopup = ReviewsPopup;
//# sourceMappingURL=index.js.map