flayks/housesof
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

🚧 Switch to swell-js to handle Shop cart

Browse Source 
swell-node was relying too much on Node packages like crypto or events to be used with Cloudflare Pages or Vercel Edge Functions
This commit is contained in:
Félix Péault
2022-09-18 12:11:44 +02:00
parent b3fdc5cea5
commit b66db25942
12 changed files with 210 additions and 351 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/utils/functions/shop.ts
View File

@@ -1,34 +1,99 @@
import swell from 'swell-js'
import { addNotification } from '$utils/functions/notifications'
import { cartData } from '$utils/stores/shop'
import { PUBLIC_SWELL_STORE_ID, PUBLIC_SWELL_API_PUBLIC_TOKEN } from '$env/static/public'
// Init Swell
export const initSwell = () => {
swell.init(PUBLIC_SWELL_STORE_ID, PUBLIC_SWELL_API_PUBLIC_TOKEN)
}
/**
* Get current cart
*/
export const getCart = async () => {
const cart = await swell.cart.get()
if (cart) {
return cart
}
}
/**
* Add a product to a cart
*/
export const addToCart = async (cartId: string, product: any, quantity: number = 1) => {
if (cartId && cartId !== 'null') {
const updatedCart = await fetch('/api/swell', {
method: 'POST',
body: JSON.stringify({
action: 'addToCart',
cartId,
productId: product.id,
quantity,
})
export const addToCart = async (product: any, quantity: number = 1) => {
const updatedCart = await swell.cart.addItem({
product_id: product.id,
quantity,
})
if (updatedCart) {
// Update cart data
cartData.set(updatedCart)
// Show notification
addNotification({
title: 'Added to cart',
name: `${product.name} - x1`,
image: product.images[0].file.url,
})
}
}
if (updatedCart.ok) {
const newCart = await updatedCart.json()
cartData.set(newCart)
/**
* Update Cart item
*/
export const updateCartItem = async (productId: string, quantity: number) => {
const updatedCart = await swell.cart.updateItem(productId, {
quantity,
})
// Show notification
addNotification({
title: 'Added to cart',
name: `${product.name} - x1`,
image: product.images[0].file.url,
})
}
} else {
console.log('No active cart')
if (updatedCart) {
return updatedCart
}
}
/**
* Remove Cart item
*/
export const removeCartItem = async (productId: string) => {
const updatedCart = await swell.cart.removeItem(productId)
if (updatedCart) {
return updatedCart
}
}
/**
* Fetch products
*/
export const getProducts = async (category?: string, limit: number = 25, page: number = 1) => {
const products = await swell.products.list({
where: {
active: true,
},
category,
limit,
page
})
if (products) {
return products
}
}
/**
* Retrieve a product
*/
export const getProduct = async (id: string) => {
const product = await swell.products.get(id)
if (product) {
return product
}
}

157
src/utils/functions/swell.ts
View File

@@ -1,157 +0,0 @@
import swell from 'swell-node'
import { SWELL_API_TOKEN, SWELL_STORE_ID } from '$env/static/private'
// Init Swell
swell.init(SWELL_STORE_ID, SWELL_API_TOKEN)
/**
* Fetch products
*/
export const getProducts = async (category?: string, limit: number = 25, page: number = 1) => {
const products = await swell.get('/products', {
where: {
active: true,
},
category,
limit,
page
})
if (products) {
return products
}
}
/**
* Retrieve a product
*/
export const getProduct = async (id: string) => {
const product = await swell.get('/products/{id}', {
id
})
if (product) {
return product
}
}
/**
* Create a cart
*/
export const createCart = async () => {
const cart = await swell.post('/carts')
if (cart) {
return cart
}
}
/**
* Retrieve cart
*/
export const fetchCart = async (id: string) => {
const cart = await swell.get('/carts/{id}', {
id,
expand: [
'items.product',
'items.variant',
]
})
if (cart) {
return cart
}
}
/**
* Add product to cart
*/
export const addToCart = async (cartId: string, productId: string, quantity: number) => {
// Fetch current cart data
const currentCart = await fetchCart(cartId)
// Updated cart with new items
const updatedCart = await swell.put('/carts/{id}', {
id: cartId,
items: [
...currentCart.items || [],
{
product_id: productId,
quantity,
}
],
})
if (updatedCart) {
// Fetch latest cart with updates
const cart = await fetchCart(cartId)
if (cart) {
return cart
}
}
}
/**
* Update cart item
*/
export const updateCartItem = async (cartId: string, productId: string, quantity: number) => {
// Fetch current cart data
const currentCart = await fetchCart(cartId)
// Updated items with replacing new item quantity
const updatedCartItems = currentCart.items.map((item: any) => {
// Replace item quantity with selected one
if (item.id === productId) {
item.quantity = quantity
}
return item
})
const updatedCart = await swell.put('/carts/{id}', {
id: cartId,
$set: {
items: updatedCartItems,
}
})
if (updatedCart) {
// Fetch latest cart with updates
const cart = await fetchCart(cartId)
if (cart) {
return cart
}
}
}
/**
* Remove cart item
*/
export const removeCartItem = async (cartId: string, productId: string) => {
// Fetch current cart data
const currentCart = await fetchCart(cartId)
// Updated items and remove selected item
const updatedCartItems = [...currentCart.items.filter((item: any) => {
return item.id !== productId
})]
const updatedCart = await swell.put('/carts/{id}', {
id: cartId,
$set: {
items: updatedCartItems,
}
})
if (updatedCart) {
// Fetch latest cart with updates
const cart = await fetchCart(cartId)
if (cart) {
return cart
}
}
}

22
src/utils/stores/shop.ts
View File

@@ -6,6 +6,9 @@ import { writable, derived, type Writable, type Readable } from 'svelte/store'
*/
export const shopCurrentProductSlug: Writable<string> = writable(null)
/** Notifications */
export const cartNotifications: Writable<any[]> = writable([])
/**
* Cart
@@ -13,17 +16,6 @@ export const shopCurrentProductSlug: Writable<string> = writable(null)
/** Cart open state */
export const cartOpen: Writable<boolean> = writable(false)
/** Cart open state */
export const cartId: Writable<string> = writable(null)
// Write to localStorage when changing cartId
if (typeof localStorage !== 'undefined') {
const id = localStorage.getItem('cartId')
id && cartId.set(id ? id : null)
cartId.subscribe(value => localStorage.setItem('cartId', value))
}
/** Raw Cart data */
export const cartData: Writable<any> = writable(null)
@@ -33,10 +25,4 @@ export const cartIsUpdating: Writable<boolean> = writable(false)
/** Amount of products present in cart */
export const cartAmount: Readable<number> = derived(cartData, ($cart) => {
return $cart && $cart.item_quantity > 0 ? $cart.item_quantity : 0
})
/**
* Notifications
*/
export const cartNotifications: Writable<any[]> = writable([])
})