[ci] format
This commit is contained in:
parent
faf3f3a8d1
commit
c8ca528bba
4 changed files with 8 additions and 13 deletions
|
@ -7,7 +7,7 @@ export type CartItem = {
|
||||||
name: string;
|
name: string;
|
||||||
imageSrc: string;
|
imageSrc: string;
|
||||||
quantity: number;
|
quantity: number;
|
||||||
}
|
};
|
||||||
|
|
||||||
export type CartItemDisplayInfo = Pick<CartItem, 'id' | 'name' | 'imageSrc'>;
|
export type CartItemDisplayInfo = Pick<CartItem, 'id' | 'name' | 'imageSrc'>;
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@ import type { ComponentChildren } from 'preact';
|
||||||
type Props = {
|
type Props = {
|
||||||
item: CartItemDisplayInfo;
|
item: CartItemDisplayInfo;
|
||||||
children: ComponentChildren;
|
children: ComponentChildren;
|
||||||
}
|
};
|
||||||
|
|
||||||
export default function AddToCartForm({ item, children }: Props) {
|
export default function AddToCartForm({ item, children }: Props) {
|
||||||
function addToCart(e: SubmitEvent) {
|
function addToCart(e: SubmitEvent) {
|
||||||
|
@ -14,9 +14,5 @@ export default function AddToCartForm({ item, children }: Props) {
|
||||||
addCartItem(item);
|
addCartItem(item);
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return <form onSubmit={addToCart}>{children}</form>;
|
||||||
<form onSubmit={addToCart}>
|
|
||||||
{children}
|
|
||||||
</form>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -10,7 +10,7 @@ export default function CartFlyout() {
|
||||||
<aside hidden={!$isCartOpen} className={styles.container}>
|
<aside hidden={!$isCartOpen} className={styles.container}>
|
||||||
{Object.values($cartItems).length ? (
|
{Object.values($cartItems).length ? (
|
||||||
<ul className={styles.list} role="list">
|
<ul className={styles.list} role="list">
|
||||||
{Object.values($cartItems).map(cartItem => (
|
{Object.values($cartItems).map((cartItem) => (
|
||||||
<li className={styles.listItem}>
|
<li className={styles.listItem}>
|
||||||
<img className={styles.listItemImg} src={cartItem.imageSrc} alt={cartItem.name} />
|
<img className={styles.listItemImg} src={cartItem.imageSrc} alt={cartItem.name} />
|
||||||
<div>
|
<div>
|
||||||
|
@ -20,7 +20,9 @@ export default function CartFlyout() {
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
) : <p>Your cart is empty!</p>}
|
) : (
|
||||||
|
<p>Your cart is empty!</p>
|
||||||
|
)}
|
||||||
</aside>
|
</aside>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,7 @@
|
||||||
import { useStore } from '@nanostores/preact';
|
import { useStore } from '@nanostores/preact';
|
||||||
import { isCartOpen } from '../cartStore';
|
import { isCartOpen } from '../cartStore';
|
||||||
|
|
||||||
|
|
||||||
export default function CartFlyoutToggle() {
|
export default function CartFlyoutToggle() {
|
||||||
const $isCartOpen = useStore(isCartOpen);
|
const $isCartOpen = useStore(isCartOpen);
|
||||||
return (
|
return <button onClick={() => isCartOpen.set(!$isCartOpen)}>Cart</button>;
|
||||||
<button onClick={() => isCartOpen.set(!$isCartOpen)}>Cart</button>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue