From 7af74ff8988961c988f03c95961b70c2918521ae Mon Sep 17 00:00:00 2001 From: Wes Bos Date: Fri, 25 Aug 2017 09:33:53 -0400 Subject: yay --- .next/dist/components/CreateItem.js | 35 +++++-- .next/dist/components/Header.js | 83 +++++++++++++++ .next/dist/components/Items.js | 58 ++++++----- .next/dist/components/LoginAuth0.js | 107 +++++++++++++++++++ .next/dist/components/Meta.js | 65 ++++++++++++ .next/dist/components/Nav.js | 53 ++++++++++ .next/dist/components/OrderList.js | 171 ++++++++++++++++++++++++++++++ .next/dist/components/Page.js | 72 +++++++++++++ .next/dist/components/Signup.js | 196 +++++++++++++++++++++++++++++++++++ .next/dist/components/TakeMyMoney.js | 54 ++++++---- 10 files changed, 834 insertions(+), 60 deletions(-) create mode 100644 .next/dist/components/Header.js create mode 100644 .next/dist/components/LoginAuth0.js create mode 100644 .next/dist/components/Meta.js create mode 100644 .next/dist/components/Nav.js create mode 100644 .next/dist/components/OrderList.js create mode 100644 .next/dist/components/Page.js create mode 100644 .next/dist/components/Signup.js (limited to '.next/dist/components') diff --git a/.next/dist/components/CreateItem.js b/.next/dist/components/CreateItem.js index 6364e83..7bfb3cb 100644 --- a/.next/dist/components/CreateItem.js +++ b/.next/dist/components/CreateItem.js @@ -64,6 +64,8 @@ var CreateLink = function (_Component) { description: '', title: '', image: '', + price: 0, + fullPrice: 0, loading: false }, _this.uploadFile = function () { var _ref2 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(e) { @@ -108,7 +110,7 @@ var CreateLink = function (_Component) { }; }(), _this._createLink = function () { var _ref3 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee2(e) { - var _this$state, description, title, image, res; + var _this$state, description, title, image, price, fullPrice, res; return _regenerator2.default.wrap(function _callee2$(_context2) { while (1) { @@ -116,7 +118,7 @@ var CreateLink = function (_Component) { case 0: e.preventDefault(); // pull the values from state - _this$state = _this.state, description = _this$state.description, title = _this$state.title, image = _this$state.image; + _this$state = _this.state, description = _this$state.description, title = _this$state.title, image = _this$state.image, price = _this$state.price, fullPrice = _this$state.fullPrice; // create a mutation // TODO: handle any errors // turn loading on @@ -128,6 +130,8 @@ var CreateLink = function (_Component) { variables: { description: description, title: title, + price: parseInt(price), + fullPrice: fullPrice, imageId: image } }); @@ -164,31 +168,42 @@ var CreateLink = function (_Component) { return _react2.default.createElement('div', { __source: { fileName: _jsxFileName, - lineNumber: 36 + lineNumber: 38 } }, this.state.loading ? 'LOADING...' : 'Ready!', _react2.default.createElement('form', { onSubmit: this._createLink, __source: { fileName: _jsxFileName, - lineNumber: 38 + lineNumber: 40 } }, _react2.default.createElement('p', { __source: { fileName: _jsxFileName, - lineNumber: 39 + lineNumber: 41 } }, 'Image', _react2.default.createElement('input', { onChange: this.uploadFile, type: 'file', __source: { fileName: _jsxFileName, - lineNumber: 41 + lineNumber: 43 } })), _react2.default.createElement('p', { __source: { fileName: _jsxFileName, - lineNumber: 43 + lineNumber: 45 } }, 'Title', _react2.default.createElement('input', { value: this.state.title, onChange: function onChange(e) { return _this3.setState({ title: e.target.value }); }, type: 'text', placeholder: 'A description for the link', __source: { fileName: _jsxFileName, - lineNumber: 44 + lineNumber: 46 + } + })), _react2.default.createElement('label', { + __source: { + fileName: _jsxFileName, + lineNumber: 48 + } + }, 'Price', _react2.default.createElement('input', { type: 'number', min: '0', value: this.state.price, onChange: function onChange(e) { + return _this3.setState({ price: e.target.value }); + }, __source: { + fileName: _jsxFileName, + lineNumber: 48 } })), _react2.default.createElement('textarea', { value: this.state.description, @@ -199,11 +214,11 @@ var CreateLink = function (_Component) { placeholder: 'The desc for this item', __source: { fileName: _jsxFileName, - lineNumber: 46 + lineNumber: 49 } }), _react2.default.createElement('button', { type: 'submit', __source: { fileName: _jsxFileName, - lineNumber: 52 + lineNumber: 55 } }, 'Submit'))); } diff --git a/.next/dist/components/Header.js b/.next/dist/components/Header.js new file mode 100644 index 0000000..8ec788f --- /dev/null +++ b/.next/dist/components/Header.js @@ -0,0 +1,83 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); + +var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); + +var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); + +var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); + +var _createClass2 = require('babel-runtime/helpers/createClass'); + +var _createClass3 = _interopRequireDefault(_createClass2); + +var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); + +var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); + +var _inherits2 = require('babel-runtime/helpers/inherits'); + +var _inherits3 = _interopRequireDefault(_inherits2); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _reactApollo = require('react-apollo'); + +var _queries = require('../queries'); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/Header.js'; + + +var Header = function (_Component) { + (0, _inherits3.default)(Header, _Component); + + function Header() { + (0, _classCallCheck3.default)(this, Header); + + return (0, _possibleConstructorReturn3.default)(this, (Header.__proto__ || (0, _getPrototypeOf2.default)(Header)).apply(this, arguments)); + } + + (0, _createClass3.default)(Header, [{ + key: 'componentDidMount', + value: function componentDidMount() { + // This fetches the new data, but doesn't populate the user via props + // this.props.currentUserQuery.refetch(); + // This fetches the new data, and populates the user via props + setTimeout(this.props.currentUserQuery.refetch, 1); + } + }, { + key: 'render', + value: function render() { + console.log(this.props.currentUserQuery.user); + var user = this.props.currentUserQuery.user || {}; + var _user$email = user.email, + email = _user$email === undefined ? '' : _user$email; + + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 20 + } + }, _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 21 + } + }, email, ' I\'m the header!')); + } + }]); + + return Header; +}(_react.Component); + +var userEnhancer = (0, _reactApollo.graphql)(_queries.CURRENT_USER_QUERY, { name: 'currentUserQuery' }); +exports.default = (0, _reactApollo.compose)(userEnhancer)(Header); \ No newline at end of file diff --git a/.next/dist/components/Items.js b/.next/dist/components/Items.js index 138963b..d0eae85 100644 --- a/.next/dist/components/Items.js +++ b/.next/dist/components/Items.js @@ -54,16 +54,26 @@ var _formatMoney = require('../lib/formatMoney'); var _formatMoney2 = _interopRequireDefault(_formatMoney); +var _image = require('../lib/image'); + +var _image2 = _interopRequireDefault(_image); + var _queries = require('../queries'); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/Items.js'; -var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n font-size: 50px;\n'], ['\n font-size: 50px;\n']); +var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n font-size: 50px;\n'], ['\n font-size: 50px;\n']), + _templateObject2 = (0, _taggedTemplateLiteral3.default)(['\n display: grid;\n grid-template-columns: repeat(4, calc(25% - 20px));\n grid-gap: 20px;\n'], ['\n display: grid;\n grid-template-columns: repeat(4, calc(25% - 20px));\n grid-gap: 20px;\n']), + _templateObject3 = (0, _taggedTemplateLiteral3.default)(['\n background: #f3f3f3;\n padding: 20px;\n img {\n width: 100%;\n }\n'], ['\n background: #f3f3f3;\n padding: 20px;\n img {\n width: 100%;\n }\n']); var Title = _styledComponents2.default.h1(_templateObject); +var Items = _styledComponents2.default.div(_templateObject2); + +var Item = _styledComponents2.default.div(_templateObject3); + var ItemList = function (_Component) { (0, _inherits3.default)(ItemList, _Component); @@ -83,7 +93,7 @@ var ItemList = function (_Component) { return _react2.default.createElement('div', { __source: { fileName: _jsxFileName, - lineNumber: 21 + lineNumber: 38 } }, 'Loading'); } @@ -94,7 +104,7 @@ var ItemList = function (_Component) { return _react2.default.createElement('div', { __source: { fileName: _jsxFileName, - lineNumber: 27 + lineNumber: 44 } }, 'Error'); } @@ -102,75 +112,67 @@ var ItemList = function (_Component) { // 3 var itemsToRender = this.props.allLinksQuery.allItems; - return _react2.default.createElement('div', { + return _react2.default.createElement(Items, { __source: { fileName: _jsxFileName, - lineNumber: 34 + lineNumber: 51 } }, _react2.default.createElement(Title, { __source: { fileName: _jsxFileName, - lineNumber: 35 + lineNumber: 52 } }, 'Items For Sale'), itemsToRender.map(function (item, i) { - return _react2.default.createElement('div', { className: 'item', key: i, __source: { + return _react2.default.createElement(Item, { className: 'item', key: i, __source: { fileName: _jsxFileName, - lineNumber: 37 + lineNumber: 54 } - }, _react2.default.createElement('hr', { - __source: { + }, item.image ? _react2.default.createElement('img', { src: (0, _image2.default)(item.image), __source: { fileName: _jsxFileName, - lineNumber: 38 - } - }), item.image ? _react2.default.createElement('img', { src: 'https://images.graph.cool/v1/cj5xz8szs28930145gct82bdj/' + item.image.secret + '/300x300', __source: { - fileName: _jsxFileName, - lineNumber: 39 + lineNumber: 55 } }) : null, _react2.default.createElement('h3', { __source: { fileName: _jsxFileName, - lineNumber: 40 + lineNumber: 56 } }, item.title), _react2.default.createElement('p', { __source: { fileName: _jsxFileName, - lineNumber: 41 + lineNumber: 57 } }, item.description), _react2.default.createElement(_link2.default, { href: { pathname: '/admin/update', query: { id: item.id } }, __source: { fileName: _jsxFileName, - lineNumber: 42 + lineNumber: 58 } }, _react2.default.createElement('a', { __source: { fileName: _jsxFileName, - lineNumber: 46 + lineNumber: 62 } }, 'Edit ', item.id)), _react2.default.createElement(_TakeMyMoney2.default, { + id: item.id, amount: item.price, name: item.title // the pop-in header title , description: item.description // the pop-in header subtitle - , image: 'https://images.graph.cool/v1/cj5xz8szs28930145gct82bdj/' + item.image.secret + '/300x300', + , image: (0, _image2.default)(item.image), __source: { fileName: _jsxFileName, - lineNumber: 49 + lineNumber: 65 } }, _react2.default.createElement('button', { __source: { fileName: _jsxFileName, - lineNumber: 55 - } - }, 'Buy for ', (0, _formatMoney2.default)(item.price))), _react2.default.createElement(_UpdateItem2.default, { id: item.id, __source: { - fileName: _jsxFileName, - lineNumber: 58 + lineNumber: 72 } - }), _react2.default.createElement('button', { onClick: function onClick() { + }, 'Buy for ', (0, _formatMoney2.default)(item.price))), _react2.default.createElement('button', { onClick: function onClick() { return _this2.props.removeItemMutation({ variables: { id: item.id } }); }, __source: { fileName: _jsxFileName, - lineNumber: 60 + lineNumber: 74 } }, '\xD7 Delete item')); })); diff --git a/.next/dist/components/LoginAuth0.js b/.next/dist/components/LoginAuth0.js new file mode 100644 index 0000000..c477dc5 --- /dev/null +++ b/.next/dist/components/LoginAuth0.js @@ -0,0 +1,107 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); + +var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); + +var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); + +var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); + +var _createClass2 = require('babel-runtime/helpers/createClass'); + +var _createClass3 = _interopRequireDefault(_createClass2); + +var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); + +var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); + +var _inherits2 = require('babel-runtime/helpers/inherits'); + +var _inherits3 = _interopRequireDefault(_inherits2); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _auth0Lock = require('auth0-lock'); + +var _auth0Lock2 = _interopRequireDefault(_auth0Lock); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/LoginAuth0.js'; + + +var LoginAuth0 = function (_Component) { + (0, _inherits3.default)(LoginAuth0, _Component); + + function LoginAuth0(props) { + (0, _classCallCheck3.default)(this, LoginAuth0); + + var _this = (0, _possibleConstructorReturn3.default)(this, (LoginAuth0.__proto__ || (0, _getPrototypeOf2.default)(LoginAuth0)).call(this, props)); + + _this.createUser = function () { + var variables = { + idToken: window.localStorage.getItem("auth0IdToken"), + emailAddress: 'wesbos@gmail.com', + name: 'Hardcoded Wes' + }; + // TODO - make a createUser function + _this.props.createUser({ variables: variables }).then(function (response) { + _this.props.history.replace("/"); + }).catch(function (e) { + console.error(e); + _this.props.history.replace("/"); + }); + }; + + _this._showLogin = function () { + _this._lock.show(); + }; + + if (typeof window === 'undefined') return (0, _possibleConstructorReturn3.default)(_this); + var redirectUrl = 'http://localhost:3000/signup'; + console.log(redirectUrl); + _this._lock = new _auth0Lock2.default('l851ev2q8X48wf56eGLjIWFbMwwbvWPE', 'wesbos.auth0.com', { + auth: { + redirect: false + } + }); + return _this; + } + + (0, _createClass3.default)(LoginAuth0, [{ + key: 'componentDidMount', + value: function componentDidMount() { + console.log('MOUNT'); + this._lock.on('authenticated', function (authResult) { + console.log('HIIIIIIII'); + window.localStorage.setItem('auth0IdToken', authResult.idToken); + console.log('Done!', authResult); + }); + } + }, { + key: 'render', + value: function render() { + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 51 + } + }, _react2.default.createElement('button', { onClick: this._showLogin, __source: { + fileName: _jsxFileName, + lineNumber: 52 + } + }, 'Log in with Auth0 ')); + } + }]); + + return LoginAuth0; +}(_react.Component); + +exports.default = LoginAuth0; \ No newline at end of file diff --git a/.next/dist/components/Meta.js b/.next/dist/components/Meta.js new file mode 100644 index 0000000..ba73a5b --- /dev/null +++ b/.next/dist/components/Meta.js @@ -0,0 +1,65 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _head = require('next/dist/lib/head.js'); + +var _head2 = _interopRequireDefault(_head); + +var _index = require('next/dist/lib/router/index.js'); + +var _index2 = _interopRequireDefault(_index); + +var _Nav = require('./Nav'); + +var _Nav2 = _interopRequireDefault(_Nav); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/Meta.js'; + +exports.default = function () { + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 6 + } + }, _react2.default.createElement(_head2.default, { + __source: { + fileName: _jsxFileName, + lineNumber: 7 + } + }, _react2.default.createElement('meta', { name: 'viewport', content: 'width=device-width, initial-scale=1', __source: { + fileName: _jsxFileName, + lineNumber: 8 + } + }), _react2.default.createElement('meta', { charSet: 'utf-8', __source: { + fileName: _jsxFileName, + lineNumber: 9 + } + }), _react2.default.createElement(_Nav2.default, { + __source: { + fileName: _jsxFileName, + lineNumber: 10 + } + }), _react2.default.createElement('link', { rel: 'shortcut icon', href: 'https://wesbos.com/wp-content/themes/wb2014/i/crown-yellow-small.png', __source: { + fileName: _jsxFileName, + lineNumber: 11 + } + }), _react2.default.createElement('link', { rel: 'stylesheet', href: 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', __source: { + fileName: _jsxFileName, + lineNumber: 12 + } + }), _react2.default.createElement('title', { + __source: { + fileName: _jsxFileName, + lineNumber: 13 + } + }, 'Sick Fits'))); +}; \ No newline at end of file diff --git a/.next/dist/components/Nav.js b/.next/dist/components/Nav.js new file mode 100644 index 0000000..03b3a61 --- /dev/null +++ b/.next/dist/components/Nav.js @@ -0,0 +1,53 @@ +"use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _react = require("react"); + +var _react2 = _interopRequireDefault(_react); + +var _link = require("next/dist/lib/link.js"); + +var _link2 = _interopRequireDefault(_link); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = "/Users/wesbos/Sites/advanced-react/examples/next/components/Nav.js"; + +exports.default = function () { + return _react2.default.createElement("ul", { + __source: { + fileName: _jsxFileName, + lineNumber: 4 + } + }, _react2.default.createElement(_link2.default, { href: "/", __source: { + fileName: _jsxFileName, + lineNumber: 5 + } + }, _react2.default.createElement("a", { + __source: { + fileName: _jsxFileName, + lineNumber: 5 + } + }, "Home")), _react2.default.createElement(_link2.default, { href: "/signup/", __source: { + fileName: _jsxFileName, + lineNumber: 6 + } + }, _react2.default.createElement("a", { + __source: { + fileName: _jsxFileName, + lineNumber: 6 + } + }, "Signup")), _react2.default.createElement(_link2.default, { href: "/orders/", __source: { + fileName: _jsxFileName, + lineNumber: 7 + } + }, _react2.default.createElement("a", { + __source: { + fileName: _jsxFileName, + lineNumber: 7 + } + }, "Orders"))); +}; \ No newline at end of file diff --git a/.next/dist/components/OrderList.js b/.next/dist/components/OrderList.js new file mode 100644 index 0000000..d4871d1 --- /dev/null +++ b/.next/dist/components/OrderList.js @@ -0,0 +1,171 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); + +var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); + +var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); + +var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); + +var _createClass2 = require('babel-runtime/helpers/createClass'); + +var _createClass3 = _interopRequireDefault(_createClass2); + +var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); + +var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); + +var _inherits2 = require('babel-runtime/helpers/inherits'); + +var _inherits3 = _interopRequireDefault(_inherits2); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _withData = require('../lib/withData'); + +var _withData2 = _interopRequireDefault(_withData); + +var _Items = require('../components/Items'); + +var _Items2 = _interopRequireDefault(_Items); + +var _CreateItem = require('../components/CreateItem'); + +var _CreateItem2 = _interopRequireDefault(_CreateItem); + +var _Signup = require('../components/Signup'); + +var _Signup2 = _interopRequireDefault(_Signup); + +var _LoginAuth = require('../components/LoginAuth0'); + +var _LoginAuth2 = _interopRequireDefault(_LoginAuth); + +var _Page = require('../components/Page'); + +var _Page2 = _interopRequireDefault(_Page); + +var _queries = require('../queries'); + +var _reactApollo = require('react-apollo'); + +var _lodash = require('lodash.has'); + +var _lodash2 = _interopRequireDefault(_lodash); + +var _lodash3 = require('lodash.get'); + +var _lodash4 = _interopRequireDefault(_lodash3); + +var _formatMoney = require('../lib/formatMoney'); + +var _formatMoney2 = _interopRequireDefault(_formatMoney); + +var _image = require('../lib/image'); + +var _image2 = _interopRequireDefault(_image); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/OrderList.js'; + + +var OrderList = function (_Component) { + (0, _inherits3.default)(OrderList, _Component); + + function OrderList() { + (0, _classCallCheck3.default)(this, OrderList); + + return (0, _possibleConstructorReturn3.default)(this, (OrderList.__proto__ || (0, _getPrototypeOf2.default)(OrderList)).apply(this, arguments)); + } + + (0, _createClass3.default)(OrderList, [{ + key: 'componentDidMount', + value: function componentDidMount() { + console.log('Mounting!'); + } + }, { + key: 'render', + value: function render() { + + if (this.props.loading) { + return _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 22 + } + }, 'Loading...'); + } + + if (this.props.error) { + return _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 26 + } + }, 'Error...'); + } + + if (!(0, _lodash2.default)(this.props, 'userOrdersQuery.user.orders')) { + return _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 30 + } + }, 'Don\'t have it yet!'); + } + + var orders = this.props.userOrdersQuery.user.orders; + + console.log(orders); + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 37 + } + }, _react2.default.createElement('h2', { + __source: { + fileName: _jsxFileName, + lineNumber: 38 + } + }, 'You have ', orders.length, ' Orders'), _react2.default.createElement('ul', { + __source: { + fileName: _jsxFileName, + lineNumber: 39 + } + }, orders.map(function (order) { + return _react2.default.createElement('li', { key: order.id, __source: { + fileName: _jsxFileName, + lineNumber: 40 + } + }, _react2.default.createElement('img', { src: (0, _image2.default)(order.item.image), alt: '', __source: { + fileName: _jsxFileName, + lineNumber: 41 + } + }), _react2.default.createElement('h3', { + __source: { + fileName: _jsxFileName, + lineNumber: 42 + } + }, order.item.title, ' (', (0, _formatMoney2.default)(order.amount), ') '), _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 43 + } + }, order.item.description)); + }))); + } + }]); + + return OrderList; +}(_react.Component); + +var ordersEnhancer = (0, _reactApollo.graphql)(_queries.USER_ORDERS_QUERY, { name: 'userOrdersQuery' }); +exports.default = (0, _reactApollo.compose)(ordersEnhancer)(OrderList); \ No newline at end of file diff --git a/.next/dist/components/Page.js b/.next/dist/components/Page.js new file mode 100644 index 0000000..0a747a4 --- /dev/null +++ b/.next/dist/components/Page.js @@ -0,0 +1,72 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _taggedTemplateLiteral2 = require('babel-runtime/helpers/taggedTemplateLiteral'); + +var _taggedTemplateLiteral3 = _interopRequireDefault(_taggedTemplateLiteral2); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _Header = require('./Header'); + +var _Header2 = _interopRequireDefault(_Header); + +var _Meta = require('./Meta'); + +var _Meta2 = _interopRequireDefault(_Meta); + +var _withData = require('../lib/withData'); + +var _withData2 = _interopRequireDefault(_withData); + +var _Nav = require('./Nav'); + +var _Nav2 = _interopRequireDefault(_Nav); + +var _styledComponents = require('styled-components'); + +var _styledComponents2 = _interopRequireDefault(_styledComponents); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/Page.js'; + +var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n font-family: sans-serif;\n color: #303030;\n background: #efc600;\n padding: 100px;\n'], ['\n font-family: sans-serif;\n color: #303030;\n background: #efc600;\n padding: 100px;\n']); + +var StyledPage = _styledComponents2.default.div(_templateObject); + +var Page = function Page(_ref) { + var children = _ref.children; + return _react2.default.createElement(StyledPage, { className: 'main', __source: { + fileName: _jsxFileName, + lineNumber: 15 + } + }, _react2.default.createElement(_Meta2.default, { + __source: { + fileName: _jsxFileName, + lineNumber: 16 + } + }), _react2.default.createElement(_Header2.default, { + __source: { + fileName: _jsxFileName, + lineNumber: 17 + } + }), _react2.default.createElement(_Nav2.default, { + __source: { + fileName: _jsxFileName, + lineNumber: 18 + } + }), _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 19 + } + }, children)); +}; + +exports.default = (0, _withData2.default)(Page); \ No newline at end of file diff --git a/.next/dist/components/Signup.js b/.next/dist/components/Signup.js new file mode 100644 index 0000000..8330a5f --- /dev/null +++ b/.next/dist/components/Signup.js @@ -0,0 +1,196 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _regenerator = require('babel-runtime/regenerator'); + +var _regenerator2 = _interopRequireDefault(_regenerator); + +var _asyncToGenerator2 = require('babel-runtime/helpers/asyncToGenerator'); + +var _asyncToGenerator3 = _interopRequireDefault(_asyncToGenerator2); + +var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); + +var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); + +var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); + +var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); + +var _createClass2 = require('babel-runtime/helpers/createClass'); + +var _createClass3 = _interopRequireDefault(_createClass2); + +var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); + +var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); + +var _inherits2 = require('babel-runtime/helpers/inherits'); + +var _inherits3 = _interopRequireDefault(_inherits2); + +var _react = require('react'); + +var _react2 = _interopRequireDefault(_react); + +var _reactApollo = require('react-apollo'); + +var _queries = require('../queries'); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +var _jsxFileName = '/Users/wesbos/Sites/advanced-react/examples/next/components/Signup.js'; + + +var Signup = function (_Component) { + (0, _inherits3.default)(Signup, _Component); + + function Signup() { + (0, _classCallCheck3.default)(this, Signup); + + var _this = (0, _possibleConstructorReturn3.default)(this, (Signup.__proto__ || (0, _getPrototypeOf2.default)(Signup)).call(this)); + + _initialiseProps.call(_this); + + var idToken = typeof window !== 'undefined' ? localStorage.getItem('auth0IdToken') || '' : ''; + _this.state = { + email: '', + name: '', + idToken: idToken, + error: undefined + }; + + return _this; + } + + (0, _createClass3.default)(Signup, [{ + key: 'render', + value: function render() { + var _this2 = this; + + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 22 + } + }, this.state.loading ? 'LOADING...' : 'Ready!', this.state.error ? _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 25 + } + }, this.state.error.message) : '', _react2.default.createElement('form', { onSubmit: this._createUser, __source: { + fileName: _jsxFileName, + lineNumber: 27 + } + }, _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 28 + } + }, 'Email', _react2.default.createElement('input', { value: this.state.email, onChange: function onChange(e) { + return _this2.setState({ email: e.target.value }); + }, type: 'text', placeholder: 'email', __source: { + fileName: _jsxFileName, + lineNumber: 29 + } + })), _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 32 + } + }, 'Name', _react2.default.createElement('input', { value: this.state.name, onChange: function onChange(e) { + return _this2.setState({ name: e.target.value }); + }, type: 'text', placeholder: 'name', __source: { + fileName: _jsxFileName, + lineNumber: 33 + } + })), _react2.default.createElement('p', { + __source: { + fileName: _jsxFileName, + lineNumber: 36 + } + }, 'idToken', _react2.default.createElement('input', { disabled: true, value: this.state.idToken, onChange: function onChange(e) { + return _this2.setState({ idToken: e.target.value }); + }, type: 'text', placeholder: 'name', __source: { + fileName: _jsxFileName, + lineNumber: 37 + } + })), _react2.default.createElement('button', { type: 'submit', __source: { + fileName: _jsxFileName, + lineNumber: 40 + } + }, 'Submit'))); + } + }]); + + return Signup; +}(_react.Component); +// When we submit this mutation, we need to update our store - we have a few ways to do that: +// One - we can go nucular and run refetchQueries() which will just go get everything - this is easy, but at the cost of efficiency. + + +var _initialiseProps = function _initialiseProps() { + var _this3 = this; + + this._createUser = function () { + var _ref = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(e) { + var _state, email, name, idToken, res; + + return _regenerator2.default.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + e.preventDefault(); + // pull the values from state + _state = _this3.state, email = _state.email, name = _state.name, idToken = _state.idToken; + // create a mutation + // TODO: handle any errors + // turn loading on + + _this3.setState({ loading: true }); + console.log(name, email, idToken); + _context.prev = 4; + _context.next = 7; + return _this3.props.createUserMutation({ + // pass in those variables from state + variables: { name: name, email: email, idToken: idToken } + }); + + case 7: + res = _context.sent; + _context.next = 14; + break; + + case 10: + _context.prev = 10; + _context.t0 = _context['catch'](4); + + _this3.setState({ error: _context.t0 }); + console.dir(_context.t0); + + case 14: + _this3.setState({ loading: false }); + + case 15: + case 'end': + return _context.stop(); + } + } + }, _callee, _this3, [[4, 10]]); + })); + + return function (_x) { + return _ref.apply(this, arguments); + }; + }(); +}; + +exports.default = (0, _reactApollo.graphql)(_queries.CREATE_USER_MUTATION, { name: 'createUserMutation', options: { + // Easy, but slow + // refetchQueries: ['AllLinksQuery'] + // This is much Better / efficient + // Notice how the variable is called createItem - that is because createItem is the name of the query! + } })(Signup); \ No newline at end of file diff --git a/.next/dist/components/TakeMyMoney.js b/.next/dist/components/TakeMyMoney.js index b2455be..fa2de35 100644 --- a/.next/dist/components/TakeMyMoney.js +++ b/.next/dist/components/TakeMyMoney.js @@ -4,10 +4,6 @@ Object.defineProperty(exports, "__esModule", { value: true }); -var _extends2 = require('babel-runtime/helpers/extends'); - -var _extends3 = _interopRequireDefault(_extends2); - var _regenerator = require('babel-runtime/regenerator'); var _regenerator2 = _interopRequireDefault(_regenerator); @@ -70,24 +66,28 @@ var TakeMyMoney = function (_Component) { return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = TakeMyMoney.__proto__ || (0, _getPrototypeOf2.default)(TakeMyMoney)).call.apply(_ref, [this].concat(args))), _this), _this.onToken = function () { var _ref2 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(res) { - var token, charge; + var token, userId, itemId, charge; return _regenerator2.default.wrap(function _callee$(_context) { while (1) { switch (_context.prev = _context.next) { case 0: token = res.id; + userId = _this.props.currentUserQuery.user.id; + itemId = _this.props.id; console.log('Going to make a purchase with ' + token); - _context.next = 4; - return _this.props.createOrder({ variables: { token: token } }); + console.log('THe person that bought this was ' + userId); + console.log('The item id is ' + itemId); + _context.next = 8; + return _this.props.createOrder({ variables: { token: token, userId: userId, itemId: itemId } }); - case 4: + case 8: charge = _context.sent; alert('Back from the charge! ' + charge.id); console.log(charge); - case 7: + case 11: case 'end': return _context.stop(); } @@ -104,22 +104,32 @@ var TakeMyMoney = function (_Component) { (0, _createClass3.default)(TakeMyMoney, [{ key: 'render', value: function render() { - return ( - // ... - _react2.default.createElement(_reactStripeCheckout2.default, (0, _extends3.default)({}, this.props, { - token: this.onToken, - stripeKey: 'pk_lclTtThFp8CnO3QtEZSd8HA9mFUps', - currency: 'USD', - __source: { - fileName: _jsxFileName, - lineNumber: 19 - } - }), this.props.children) - ); + var user = this.props.currentUserQuery.user || {}; + var email = user.email || ''; + return _react2.default.createElement('div', { + __source: { + fileName: _jsxFileName, + lineNumber: 24 + } + }, _react2.default.createElement(_reactStripeCheckout2.default, { + amount: this.props.amount, + name: this.props.name, + description: this.props.description, + token: this.onToken, + stripeKey: 'pk_lclTtThFp8CnO3QtEZSd8HA9mFUps', + currency: 'USD', + email: email, + __source: { + fileName: _jsxFileName, + lineNumber: 25 + } + }, this.props.children)); } }]); return TakeMyMoney; }(_react.Component); -exports.default = (0, _reactApollo.graphql)(_queries.CREATE_ORDER_MUTATION, { name: 'createOrder' })(TakeMyMoney); \ No newline at end of file +var userEnhancer = (0, _reactApollo.graphql)(_queries.CURRENT_USER_QUERY, { name: 'currentUserQuery' }); +var createOrderEnhancer = (0, _reactApollo.graphql)(_queries.CREATE_ORDER_MUTATION, { name: 'createOrder' }); +exports.default = (0, _reactApollo.compose)(userEnhancer, createOrderEnhancer)(TakeMyMoney); \ No newline at end of file -- cgit v1.3