diff --git a/README.md b/README.md index 58ef383..3fd9bd3 100644 --- a/README.md +++ b/README.md @@ -35,6 +35,8 @@ COINBASE_COMMERCE_API_KEY="GET_FROM_COINBASE_COMMERCE" ## Locally run + + ```sh # Install bun in case you don't have it bun curl -fsSL | bash diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx index 1378ad9..40bc3db 100644 --- a/src/components/Navbar.tsx +++ b/src/components/Navbar.tsx @@ -1,22 +1,25 @@ -import { useState } from "react"; +import { useCallback, useState } from "react"; import { GITHUB_LINK, ONCHAINKIT_LINK, TEMPLATE_LINK, TWITTER_LINK, } from "src/links"; +import { ExternalLinkSvg } from "src/svg/ExternalLinkSvg"; +import { MenuSvg } from "src/svg/MenuSvg"; import OnchainKitShopSvg from "src/svg/OnchainKitShopSvg"; import { NavbarLinkReact } from "src/types"; function NavbarLink({ link, label }: NavbarLinkReact) { return ( -
  • +
  • {label} +
  • ); } @@ -24,9 +27,9 @@ function NavbarLink({ link, label }: NavbarLinkReact) { export default function Navbar() { const [isMenuOpen, setIsMenuOpen] = useState(false); - const toggleMenu = () => { - setIsMenuOpen(!isMenuOpen); - }; + const toggleMenu = useCallback(() => { + setIsMenuOpen((prev) => !prev); + }, []); return (
    @@ -46,9 +49,10 @@ export default function Navbar() { - {/* */} + {isMenuOpen && ( diff --git a/src/components/OnchainStore.tsx b/src/components/OnchainStore.tsx index fed1b13..b2bee06 100644 --- a/src/components/OnchainStore.tsx +++ b/src/components/OnchainStore.tsx @@ -10,7 +10,7 @@ export default function OnchainStore() {
    -
    +
    diff --git a/src/components/OnchainStoreCart.tsx b/src/components/OnchainStoreCart.tsx index 0d8d621..2d55963 100644 --- a/src/components/OnchainStoreCart.tsx +++ b/src/components/OnchainStoreCart.tsx @@ -43,11 +43,11 @@ export default function OnchainStoreCart() { return (
    -
    +
    Built with OnchainKit -
    +

    TOTAL {totalSum.toFixed(2)} USDC

    diff --git a/src/components/OnchainStoreItems.tsx b/src/components/OnchainStoreItems.tsx index d72ef7c..79b8e5e 100644 --- a/src/components/OnchainStoreItems.tsx +++ b/src/components/OnchainStoreItems.tsx @@ -5,7 +5,7 @@ export default function OnchainStoreItems() { const { products } = useOnchainStoreContext(); return ( -
    +
    {products?.map((item) => )}
    diff --git a/src/components/OnchainStoreSummary.tsx b/src/components/OnchainStoreSummary.tsx index ffa72c0..517b4b4 100644 --- a/src/components/OnchainStoreSummary.tsx +++ b/src/components/OnchainStoreSummary.tsx @@ -1,6 +1,6 @@ export default function OnchainStoreSummary() { return ( -
    +

    + + + ); +} diff --git a/src/svg/MenuSvg.tsx b/src/svg/MenuSvg.tsx new file mode 100644 index 0000000..d57326a --- /dev/null +++ b/src/svg/MenuSvg.tsx @@ -0,0 +1,13 @@ + +export function MenuSvg() { + return ( + + + + ); +}