Can’t make an IMAGE fit in Material CardMedia something is of I cant find it please advice

I learn JavaScript React and now I have problem with positioning of images.
I have a Codesandbox.

I learn from this MUI tutorial.

It should look like this this but I get bad output.

enter image description here

In the Component FileEditor.jsx I load up the FileContentRenderer.jsx that can show both MP4 and Images, but images has problem.
In the FileContentRenderer.jsx I try this:

  cardMedia: {
    width: "auto",
    height: "100%"
  }

That should show the image but not,
Then I try this;

  cardMedia: {
    width: "100%",
    height: "50vh"
  }

That will display images in portrait but in landcape it does not show full image.

This viewer App can display MP4 and images and the MP4 is showing ok in landscape and portrait when using

  viewerMp4: {
    width: "auto",
    height: "100%"
  },

So why does that not work with an image