Phase 2 Refactor MImageBody to MVVM and remove legacy component (#33212)

* MVVMing of MImageBody and removing legacy component + css

* Fix Prettier

* update small image to large image in test

* Update test

* Preserve MImageBody legacy class names

* Click image in custom component download test

* Update snapshots

* Update MBodyFactory snapshots

* Added new tests to pass coverage

* Fix prettier

* Remove legacy import that was removed

* Add MImageReplayBody test for coverage

* Remove legacy MImageBody selectors from image view

* Update image body selectors in Playwright tests

* Keep file panel image body spacing compact

* Update apps/web/src/viewmodels/message-body/ImageBodyViewModel.ts

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

* added documentation to component

* Fix hidden media placeholder import

---------

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

apps/web/playwright/e2e/timeline/timeline.spec.ts

@@ -907,7 +907,7 @@ test.describe("Timeline", () => {
 
                 await sendImage(bot, room.roomId, NEW_AVATAR);
                 await app.timeline.scrollToBottom();
-                const imgTile = page.locator(".mx_MImageBody").first();
+                const imgTile = page.locator(".mx_ImageBody").first();
                 await expect(imgTile).toBeVisible();
                 await imgTile.hover();
                 await page.getByRole("button", { name: "Hide" }).click();
@@ -1314,7 +1314,7 @@ test.describe("Timeline", () => {
 
             await sendImage(app.client, room.roomId, NEW_AVATAR);
             await app.timeline.scrollToBottom();
-            await expect(page.locator(".mx_MImageBody").first()).toBeVisible();
+            await expect(page.locator(".mx_ImageBody").first()).toBeVisible();
 
             // Exclude timestamp and read marker from snapshot
             const screenshotOptions = {