Monorepo with Turborepo (#651)

* Moved everything * Figuring out how to make imports work * Updated exports * Added missing exports * Added @vercel/commerce-local to `site` * Updated commerce config * Updated exports and commerce config * Updated commerce hoc * Fixed exports in local * Added publish config * Updated imports in site * It's actually working * Don't use debugger in dev for better speeds * Improved DX when editing packages * Set up eslint with husky * Updated prettier config * Added prettier setup to every package * Moved bigcommerce * Moved Bigcommerce to src and package updates * Updated setup of bigcommerce * Moved definitions script * Moved commercejs * Move to src * Fixed types in commercejs * Moved kibocommerce * Moved kibocommerce to src * Added package/tsconfig to kibocommerce * Fixed imports and other things * Moved ordercloud * Moved ordercloud to src * Fixed imports * Added missing prettier files * Moved Saleor * Moved Saleor to src * Fixed imports * Replaced all imports to @commerce * Added prettierignore/rc to all providers * Moved shopify to src * Build shopify in packages * Moved Spree * Moved spree to src * Updated spree * Moved swell * Moved swell to src * Fixed type imports in swell * Moved Vendure to packages * Moved vendure to src * Fixed imports in vendure * Added codegen to saleor * Updated codegen setup for shopify * Added codegen to vendure * Added codegen to kibocommerce * Added all packages to site's deps * Updated codegen setup in bigcommerce * Minor fixes * Updated providers' names in site * Updated packages based on Bel's changes * Updated turbo to latest * Fixed ts complains * Set npm engine in root * New lockfile install * remove engines * Regen lockfile * Switched from npm to yarn * Updated typesVersions in all packages * Moved dep * Updated SWR to the just released 1.2.0 * Removed "isolatedModules" from packages * Updated list of providers and default * Updated swell declaration * Removed next import from kibocommerce * Added COMMERCE_PROVIDER log * Added another log * Updated turbo config * Updated docs * Removed test logs Co-authored-by: Jared Palmer <jared@jaredpalmer.com>
2025-07-22 20:26:49 +00:00 · 2022-02-01 14:14:05 -05:00
parent d0ef346189
commit 0afe686fe9
1326 changed files with 9109 additions and 19494 deletions
--- a/site/components/checkout/CheckoutSidebarView/CheckoutSidebarView.tsx
+++ b/site/components/checkout/CheckoutSidebarView/CheckoutSidebarView.tsx
@@ -0,0 +1,122 @@
+import Link from 'next/link'
+import { FC, useState } from 'react'
+import CartItem from '@components/cart/CartItem'
+import { Button, Text } from '@components/ui'
+import { useUI } from '@components/ui/context'
+import SidebarLayout from '@components/common/SidebarLayout'
+import useCart from '@framework/cart/use-cart'
+import usePrice from '@framework/product/use-price'
+import useCheckout from '@framework/checkout/use-checkout'
+import ShippingWidget from '../ShippingWidget'
+import PaymentWidget from '../PaymentWidget'
+import s from './CheckoutSidebarView.module.css'
+import { useCheckoutContext } from '../context'
+
+const CheckoutSidebarView: FC = () => {
+  const [loadingSubmit, setLoadingSubmit] = useState(false)
+  const { setSidebarView, closeSidebar } = useUI()
+  const { data: cartData, mutate: refreshCart } = useCart()
+  const { data: checkoutData, submit: onCheckout } = useCheckout()
+  const { clearCheckoutFields } = useCheckoutContext()
+
+  async function handleSubmit(event: React.ChangeEvent<HTMLFormElement>) {
+    try {
+      setLoadingSubmit(true)
+      event.preventDefault()
+
+      await onCheckout()
+      clearCheckoutFields()
+      setLoadingSubmit(false)
+      refreshCart()
+      closeSidebar()
+    } catch {
+      // TODO - handle error UI here.
+      setLoadingSubmit(false)
+    }
+  }
+
+  const { price: subTotal } = usePrice(
+    cartData && {
+      amount: Number(cartData.subtotalPrice),
+      currencyCode: cartData.currency.code,
+    }
+  )
+  const { price: total } = usePrice(
+    cartData && {
+      amount: Number(cartData.totalPrice),
+      currencyCode: cartData.currency.code,
+    }
+  )
+
+  return (
+    <SidebarLayout
+      className={s.root}
+      handleBack={() => setSidebarView('CART_VIEW')}
+    >
+      <div className="px-4 sm:px-6 flex-1">
+        <Link href="/cart">
+          <a>
+            <Text variant="sectionHeading">Checkout</Text>
+          </a>
+        </Link>
+
+        <PaymentWidget
+          isValid={checkoutData?.hasPayment}
+          onClick={() => setSidebarView('PAYMENT_VIEW')}
+        />
+        <ShippingWidget
+          isValid={checkoutData?.hasShipping}
+          onClick={() => setSidebarView('SHIPPING_VIEW')}
+        />
+
+        <ul className={s.lineItemsList}>
+          {cartData!.lineItems.map((item: any) => (
+            <CartItem
+              key={item.id}
+              item={item}
+              currencyCode={cartData!.currency.code}
+              variant="display"
+            />
+          ))}
+        </ul>
+      </div>
+
+      <form
+        onSubmit={handleSubmit}
+        className="flex-shrink-0 px-6 py-6 sm:px-6 sticky z-20 bottom-0 w-full right-0 left-0 bg-accent-0 border-t text-sm"
+      >
+        <ul className="pb-2">
+          <li className="flex justify-between py-1">
+            <span>Subtotal</span>
+            <span>{subTotal}</span>
+          </li>
+          <li className="flex justify-between py-1">
+            <span>Taxes</span>
+            <span>Calculated at checkout</span>
+          </li>
+          <li className="flex justify-between py-1">
+            <span>Shipping</span>
+            <span className="font-bold tracking-wide">FREE</span>
+          </li>
+        </ul>
+        <div className="flex justify-between border-t border-accent-2 py-3 font-bold mb-2">
+          <span>Total</span>
+          <span>{total}</span>
+        </div>
+        <div>
+          {/* Once data is correctly filled */}
+          <Button
+            type="submit"
+            width="100%"
+            disabled={!checkoutData?.hasPayment || !checkoutData?.hasShipping}
+            loading={loadingSubmit}
+          >
+            Confirm Purchase
+          </Button>
+        </div>
+      </form>
+    </SidebarLayout>
+  )
+}
+
+export default CheckoutSidebarView