Refactor Marketplace contract to implement reentrancy protection, update listing count logic, and enhance action handling. Improve README for clarity on action selectors and update metadata handling in Next.js app for mini app integration.

Author: escottalexander

README.md

@@ -21,7 +21,7 @@ Farcaster-ready marketplace mini app built on Scaffold-ETH 2. It lets creators p
 - **TestERC20.sol**: Simple mintable tokens for local development (2 and 6 decimals). Only deployed on `localhost`/`hardhat`.
 
 ### Marketplace data model
-- `listingCount`: sequential marketplace-level IDs starting at 1 (also used as the listing-type ID).
+- `listingCount`: sequential marketplace-level IDs starting at 0 (also used as the listing-type ID).
 - `listings[id]`: `ListingPointer { creator, listingType, contenthash, active }` where:
   - `listingType` is the address of the listing-type contract (e.g., `SimpleListings`).
   - `contenthash` is an arbitrary string (e.g., IPFS CID) set at creation time.
@@ -34,7 +34,7 @@ Farcaster-ready marketplace mini app built on Scaffold-ETH 2. It lets creators p
 
 2) **Actions**: `Marketplace.callAction(id, action, data)`
    - Delegates to `IListingType.handleAction(listingId=id, creator, active, caller=msg.sender, action, data)`.
-   - `action` is the 4-byte function selector (left-padded to 32 bytes) of a function exposed by the listing-type for dynamic dispatch.
+   - `action` is a 32-byte word whose MOST SIGNIFICANT 4 bytes are the function selector. In other words, pass the 4-byte selector RIGHT-PADDED to 32 bytes.
    - Emits `ListingAction(id, caller, action)`.
 
 3) **Activation toggle**
@@ -59,11 +59,14 @@ Farcaster-ready marketplace mini app built on Scaffold-ETH 2. It lets creators p
 - SimpleListings: `SimpleListingCreated`, `SimpleListingSold`, `SimpleListingClosed`.
 
 ### Calling actions from the frontend
-- With SE-2 hooks, write to `Marketplace.callAction` and pass a selector for the action you want. For example, to buy a listing with ETH using `SimpleListings`:
+- With SE-2 hooks, write to `Marketplace.callAction` and pass the selector in the MOST SIGNIFICANT 4 bytes of a 32-byte word (right-padded). For example, to buy a listing with ETH using `SimpleListings`:
 
 ```ts
 // selector for: buy(uint256,address,bool,address,bytes)
-const action = '0x9570e8f9' as const; // bytes4; pass left-padded to 32 bytes
+const selector = '0x9570e8f9' as const; // bytes4
+// Right-pad to 32 bytes so the selector sits in the most significant 4 bytes
+// Practical approach: pack into a 32-byte hex by appending 28 bytes of zeros after the 4-byte selector
+const action = (selector + '0'.repeat(64 - 8)) as `0x${string}`; // 8 hex chars for 4 bytes, total 32 bytes
 await writeMarketplaceAsync({
   functionName: 'callAction',
   args: [listingId, action, '0x'],

packages/hardhat/contracts/Marketplace.sol

@@ -2,8 +2,9 @@
 pragma solidity >=0.8.0 <0.9.0;
 
 import { IListingType } from "./IListingType.sol";
+import { ReentrancyGuard } from "@openzeppelin/contracts/utils/ReentrancyGuard.sol";
 
-contract Marketplace {
+contract Marketplace is ReentrancyGuard {
     error ListingCreationFailed();
     error OnlyListingTypeCanModify();
     error ListingNotFound();
@@ -26,8 +27,8 @@ contract Marketplace {
         address listingType,
         string calldata contenthash,
         bytes calldata data
-    ) external returns (uint256 id) {
-        id = ++listingCount;
+    ) external nonReentrant returns (uint256 id) {
+        id = listingCount++;
         bool success = IListingType(listingType).create(msg.sender, id, data);
         if (!success) revert ListingCreationFailed();
         listings[id] = ListingPointer(msg.sender, listingType, contenthash, true);
@@ -38,14 +39,14 @@ contract Marketplace {
         uint256 id,
         bytes32 action,
         bytes calldata data
-    ) external payable {
-        if (id > listingCount) revert ListingNotFound();
+    ) external payable nonReentrant {
+        if (id >= listingCount) revert ListingNotFound();
         ListingPointer memory ptr = listings[id];
         IListingType(ptr.listingType).handleAction{value: msg.value}(id, ptr.creator, ptr.active, msg.sender, action, data);
         emit ListingAction(id, msg.sender, action);
     }
 
-    function setActive(uint256 listingId, bool active) external {
+    function setActive(uint256 listingId, bool active) external nonReentrant {
         ListingPointer storage record = listings[listingId];
         if (msg.sender != record.listingType) revert OnlyListingTypeCanModify();
         record.active = active;

packages/hardhat/contracts/SimpleListings.sol

@@ -82,6 +82,7 @@ contract SimpleListings is IListingType {
         bytes calldata /*data*/
     ) external payable onlySelf isActive(active) {
         SimpleListing storage l = listings[listingId];
+        Marketplace(marketplace).setActive(listingId, false);
         if (l.paymentToken == address(0)) {
             if (msg.value != l.price) revert IncorrectEth();
             (bool sent, ) = creator.call{ value: msg.value }("");
@@ -91,7 +92,6 @@ contract SimpleListings is IListingType {
             bool ok = IERC20(l.paymentToken).transferFrom(buyer, creator, l.price);
             if (!ok) revert Erc20TransferFailed();
         }
-        Marketplace(marketplace).setActive(listingId, false);
         emit SimpleListingSold(listingId, buyer, l.price, l.paymentToken);
     }
 

packages/nextjs/app/.well-known/farcaster.json/route.ts

@@ -18,7 +18,7 @@ export async function GET() {
       payload: process.env.FARCASTER_PAYLOAD,
       signature: process.env.FARCASTER_SIGNATURE,
     },
-    frame: withValidProperties({
+    miniapp: withValidProperties({
       version: "1",
       name: "Ethereum Bazaar",
       subtitle: "A peer to peer marketplace",

packages/nextjs/utils/scaffold-eth/getMetadata.ts

@@ -1,8 +1,6 @@
 import type { Metadata } from "next";
 
-const baseUrl = process.env.VERCEL_PROJECT_PRODUCTION_URL
-  ? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}`
-  : `http://localhost:${process.env.PORT || 3000}`;
+const baseUrl = process.env.NEXT_PUBLIC_URL ?? `http://localhost:${process.env.NEXT_PUBLIC_PORT || 3000}`;
 const titleTemplate = "%s | Ethereum Bazaar";
 
 export const getMetadata = ({
@@ -16,13 +14,30 @@ export const getMetadata = ({
 }): Metadata => {
   const imageUrl = `${baseUrl}${imageRelativePath}`;
 
+  const miniAppContent = JSON.stringify({
+    version: "1",
+    imageUrl: process.env.NEXT_PUBLIC_IMAGE_URL ?? imageUrl,
+    button: {
+      title: `${process.env.NEXT_PUBLIC_APP_NAME ?? title}`,
+      action: {
+        url: `${baseUrl}/`,
+        type: "launch_miniapp",
+      },
+    },
+  });
+
   return {
     metadataBase: new URL(baseUrl),
     title: {
       default: title,
       template: titleTemplate,
     },
     description: description,
+    manifest: "/manifest.json",
+    other: {
+      "fc:miniapp": miniAppContent,
+      "fc:frame": miniAppContent,
+    },
     openGraph: {
       title: {
         default: title,