@r3l/app
Version:
312 lines (264 loc) • 11.5 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.BetContainer = BetContainer;
exports.default = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactRedux = require("react-redux");
var _styled = require("../../styled");
var _numbers = require("../../../utils/numbers");
var _common = require("@r3l/common");
var _coinStat = _interopRequireDefault(require("../../stats/coinStat.component"));
var _invest = require("../invest.actions");
var _navigation = require("../../navigation/navigation.actions");
var _tooltip = _interopRequireDefault(require("../../tooltip/tooltip.component"));
var _price = require("../../wallet/price.context");
var _community = require("../../community/community.selectors");
var _betstats = _interopRequireDefault(require("./betstats"));
var _circlebutton = _interopRequireDefault(require("./circlebutton"));
var _smallcoinstat = _interopRequireDefault(require("./smallcoinstat"));
var _mobile = require("../../../utils/recaptcha/mobile");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
function BetContainer(_ref) {
var props = (0, _extends2.default)({}, _ref);
var user = (0, _reactRedux.useSelector)(function (state) {
return state.auth.user;
}) || {};
var post = (0, _reactRedux.useSelector)(function (state) {
return state.posts.posts[state.navigation.modalData.postId];
});
if (!user || !post) return null;
return /*#__PURE__*/_react.default.createElement(Bet, (0, _extends2.default)({
user: user,
post: post
}, props));
}
Bet.propTypes = {
user: _propTypes.default.object,
post: _propTypes.default.object,
close: _propTypes.default.func
};
function Bet(_ref2) {
var _post$data, _post$data3;
var user = _ref2.user,
post = _ref2.post,
close = _ref2.close;
var dispatch = (0, _reactRedux.useDispatch)();
var community = (0, _community.useCommunity)();
var _useState = (0, _react.useState)(),
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
recaptcha = _useState2[0],
setCaptcha = _useState2[1];
var reCaptchaRef = (0, _react.useRef)();
var earning = (0, _reactRedux.useSelector)(function (state) {
return !community ? null : state.earnings.pending.map(function (e) {
return state.earnings.entities[e];
}).find(function (ee) {
return ee.post === post._id && ee.communityId === (community === null || community === void 0 ? void 0 : community._id);
});
});
var _useState3 = (0, _react.useState)(false),
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
processingBet = _useState4[0],
setProcessingBet = _useState4[1];
var title = earning ? 'Increase Your Bet' : 'Bet on the Relevance of this Post';
var existingStake = (earning === null || earning === void 0 ? void 0 : earning.stakedTokens) || 0;
var totalBalance = user.balance + user.tokenBalance;
var maxBet = Math.min(_common.MAX_BET - existingStake, totalBalance - user.lockedTokens);
var defaultAmount = Math.max(maxBet * _common.VOTE_COST_RATIO, 0);
var _useState5 = (0, _react.useState)(defaultAmount),
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
amount = _useState6[0],
setAmount = _useState6[1]; // const time = getTimestamp(post.data.payoutTime).toLowerCase();
var _useState7 = (0, _react.useState)((0, _numbers.timeLeftTick)(post === null || post === void 0 ? void 0 : (_post$data = post.data) === null || _post$data === void 0 ? void 0 : _post$data.payoutTime)),
_useState8 = (0, _slicedToArray2.default)(_useState7, 2),
time = _useState8[0],
setTimer = _useState8[1];
(0, _react.useEffect)(function () {
if (!post.data) return function () {
return null;
};
var id = setInterval(function () {
var _post$data2;
return setTimer((0, _numbers.timeLeftTick)(post === null || post === void 0 ? void 0 : (_post$data2 = post.data) === null || _post$data2 === void 0 ? void 0 : _post$data2.payoutTime));
}, 1000);
return function () {
return clearInterval(id);
};
}, [post === null || post === void 0 ? void 0 : (_post$data3 = post.data) === null || _post$data3 === void 0 ? void 0 : _post$data3.payoutTime, time]);
if (!user || !post || !post.data) return null;
var plusAmount = function plusAmount() {
return setAmount(function (a) {
var largeStep = (maxBet - defaultAmount) / 5;
var smallStep = defaultAmount / 5;
var err = defaultAmount / 100;
return a + smallStep <= defaultAmount + err ? a + smallStep : Math.min(a + largeStep, maxBet);
});
};
var minusAmount = function minusAmount() {
return setAmount(function (a) {
var largeStep = (maxBet - defaultAmount) / 5;
var smallStep = defaultAmount / 5;
var err = defaultAmount / 100;
if (a - smallStep <= 0 + err) return a;
return a - largeStep >= defaultAmount - err ? a - largeStep : Math.max(0, a - smallStep);
});
};
var placeBet = /*#__PURE__*/function () {
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_context.prev = 0;
setProcessingBet(true);
_context.next = 4;
return dispatch((0, _invest.bet)({
postId: post._id,
stakedTokens: amount,
recaptcha: recaptcha
}));
case 4:
setProcessingBet(false);
close();
_context.next = 11;
break;
case 8:
_context.prev = 8;
_context.t0 = _context["catch"](0);
setProcessingBet(false);
case 11:
case "end":
return _context.stop();
}
}
}, _callee, null, [[0, 8]]);
}));
return function placeBet() {
return _ref3.apply(this, arguments);
};
}();
var exchageUrl = (0, _price.exchangeLink)();
var power = 100 * amount / maxBet;
var tooltipData = {
text: 'Posts that get upvoted by lots of users with high Reputation get payouts.\n\nBet more coins and bet early in order to win the biggest portion of the payout.'
};
return /*#__PURE__*/_react.default.createElement(_styled.View, null, /*#__PURE__*/_react.default.createElement(_styled.Header, {
sx: {
mr: 2
}
}, title, " ", /*#__PURE__*/_react.default.createElement(_tooltip.default, {
inline: 1,
name: 'betInfo',
data: tooltipData,
info: true
})), /*#__PURE__*/_react.default.createElement(_styled.Row, {
sx: {
alignItems: 'baseline'
}
}, /*#__PURE__*/_react.default.createElement(_styled.SmallText, {
sx: {
mt: 1,
mr: 1
}
}, "Time until payout: ", time)), /*#__PURE__*/_react.default.createElement(_styled.Row, {
sx: {
mt: 4,
justifyContent: 'space-between',
alignItems: 'center'
}
}, /*#__PURE__*/_react.default.createElement(_circlebutton.default, {
onPress: minusAmount
}, "\u2013"), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
pr: 1
}
}, /*#__PURE__*/_react.default.createElement(_coinStat.default, {
align: 'center',
fs: 4.5,
lh: 4.5,
size: 5,
spaceBetween: 1,
c: 'black',
amount: amount
})), /*#__PURE__*/_react.default.createElement(_circlebutton.default, {
onPress: plusAmount
}, "+")), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
mt: 2
}
}, /*#__PURE__*/_react.default.createElement(_styled.Row, {
sx: {
height: 4.001
}
}, /*#__PURE__*/_react.default.createElement(_styled.Box, {
sx: {
width: "".concat(power, "%"),
bg: 'blue'
}
}), /*#__PURE__*/_react.default.createElement(_styled.Box, {
sx: {
width: "".concat(100 - power, "%"),
bg: 'lightBorder'
}
})), /*#__PURE__*/_react.default.createElement(_styled.Row, {
sx: {
justifyContent: 'space-between'
}
}, /*#__PURE__*/_react.default.createElement(_styled.SecondaryText, {
sx: {
mt: 4.001
}
}, "Available Coins:", ' ', /*#__PURE__*/_react.default.createElement(_smallcoinstat.default, {
amount: totalBalance - user.lockedTokens - amount
})), (0, _price.tokenEnabled)() && /*#__PURE__*/_react.default.createElement(_styled.InlineLink, {
hu: true,
inline: true,
to: exchageUrl,
nativeAction: function nativeAction() {
return dispatch((0, _navigation.goToUrl)(exchageUrl));
},
external: true,
target: "_blank"
}, /*#__PURE__*/_react.default.createElement(_styled.SecondaryText, {
sx: {
color: 'blue',
lineHeight: 2
}
}, "Get more coins")))), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
mt: 3
}
}, /*#__PURE__*/_react.default.createElement(_betstats.default, {
maxBet: maxBet,
post: post,
amount: amount,
earning: earning
})), /*#__PURE__*/_react.default.createElement(_styled.HoverButton, {
sx: {
mt: 3
},
onPress: placeBet,
disabled: processingBet || !amount
}, "Bet ", (0, _numbers.abbreviateNumber)(amount), " Coins"), /*#__PURE__*/_react.default.createElement(_styled.SmallText, {
sx: {
mt: 2
}
}, "*All coins will be returned to your wallet 3 days after you place your bet."), /*#__PURE__*/_react.default.createElement(_mobile.Captcha, {
reCaptchaRef: reCaptchaRef,
action: 'bet',
setToken: setCaptcha
}));
}
var _default = /*#__PURE__*/(0, _react.memo)(BetContainer);
exports.default = _default;
//# sourceMappingURL=bet.js.map