Connect a Custom Catalog to Wix Stores

Question:
I am trying to connect a custom catalog to Wix stores but whenever I do, I receive this Error “Cannot read properties of undefined (reading ‘catalogItemId’)”. Once I press the add to cart button. everything is supposed to be added to the cart, but I end up with that error.

The CMS

Product:
I am using Wix studios

What are you trying to achieve:
I am trying to have my CMS items go to my cart. for example the price, picture and name.

What have you already tried:
I am following these documentations

Connect a Custom Catalog to Wix Stores

addToCart( )

https://dev.wix.com/docs/velo/api-reference/wix-ecom-backend/cart/add-to-cart

Additional information:
Here i will post my code and below I will post my Errors from my log and developer console.

Dynamic page (Custom Products (Iteam ))

import { addTocart } from 'backend/cart.web';     

$w.onReady(function () {
$w("#addToCartButton").onClick(addCustomProductToCart);
});


async function addCustomProductToCart() {
    $w("#dynamicDataset").onReady(async ()=>{
        const currentItem =$w('#dynamicDataset').getCurrentItem();
        const productId = currentItem._id;

        const updatedCart = await addTocart(productId);
        console.log("updated cart", updatedCart);

    })
}

Cart.web.js (Backend)

import { Permissions, webMethod } from "wix-web-module";
import { currentCart } from "wix-ecom-backend";
 
export const addTocart = webMethod(
    Permissions.Anyone,
    async (productId) => {
        const options = {
            "lineItems": [
                {
                      "catalogReference": {
                        "catalogItemId": "productId",
                        "appId": "5e82be8d-8a7c-4fda-ad42-47012802dd16",
                    },
                    "quantity": 1
                }]
        }
        
        try {
            const updatedCart = await currentCart.addToCurrentCart(options);
            console.log("Updated cart:", updatedCart);
            return updatedCart;
        } catch (error) {
            console.error("Error adding to cart:", error);
            //throw error;
        }
    }
);

my-catalog-config.js (service plug in)

export function getConfig() {
  return {};
}

my-catalog.js (service plug in)

import wixData from 'wix-data';

export const getCatalogItems = async (options, context) => {
    const {catalogReferences} = options;
    console.log("catalog refrences", catalogReferences);

    let catalogIteams = [];

    for (let reference of catalogReferences){
        const {catalogReferences} = reference;
        const customProductsQueryResult = await wixData.query("CustomProducts").eq("_id", catalogReferences.catalogItemId).find({ suppressAuth: true });
        console.log("query result", customProductsQueryResult);
        const catalogItem = customProductsQueryResult.items[0];
        const data = {
            productName: {
                original: catalogItem.productName,
        },
        itemType: {
          preset: "PHYSICAL"
        },
        price: catalogItem.productPrice.toString(),
        media: catalogItem.productImage,
        
        }

        catalogIteams.push({catalogReferences, data});

    }
    console.log("catalog iteams", catalogIteams);

    return {catalogIteams};
};

Errors from my log and developer console.
Log Errors/INFO

INFO

Details

“root”:{

“insertId”:

“…4JecGrFCC06AwEwNSjcGwB”

“timestamp”:

“2024-12-16T21:54:50.381Z”

“labels”:{

“siteUrl”:

“n/a”

“revision”:

“1324”

“namespace”:

“Velo”

“tenantId”:

“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”

“viewMode”:

“Site”

}

“sourceLocation”:{

“file”:

“backend/spi/ecom-catalog/my-catalog/my-catalog.js”

“line”:

36

“column”:

12

}

“operation”:{

“id”:

“1734386088.6453572523896132954317”

“producer”:

“backend”

}

“jsonPayload”:{

“message”:

“catalog refrences [{“catalogReference”:{“catalogItemId”:“productId”,“appId”:“5e82be8d-8a7c-4fda-ad42-47012802dd16”},“quantity”:1}]”

}

“receiveTimestamp”:

“2024-12-16T21:54:50.477Z”

}

ERROR

Details

“root”:{

“insertId”:

“…8JecGrFCC06AwEwNSjcGwB”

“timestamp”:

“2024-12-16T21:54:50.394Z”

“labels”:{

“siteUrl”:

“n/a”

“revision”:

“1324”

“namespace”:

“Velo”

“tenantId”:

“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”

“viewMode”:

“Site”

}

“sourceLocation”:{

“file”:

“backend/spi/ecom-catalog/my-catalog/my-catalog.js”

“line”:

42

“column”:

109

}

“operation”:{

“id”:

“1734386088.6453572523896132954317”

“producer”:

“backend”

}

“jsonPayload”:{

“message”:

“Cannot read properties of undefined (reading ‘catalogItemId’)”

}

“severity”:

“ERROR”

“receiveTimestamp”:

“2024-12-16T21:54:50.476Z”

}

ERROR

Details

“root”:{

“insertId”:

“…59bqz_FV0.xNrgtAYDCTSQ”

“timestamp”:

“2024-12-16T21:54:50.469Z”

“labels”:{

“revision”:

“-1”

“namespace”:

“Velo”

“tenantId”:

“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”

“viewMode”:

“Preview”

}

“sourceLocation”:{

“file”:

“backend/cart.web.js”

“line”:

26

“column”:

ERROR

Details

“root”:{

“insertId”:

“…59bqz_FV0.xNrgtAYDCTSQ”

“timestamp”:

“2024-12-16T21:54:50.469Z”

“labels”:{

“revision”:

“-1”

“namespace”:

“Velo”

“tenantId”:

“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”

“viewMode”:

“Preview”

}

“sourceLocation”:{

“file”:

“backend/cart.web.js”

“line”:

26

“column”:

20

}

“operation”:{

“id”:

“1734386088.6453572523896132954317”

“producer”:

“backend”

}

“jsonPayload”:{

“message”:

“Error adding to cart: message: Cannot read properties of undefined (reading ‘catalogItemId’) details: applicationError: description: Cannot read properties of undefined (reading ‘catalogItemId’) code: USER_CODE_UNKNOWN_EXCEPTION data: {}”

}

“severity”:

“ERROR”

“receiveTimestamp”:

“2024-12-16T21:54:50.588Z”

}

INFO

Details

“root”:{

“insertId”:

“…BxT9H5sU01Iua9vrSdHtMr”

“timestamp”:

“2024-12-16T21:54:50.522Z”

“labels”:{

“revision”:

“-1”

“namespace”:

“Velo”

“tenantId”:

“ba0bddbf-e6fc-409f-ad76-8654d2ecbea8”

“viewMode”:

“Preview”

}

“sourceLocation”:{

“file”:

“Custom Products (Item)”

}

“operation”:{

“id”:

“…Bso0sdzh87rvPsYksSNNoG”

}

“jsonPayload”:{

“message”:

“updated cart undefined”

}

“receiveTimestamp”:

“2024-12-16T21:54:50.792Z”

}

Developer Console

updated cart undefined
Custom Products (Item) Line 16

Error adding to cart: message: Cannot read properties of undefined (reading ‘catalogItemId’)
details:
applicationError:
description: Cannot read properties of undefined (reading ‘catalogItemId’)
code: USER_CODE_UNKNOWN_EXCEPTION
data: {}
B cart.web.js Line 26