@uifabric/experiments
Version:
Experimental React components for building experiences for Microsoft 365.
54 lines • 2.38 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = require("react");
exports.useMicroFeedbackState = function (props) {
var sendFeedback = props.sendFeedback;
var likeRef = react_1.useRef(null);
var dislikeRef = react_1.useRef(null);
var _a = react_1.useState(undefined), timerHandle = _a[0], setTimerHandle = _a[1];
var _b = react_1.useState('no_vote'), vote = _b[0], setVote = _b[1];
var _c = react_1.useState(false), isFollowUpVisible = _c[0], setIsFollowUpVisible = _c[1];
var _d = react_1.useState(false), isThanksVisible = _d[0], setIsThanksVisible = _d[1];
var onCalloutDismiss = react_1.useCallback(function () {
setIsFollowUpVisible(false);
}, []);
var onThanksDismiss = react_1.useCallback(function () {
clearTimeout(timerHandle);
setIsThanksVisible(false);
}, [timerHandle]);
var processVote = react_1.useCallback(function (newVote) {
// If the vote that is already selected is picked, then toggle off
var updatedVote = vote === newVote ? 'no_vote' : newVote;
setIsFollowUpVisible(true);
setVote(updatedVote);
if (updatedVote !== 'no_vote' && sendFeedback) {
sendFeedback(updatedVote);
}
}, [sendFeedback, vote]);
var onLikeVote = react_1.useCallback(function () {
processVote('like');
}, [processVote]);
var onDislikeVote = react_1.useCallback(function () {
processVote('dislike');
}, [processVote]);
var hideThanksMessage = react_1.useCallback(function () {
setIsThanksVisible(false);
}, []);
var onThanksShow = react_1.useCallback(function () {
setIsThanksVisible(true);
// Hide the Thanks message after 2 seconds
setTimerHandle(setTimeout(hideThanksMessage, 2000));
}, [hideThanksMessage]);
var viewProps = tslib_1.__assign(tslib_1.__assign({}, props), { vote: vote, isFollowUpVisible: isFollowUpVisible,
likeRef: likeRef,
dislikeRef: dislikeRef,
onCalloutDismiss: onCalloutDismiss,
onThanksDismiss: onThanksDismiss,
onThanksShow: onThanksShow,
onLikeVote: onLikeVote,
onDislikeVote: onDislikeVote,
isThanksVisible: isThanksVisible });
return viewProps;
};
//# sourceMappingURL=MicroFeedback.state.js.map