From ba7ae87edb796610b5f62ff232c158d8516eca0e Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Thu, 13 Jun 2024 11:38:21 +0800
Subject: [PATCH] Display notice on status.cafe widget if JavaScript is
 disabled

---
 src/_includes/main/statuscafe.njk | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/_includes/main/statuscafe.njk b/src/_includes/main/statuscafe.njk
index d27c9d80..ec6b7b83 100644
--- a/src/_includes/main/statuscafe.njk
+++ b/src/_includes/main/statuscafe.njk
@@ -2,7 +2,9 @@
     <h3>My Lastest Status</h3>
     <div id="statuscafe-userinfo"></div>
     <div id="statuscafe-content">
-        <p>Fetching data from status.cafe...</p>
+        <noscript>
+            <p>Looks like you have JavaScript disabled. JavaScript is required to fetch my latest status from status.cafe and display it here.</p>
+        </noscript>
     </div>
 
     <p><a href="https://status.cafe/users/leilukin">View my statuses on status.cafe</a></p>
@@ -15,6 +17,11 @@
 </style>
 
 <script>
+    const statusCafeContent = document.getElementById("statuscafe-content");
+    statusCafeContent.innerHTML = `
+        <p>Fetching data from status.cafe...</p>
+    `;
+
     const fetchStatusCafe = async () => {
         try {
             const res = await fetch('https://status.cafe/users/leilukin/status.json');
@@ -26,7 +33,7 @@
             }
 
             document.getElementById("statuscafe-userinfo").innerHTML = data.author + ' ' + data.face + ' ' + data.timeAgo;
-            document.getElementById("statuscafe-content").innerHTML = data.content;
+            statusCafeContent.innerHTML = data.content;
         } catch (error) {
             console.error(error);
             document.getElementById("statuscafe-content").textContent = `[ERROR] ${error}`;