4
0
forked from crowetic/commerce

Add /checkout

This commit is contained in:
Luis Alvarez 2020-10-14 19:23:42 -05:00
parent b86ab71cef
commit ddf3a2a8b4
5 changed files with 16 additions and 6 deletions

View File

@ -129,7 +129,7 @@ const CartSidebarView: FC = () => {
<span>{total}</span> <span>{total}</span>
</div> </div>
</div> </div>
<Button width="100%" onClick={() => openCheckout()}> <Button href="/checkout" Component="a" width="100%">
Proceed to Checkout Proceed to Checkout
</Button> </Button>
</div> </div>

View File

@ -1,10 +1,9 @@
import cn from 'classnames'
import { NextSeo } from 'next-seo' import { NextSeo } from 'next-seo'
import { FC, useState } from 'react' import { FC, useState } from 'react'
import s from './ProductView.module.css' import s from './ProductView.module.css'
import { Colors } from '@components/ui/types' import { Colors } from '@components/ui/types'
import { useUI } from '@components/ui/context' import { useUI } from '@components/ui/context'
import { Button, Container, LoadingDots } from '@components/ui' import { Button, Container } from '@components/ui'
import { Swatch, ProductSlider } from '@components/product' import { Swatch, ProductSlider } from '@components/product'
import useAddItem from '@lib/bigcommerce/cart/use-add-item' import useAddItem from '@lib/bigcommerce/cart/use-add-item'
import type { Product } from '@lib/bigcommerce/api/operations/get-product' import type { Product } from '@lib/bigcommerce/api/operations/get-product'

View File

@ -9,6 +9,7 @@ import mergeRefs from 'react-merge-refs'
import { useButton } from 'react-aria' import { useButton } from 'react-aria'
import s from './Button.module.css' import s from './Button.module.css'
import { LoadingDots } from '@components/ui' import { LoadingDots } from '@components/ui'
export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> { export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
href?: string href?: string
className?: string className?: string
@ -25,7 +26,6 @@ const Button: React.FC<ButtonProps> = forwardRef((props, buttonRef) => {
className, className,
variant = 'filled', variant = 'filled',
children, children,
href,
active, active,
onClick, onClick,
disabled, disabled,
@ -57,7 +57,6 @@ const Button: React.FC<ButtonProps> = forwardRef((props, buttonRef) => {
return ( return (
<Component <Component
className={rootClassName} className={rootClassName}
href={href}
aria-pressed={active} aria-pressed={active}
data-variant={variant} data-variant={variant}
ref={mergeRefs([ref, buttonRef])} ref={mergeRefs([ref, buttonRef])}

View File

@ -5,6 +5,7 @@ import createApiHandler, {
import { BigcommerceApiError } from './utils/errors' import { BigcommerceApiError } from './utils/errors'
const METHODS = ['GET'] const METHODS = ['GET']
const fullCheckout = true
// TODO: a complete implementation should have schema validation for `req.body` // TODO: a complete implementation should have schema validation for `req.body`
const checkoutApi: BigcommerceApiHandler<any> = async (req, res, config) => { const checkoutApi: BigcommerceApiHandler<any> = async (req, res, config) => {
@ -24,6 +25,13 @@ const checkoutApi: BigcommerceApiHandler<any> = async (req, res, config) => {
method: 'POST', method: 'POST',
} }
) )
if (fullCheckout) {
res.redirect(data.checkout_url)
return
}
// TODO: make the embedded checkout work too!
const html = ` const html = `
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
@ -48,7 +56,7 @@ const checkoutApi: BigcommerceApiHandler<any> = async (req, res, config) => {
<div id="checkout"></div> <div id="checkout"></div>
</body> </body>
</html> </html>
` `
res.status(200) res.status(200)
res.setHeader('Content-Type', 'text/html') res.setHeader('Content-Type', 'text/html')

View File

@ -14,6 +14,10 @@ module.exports = {
source: '/search/:category', source: '/search/:category',
destination: '/search', destination: '/search',
}, },
{
source: '/checkout',
destination: '/api/bigcommerce/checkout',
},
] ]
}, },
} }