UNPKG

@kiwicom/smart-faq

Version:
197 lines (162 loc) 10.4 kB
"use strict"; var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard"); var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _style = _interopRequireDefault(require("styled-jsx/style")); var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator")); var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator")); var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var React = _interopRequireWildcard(require("react")); var _Text = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Text")); var _Text2 = _interopRequireDefault(require("@kiwicom/nitro/lib/components/Text")); var _BackButton = _interopRequireDefault(require("../common/buttons/BackButton")); var _CloseButton = _interopRequireDefault(require("../common/buttons/CloseButton")); var _Input = _interopRequireDefault(require("../common/Input")); var _ResetPassword = _interopRequireDefault(require("../mutations/ResetPassword")); // @flow var image = "https://images.kiwi.com/smart-faq/woman-with-laptop@2x.jpg"; var style = new String(".ForgottenPassword{width:480px;padding-top:128px;margin:auto;}div.picture img{width:203px;height:156px;}div.picture{margin-left:150px;margin-bottom:68px;}div.main{margin-left:40px;margin-right:40px;}p.title{color:#171b1e;font-size:28px;font-weight:bold;margin-top:0;margin-bottom:8px;line-height:1.2;}button.send{width:83px;background-color:#00a991;border:0;font-size:14px;font-weight:bold;line-height:1.43;color:#ffffff;}label{display:inline-block;width:300px;height:44px;}form{margin:32.8px 40px 0px 40px;}div.input{display:inline-block;width:100%;height:44px;margin-top:4px;}form button{width:83px;height:44px;border-radius:3px;background-color:#00a991;font-size:14px;color:#ffffff;cursor:pointer;font-weight:bold;line-height:1.43;text-align:center;border:none;margin-left:8px;display:inline-block;}@media only screen and (max-width:480px){.ForgottenPassword{width:100%;padding-top:64px;}div.picture{display:none;}p.title{font-size:22px;text-align:left;}div.main{margin-left:16px;margin-right:16px;}form{margin:33px 16px 0px;}label{display:block;width:100%;height:44px;margin-bottom:33px;}form button{width:100%;border-radius:3px;margin-bottom:0px;margin-left:0px;display:block;width:100%;}button.send{width:288px;height:44px;}}@media only screen and (max-height:480px) and (orientation:landscape){.ForgottenPassword{width:288px;padding-top:20px;}div.picture{display:none;}p.title{font-size:22px;text-align:center;}div.main{margin:0;}div.input{width:288px;}form{margin:33px 0 0;}form button{width:100%;margin:28px 0 0;}}"); style.__hash = "495170938"; style.__scoped = ".ForgottenPassword.jsx-3557208507{width:480px;padding-top:128px;margin:auto;}div.picture.jsx-3557208507 img.jsx-3557208507{width:203px;height:156px;}div.picture.jsx-3557208507{margin-left:150px;margin-bottom:68px;}div.main.jsx-3557208507{margin-left:40px;margin-right:40px;}p.title.jsx-3557208507{color:#171b1e;font-size:28px;font-weight:bold;margin-top:0;margin-bottom:8px;line-height:1.2;}button.send.jsx-3557208507{width:83px;background-color:#00a991;border:0;font-size:14px;font-weight:bold;line-height:1.43;color:#ffffff;}label.jsx-3557208507{display:inline-block;width:300px;height:44px;}form.jsx-3557208507{margin:32.8px 40px 0px 40px;}div.input.jsx-3557208507{display:inline-block;width:100%;height:44px;margin-top:4px;}form.jsx-3557208507 button.jsx-3557208507{width:83px;height:44px;border-radius:3px;background-color:#00a991;font-size:14px;color:#ffffff;cursor:pointer;font-weight:bold;line-height:1.43;text-align:center;border:none;margin-left:8px;display:inline-block;}@media only screen and (max-width:480px){.ForgottenPassword.jsx-3557208507{width:100%;padding-top:64px;}div.picture.jsx-3557208507{display:none;}p.title.jsx-3557208507{font-size:22px;text-align:left;}div.main.jsx-3557208507{margin-left:16px;margin-right:16px;}form.jsx-3557208507{margin:33px 16px 0px;}label.jsx-3557208507{display:block;width:100%;height:44px;margin-bottom:33px;}form.jsx-3557208507 button.jsx-3557208507{width:100%;border-radius:3px;margin-bottom:0px;margin-left:0px;display:block;width:100%;}button.send.jsx-3557208507{width:288px;height:44px;}}@media only screen and (max-height:480px) and (orientation:landscape){.ForgottenPassword.jsx-3557208507{width:288px;padding-top:20px;}div.picture.jsx-3557208507{display:none;}p.title.jsx-3557208507{font-size:22px;text-align:center;}div.main.jsx-3557208507{margin:0;}div.input.jsx-3557208507{width:288px;}form.jsx-3557208507{margin:33px 0 0;}form.jsx-3557208507 button.jsx-3557208507{width:100%;margin:28px 0 0;}}"; style.__scopedHash = "3557208507"; /*:: type Props = { history: { push: ({ pathname: string, state: { email: string, }, }) => void, }, };*/ /*:: type State = {| email: string, |};*/ var ForgottenPassword = /*#__PURE__*/ function (_React$Component) { (0, _inherits2.default)(ForgottenPassword, _React$Component); function ForgottenPassword() { var _getPrototypeOf2; var _this; (0, _classCallCheck2.default)(this, ForgottenPassword); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(ForgottenPassword)).call.apply(_getPrototypeOf2, [this].concat(args))); (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", { email: '' }); (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "handleChangeEmail", function (e /*: SyntheticInputEvent<HTMLInputElement>*/ ) { _this.setState({ email: e.target.value }); }); (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "handleSubmitEmail", /*#__PURE__*/ function () { var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/ _regenerator.default.mark(function _callee(e /*: SyntheticEvent<HTMLFormElement>*/ ) { var email; return _regenerator.default.wrap(function _callee$(_context) { while (1) { switch (_context.prev = _context.next) { case 0: e.preventDefault(); email = _this.state.email; _context.prev = 2; _context.next = 5; return (0, _ResetPassword.default)(email); case 5: _this.props.history.push({ pathname: '/check-recovery-link', state: { email: email } }); _context.next = 10; break; case 8: _context.prev = 8; _context.t0 = _context["catch"](2); case 10: case "end": return _context.stop(); } } }, _callee, this, [[2, 8]]); })); return function (_x) { return _ref.apply(this, arguments); }; }()); return _this; } (0, _createClass2.default)(ForgottenPassword, [{ key: "render", value: function render() { return React.createElement("div", { className: "jsx-".concat(style.__scopedHash) + " " + "ForgottenPassword" }, React.createElement(_CloseButton.default, null), React.createElement(_BackButton.default, { text: "Back", prevScreen: "kiwi-login" }), React.createElement("div", { className: "jsx-".concat(style.__scopedHash) + " " + "picture" }, React.createElement("img", { alt: "Help", src: image, className: "jsx-".concat(style.__scopedHash) })), React.createElement("div", { className: "jsx-".concat(style.__scopedHash) + " " + "main" }, React.createElement("p", { className: "jsx-".concat(style.__scopedHash) + " " + "title" }, React.createElement(_Text2.default, { t: "smartfaq.forgotten_password.title" })), React.createElement(_Text.default, { type: "secondary" }, React.createElement(_Text2.default, { t: "smartfaq.forgotten_password.subtitle" }))), React.createElement("form", { onSubmit: this.handleSubmitEmail, className: "jsx-".concat(style.__scopedHash) }, React.createElement("label", { htmlFor: "email", className: "jsx-".concat(style.__scopedHash) }, React.createElement(_Text.default, null, React.createElement(_Text2.default, { t: "smartfaq.forgotten_password.email_label" })), React.createElement("div", { className: "jsx-".concat(style.__scopedHash) + " " + "input" }, React.createElement(_Input.default, { type: "email", value: this.state.email, onChange: this.handleChangeEmail, placeholder: "e.g. your@email.com", required: true }))), React.createElement("button", { className: "jsx-".concat(style.__scopedHash) + " " + "send" }, React.createElement(_Text2.default, { t: "smartfaq.forgotten_password.send_button" }))), React.createElement(_style.default, { styleId: style.__scopedHash, css: style.__scoped })); } }]); return ForgottenPassword; }(React.Component); var _default = ForgottenPassword; exports.default = _default;