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/res/css/views/rooms/_EventTile.pcss

@@ -78,8 +78,8 @@ $left-gutter: 64px;
         min-width: 100px;
     }
 
-    .mx_MImageBody {
-        .mx_MImageBody_thumbnail_container {
+    .mx_ImageBody {
+        .mx_ImageBody_container {
             display: flex;
             align-items: center; /* on every layout */
         }
@@ -156,8 +156,8 @@ $left-gutter: 64px;
             position: absolute;
         }
 
-        .mx_MImageBody {
-            .mx_MImageBody_thumbnail_container {
+        .mx_ImageBody {
+            .mx_ImageBody_container {
                 justify-content: flex-start;
                 min-height: $font-44px;
                 min-width: $font-44px;