Building a Featured Gallery component for Gutenberg

In your GalleryImage

const { withSelect } = wp.data;
const { compose } = wp.compose;

// You should define __
const { __ } = wp.i18n;

In your FeaturedGallery

• You need to return the element, and set a key for the element (which is a list item): ( I also removed the index because it’s not being used.. if we define a variable, it should be used. 🙂 )

  And because an element should be returned, then you should use map() because forEach() doesn’t return anything and only applies a function to each element in the array.

  { featuredGalleryIds.map( ( img ) => {
      return (
          <li key={ img }>
              <GalleryImage
                  id={ img }
              />
          </li>
      );
  } ) }
  

  Alternate/simpler version — this is basically same as above, but you’d use the above if you want to perform some logic before the return line:

  { featuredGalleryIds.map( ( img ) => (
      <li key={ img }>
          <GalleryImage
              id={ img }
          />
      </li>
  ) ) }
  

• Then (not a major issue, but) in the applyWithDispatch(), you should use the dot notation (item.id) and not the array notation (item['id']).

  const items = images.map( ( item ) => item.id );    // like this
  const items = images.map( ( item ) => item['id'] ); // not this