Fix flaky test src/room/composer/Banner/Banner.stories.tsx > With Avatar Image (#33275)

* Fix flaky test `src/room/composer/Banner/Banner.stories.tsx > With Avatar Image`

it was previously loading an external (slow) image which was random (!) by design

Fixes https://github.com/element-hq/element-web/issues/33273

* Fix styling

* Iterate

* Update snapshot

packages/shared-components/src/room/composer/Banner/Banner.module.css

@@ -48,12 +48,13 @@
 }
 
 .icon {
-    width: 24px;
     display: flex;
     align-items: flex-start;
 }
 
 .icon img {
+    height: 24px;
+    aspect-ratio: auto;
     border-radius: 50%;
 }
 

packages/shared-components/src/room/composer/Banner/Banner.stories.tsx

@@ -11,6 +11,7 @@ import { type Meta, type StoryObj } from "@storybook/react-vite";
 import { Button } from "@vector-im/compound-web";
 
 import { Banner } from "./Banner";
+import avatarImage from "../../../../static/element.png";
 
 const meta = {
     title: "room/Banner",
@@ -58,7 +59,7 @@ export const WithAction: Story = {
 
 export const WithAvatarImage: Story = {
     args: {
-        avatar: <img alt="Example" src="https://picsum.photos/32/32" />,
+        avatar: <img alt="Example" src={avatarImage} />,
     },
 };
 

packages/shared-components/src/room/composer/Banner/__snapshots__/Banner.test.tsx.snap

@@ -78,7 +78,7 @@ exports[`AvatarWithDetails > renders a banner with an avatar iamge 1`] = `
     >
       <img
         alt="Example"
-        src="https://picsum.photos/32/32"
+        src="/static/element.png"
       />
     </div>
     <div