Example of horizontal grid scrolling in material ui v5

So i ran into a similar issue and was able to solve this for version 5 of material UI. In your ImageList component, you want to define, within sx, an overflow of auto. Furthermore, the height at which you want your images to appear as on screen you will define with rowHeight, so I placed rowHeight at 200 for myself. Finally, within your ImageListItem, you want to set it, within sx, with a display of flex and a flexDirection of row, doing so allows each item to be placed horizontally. To add spacing in between each image, within the img tag define a marginRight of 1em or whichever number you choose for your liking - remember this goes within your style attribute.

Here is my code example of creating a horizontal scroll of ImageList:

<ImageList sx={{ overflowX: 'auto' }} rowHeight={200}>
          <ImageListItem sx={{display: 'flex', flexDirection: 'row'}}>
            {state.posts[i].images.map(image => {
              return (
              <img
              src={image}
              srcSet={image}
              alt='title'
              loading='lazy'
              style={{paddingRight: '1em'}}
              />
              )
            })}
          </ImageListItem>
        </ImageList>

Here are two images of what it looks like: