From 0bb50f492e5555963016b095dc14d9e792a063c3 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Wed, 22 Nov 2023 22:49:27 -0600
Subject: [PATCH] Lazy-load the Gameboy component

---
 src/components/gameboy.tsx       |  2 +-
 src/components/media-gallery.tsx | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/gameboy.tsx b/src/components/gameboy.tsx
index 7c9773fc5..775386080 100644
--- a/src/components/gameboy.tsx
+++ b/src/components/gameboy.tsx
@@ -69,4 +69,4 @@ const WasmBoyOptions = {
   saveStateCallback: false,
 };
 
-export { Gameboy };
\ No newline at end of file
+export default Gameboy;
\ No newline at end of file
diff --git a/src/components/media-gallery.tsx b/src/components/media-gallery.tsx
index 2cf8ee139..198fee48a 100644
--- a/src/components/media-gallery.tsx
+++ b/src/components/media-gallery.tsx
@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import React, { useState, useRef, useLayoutEffect } from 'react';
+import React, { useState, useRef, useLayoutEffect, Suspense } from 'react';
 
 import Blurhash from 'soapbox/components/blurhash';
 import Icon from 'soapbox/components/icon';
@@ -12,11 +12,11 @@ import { truncateFilename } from 'soapbox/utils/media';
 import { isIOS } from '../is-mobile';
 import { isPanoramic, isPortrait, isNonConformingRatio, minimumAspectRatio, maximumAspectRatio } from '../utils/media-aspect-ratio';
 
-import { Gameboy } from './gameboy';
-
 import type { Property } from 'csstype';
 import type { List as ImmutableList } from 'immutable';
 
+const Gameboy = React.lazy(() => import('./gameboy'));
+
 const ATTACHMENT_LIMIT = 4;
 const MAX_FILENAME_LENGTH = 45;
 
@@ -155,7 +155,9 @@ const Item: React.FC<IItem> = ({
         key={attachment.id}
         style={{ position, float, left, top, right, bottom, height, width: `${width}%` }}
       >
-        <Gameboy className='media-gallery__item-thumbnail object-contain' src={attachment.url} />
+        <Suspense fallback={<div  className='media-gallery__item-thumbnail' />}>
+          <Gameboy className='media-gallery__item-thumbnail object-contain' src={attachment.url} />
+        </Suspense>
       </div>
     );
   } else if (attachment.type === 'unknown') {