Show media modal on public pages (#6801)

1 files changed, 10 insertions, 6 deletions

diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js
index a47fc2830..7096b9b4f 100644
--- a/app/javascript/packs/public.js
+++ b/app/javascript/packs/public.js
@@ -25,7 +25,6 @@ function main() {
   const { getLocale } = require('../mastodon/locales');
   const { localeData } = getLocale();
   const VideoContainer = require('../mastodon/containers/video_container').default;
-  const MediaGalleryContainer = require('../mastodon/containers/media_gallery_container').default;
   const CardContainer = require('../mastodon/containers/card_container').default;
   const React = require('react');
   const ReactDOM = require('react-dom');
@@ -76,15 +75,20 @@ function main() {
       ReactDOM.render(<VideoContainer locale={locale} {...props} />, content);
     });
 
-    [].forEach.call(document.querySelectorAll('[data-component="MediaGallery"]'), (content) => {
-      const props = JSON.parse(content.getAttribute('data-props'));
-      ReactDOM.render(<MediaGalleryContainer locale={locale} {...props} />, content);
-    });
-
     [].forEach.call(document.querySelectorAll('[data-component="Card"]'), (content) => {
       const props = JSON.parse(content.getAttribute('data-props'));
       ReactDOM.render(<CardContainer locale={locale} {...props} />, content);
     });
+
+    const mediaGalleries = document.querySelectorAll('[data-component="MediaGallery"]');
+
+    if (mediaGalleries.length > 0) {
+      const MediaGalleriesContainer = require('../mastodon/containers/media_galleries_container').default;
+      const content = document.createElement('div');
+
+      ReactDOM.render(<MediaGalleriesContainer locale={locale} galleries={mediaGalleries} />, content);
+      document.body.appendChild(content);
+    }
   });
 
   delegate(document, '.webapp-btn', 'click', ({ target, button }) => {