From e588546a5ae3cfd7f7b2c1212664dd21a00afb01 Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Thu, 21 Nov 2024 15:29:40 -0800
Subject: [PATCH] Better handle loading blocks

---
 public/locales/en/common.json      | 3 +++
 src/widgets/spoolman/component.jsx | 7 +++++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index ab7dcfc92..5abb9a4b9 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -998,5 +998,8 @@
         "progressing": "Progressing",
         "missing": "Missing",
         "suspended": "Suspended"
+    },
+    "spoolman": {
+        "loading": "Loading"
     }
 }
diff --git a/src/widgets/spoolman/component.jsx b/src/widgets/spoolman/component.jsx
index 9d7630586..523ecea79 100644
--- a/src/widgets/spoolman/component.jsx
+++ b/src/widgets/spoolman/component.jsx
@@ -16,10 +16,13 @@ export default function Component({ service }) {
   }
 
   if (!spoolData) {
+    const nBlocksGuess = widget.spoolIds?.length ?? 4;
     return (
       <Container service={service}>
-        <Block label="spoolman.spool1" />
-        <Block label="spoolman.spool2" />
+        {[...Array(nBlocksGuess)].map((_, i) => (
+          // eslint-disable-next-line react/no-array-index-key
+          <Block key={i} label="spoolman.loading" />
+        ))}
       </Container>
     );
   }