From ecdaebb6cd3c6513ee53974e5b2d55df24da721a Mon Sep 17 00:00:00 2001
From: Sped0n <realsped0n@outlook.com>
Date: Thu, 22 Feb 2024 01:48:48 +0800
Subject: [PATCH] refactor: don't render unneeded elements on raw info page

---
 assets/ts/desktop/layout.tsx | 48 +++++++++++++++++++-----------------
 assets/ts/mobile/layout.tsx  | 36 ++++++++++++++-------------
 2 files changed, 44 insertions(+), 40 deletions(-)

diff --git a/assets/ts/desktop/layout.tsx b/assets/ts/desktop/layout.tsx
index f74a3b7..9a6a011 100644
--- a/assets/ts/desktop/layout.tsx
+++ b/assets/ts/desktop/layout.tsx
@@ -55,34 +55,36 @@ export default function Desktop(props: {
   return (
     <>
       <Nav />
-      <Stage
-        ijs={props.ijs}
-        setIsLoading={setIsLoading}
-        isOpen={isOpen}
-        setIsOpen={setIsOpen}
-        isAnimating={isAnimating}
-        setIsAnimating={setIsAnimating}
-        cordHist={cordHist}
-        setCordHist={setCordHist}
-        navVector={navVector}
-        setNavVector={setNavVector}
-      />
-      <Show when={isOpen()}>
-        <CustomCursor cursorText={cursorText} active={active} isOpen={isOpen} />
-        <StageNav
-          prevText={props.prevText}
-          closeText={props.closeText}
-          nextText={props.nextText}
-          loadingText={props.loadingText}
-          active={active}
-          isAnimating={isAnimating}
-          setCordHist={setCordHist}
+      <Show when={props.ijs.length > 0}>
+        <Stage
+          ijs={props.ijs}
+          setIsLoading={setIsLoading}
           isOpen={isOpen}
           setIsOpen={setIsOpen}
-          setHoverText={setHoverText}
+          isAnimating={isAnimating}
+          setIsAnimating={setIsAnimating}
+          cordHist={cordHist}
+          setCordHist={setCordHist}
           navVector={navVector}
           setNavVector={setNavVector}
         />
+        <Show when={isOpen()}>
+          <CustomCursor cursorText={cursorText} active={active} isOpen={isOpen} />
+          <StageNav
+            prevText={props.prevText}
+            closeText={props.closeText}
+            nextText={props.nextText}
+            loadingText={props.loadingText}
+            active={active}
+            isAnimating={isAnimating}
+            setCordHist={setCordHist}
+            isOpen={isOpen}
+            setIsOpen={setIsOpen}
+            setHoverText={setHoverText}
+            navVector={navVector}
+            setNavVector={setNavVector}
+          />
+        </Show>
       </Show>
     </>
   )
diff --git a/assets/ts/mobile/layout.tsx b/assets/ts/mobile/layout.tsx
index 29653e2..3b85b96 100644
--- a/assets/ts/mobile/layout.tsx
+++ b/assets/ts/mobile/layout.tsx
@@ -1,4 +1,4 @@
-import { createSignal, type JSX, type Setter } from 'solid-js'
+import { Show, createSignal, type JSX, type Setter } from 'solid-js'
 
 import type { ImageJSON } from '../resources'
 
@@ -29,22 +29,24 @@ export default function Mobile(props: {
 
   return (
     <>
-      <Collection
-        ijs={props.ijs}
-        isAnimating={isAnimating}
-        isOpen={isOpen}
-        setIsOpen={setIsOpen}
-      />
-      <Gallery
-        ijs={props.ijs}
-        closeText={props.closeText}
-        loadingText={props.loadingText}
-        isAnimating={isAnimating}
-        setIsAnimating={setIsAnimating}
-        isOpen={isOpen}
-        setIsOpen={setIsOpen}
-        setScrollable={props.setScrollable}
-      />
+      <Show when={props.ijs.length > 0}>
+        <Collection
+          ijs={props.ijs}
+          isAnimating={isAnimating}
+          isOpen={isOpen}
+          setIsOpen={setIsOpen}
+        />
+        <Gallery
+          ijs={props.ijs}
+          closeText={props.closeText}
+          loadingText={props.loadingText}
+          isAnimating={isAnimating}
+          setIsAnimating={setIsAnimating}
+          isOpen={isOpen}
+          setIsOpen={setIsOpen}
+          setScrollable={props.setScrollable}
+        />
+      </Show>
     </>
   )
 }