Commit 132f13f0 authored by Kyle Muldoon's avatar Kyle Muldoon

Done with ticket

parent 8dc817c7
...@@ -10,4 +10,4 @@ const sendUserOrder = (orderConfirmationResponse) => ({ ...@@ -10,4 +10,4 @@ const sendUserOrder = (orderConfirmationResponse) => ({
}) })
export const dispatchOrderInfo = (orderInfo) => dispatch => sendOrderPost(orderInfo) export const dispatchOrderInfo = (orderInfo) => dispatch => sendOrderPost(orderInfo)
.then( response => dispatch(sendUserOrder(response)) ) .then( response => dispatch(sendUserOrder(response.data)) )
...@@ -9,7 +9,7 @@ export default function PaymentMethod(props) { ...@@ -9,7 +9,7 @@ export default function PaymentMethod(props) {
</div> </div>
<div className="shippingInfoInput" id="cardNumberInput"> <div className="shippingInfoInput" id="cardNumberInput">
<input placeholder="Card Number*" <input placeholder={props.cardNumber}
type="text" type="text"
onChange={(e) => props.captureCardNumber(e.target.value)} onChange={(e) => props.captureCardNumber(e.target.value)}
className="input-text" className="input-text"
...@@ -17,7 +17,7 @@ export default function PaymentMethod(props) { ...@@ -17,7 +17,7 @@ export default function PaymentMethod(props) {
</div> </div>
<div className="shippingInfoInput" id="cardholderNameInput"> <div className="shippingInfoInput" id="cardholderNameInput">
<input placeholder="Cardholder Name*" <input placeholder={props.cardHolderName}
type="text" type="text"
onChange={(e) => props.captureCardHolderName(e.target.value)} onChange={(e) => props.captureCardHolderName(e.target.value)}
className="input-text" className="input-text"
...@@ -25,7 +25,7 @@ export default function PaymentMethod(props) { ...@@ -25,7 +25,7 @@ export default function PaymentMethod(props) {
</div> </div>
<div className="shippingInfoInput" id="expirationDateInput"> <div className="shippingInfoInput" id="expirationDateInput">
<input placeholder="Expiration Date [MM/YYYY]*" <input placeholder={props.expirationDate}
type="text" type="text"
onChange={(e) => props.captureExpirationDate(e.target.value)} onChange={(e) => props.captureExpirationDate(e.target.value)}
className="input-text" className="input-text"
...@@ -33,7 +33,7 @@ export default function PaymentMethod(props) { ...@@ -33,7 +33,7 @@ export default function PaymentMethod(props) {
</div> </div>
<div className="shippingInfoInput" id="cvvCodeInput"> <div className="shippingInfoInput" id="cvvCodeInput">
<input placeholder="CVV*" <input placeholder={props.cvv}
type="text" type="text"
onChange={(e) => props.captureCVV(e.target.value)} onChange={(e) => props.captureCVV(e.target.value)}
className="input-text" className="input-text"
......
...@@ -10,11 +10,14 @@ import './checkout.css' ...@@ -10,11 +10,14 @@ import './checkout.css'
import {dispatchOrderInfo} from './../../actions/checkout_actions' import {dispatchOrderInfo} from './../../actions/checkout_actions'
export default function Checkout() { export default function Checkout() {
///////////////////////
// REDUX Global State
///////////////////////
// const {currentUser} = useSelector(state => state)
// const {cart} = useSelector(state => state)
/////////////////////// ///////////////////////
// Shipping Info State // Shipping Info State
/////////////////////// ///////////////////////
...@@ -30,10 +33,10 @@ export default function Checkout() { ...@@ -30,10 +33,10 @@ export default function Checkout() {
/////////////////////// ///////////////////////
// Billing Info State // Billing Info State
/////////////////////// ///////////////////////
const [cardNumber, setCardNumber] = useState([]) const [cardNumber, setCardNumber] = useState(["123456789"])
const [cardHolderName, setCardHolderName] = useState([]) const [cardHolderName, setCardHolderName] = useState(["Jane Doe"])
const [expirationDate, setExpirationDate] = useState([]) const [expirationDate, setExpirationDate] = useState(["05/20206"])
const [cvv, setCVV] = useState([]) const [cvv, setCVV] = useState(["123"])
/////////////////////// ///////////////////////
...@@ -77,10 +80,10 @@ export default function Checkout() { ...@@ -77,10 +80,10 @@ export default function Checkout() {
city, city,
state, state,
zipCode, zipCode,
cardNumber, // cardNumber,
cardHolderName, // cardHolderName,
expirationDate, // expirationDate,
cvv // cvv
] ]
// initially validated, gets flipped if required field is empty // initially validated, gets flipped if required field is empty
...@@ -213,7 +216,11 @@ export default function Checkout() { ...@@ -213,7 +216,11 @@ export default function Checkout() {
/> />
{/* Collects User's payment info */} {/* Collects User's payment info */}
<PaymentMethod <PaymentMethod
cardNumber={cardNumber}
cardHolderName={cardHolderName}
expirationDate={expirationDate}
cvv={cvv}
captureCardNumber={setCardNumber} captureCardNumber={setCardNumber}
captureCardHolderName={setCardHolderName} captureCardHolderName={setCardHolderName}
captureExpirationDate={setExpirationDate} captureExpirationDate={setExpirationDate}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment