Passing key to CustomImageComponent

[hoscarcito]

Expected Behavior

The CustomImageComponent should receive a key from the array

Current Behavior

If I try to access the props in the custom component the key prop is empty (undefined).

BTW I found that in Brick.js the brick component uses a brickKey prop for the view that doesn't exists.

Possible Solution

Steps to Reproduce

const customComponent = (props) => {
  console.log(props);
  return (
      <Image {...props} />
  );
};

<Masonry
  sorted
  bricks={this.state.data}
  columns={this.state.columns}
  customImageComponent={customComponent}
/>

Context (Environment)

We are using carousel component so we need the id of the image to know in which position we should start the carousel when we click the image.

[brh55]

Have you tried passing it through masonry with the customImageProps property?

Example:

const customImageProps = {
     foo: 'bar',
     resizeLoad: 10,
     example: 20
};

const customComponent = (props) => {
  console.log(props);
  return (
      <Image {...props} />
  );
};

<Masonry
  sorted
  bricks={this.state.data}
  columns={this.state.columns}
  customImageComponent={customComponent}
  customImageProps
/>

[brh55]

Sorry, I see that you are trying to pass it through the dataset.

[hoscarcito]

Exactly.. We don't need an id, it will work with just the position on the array. Is it possible to have as a prop?