chore: handle errors better

api-text.js

@@ -22,21 +22,37 @@ class ApiText extends HTMLElement {
     const content = this.querySelector('.content')
     const cacheKey = this.url || 'api-text-cache'
     const cache = sessionStorage?.getItem(cacheKey)
+
+    const hideElement = () => { this.style.display = 'none' }
+
     const loadText = (string) => {
-      loading.style.display = string ? 'none' : ''
-      content.style.display = string ? 'block' : 'none'
-      if (string) content.innerHTML = string
+      if (!string) {
+        hideElement()
+        return
+      }
+      loading.style.display = 'none'
+      content.style.display = 'block'
+      content.innerHTML = string
     }
 
-    if (cache) loadText(JSON.parse(cache))
+    if (cache) {
+      loadText(JSON.parse(cache))
+    } else {
+      loading.style.display = 'block'
+      content.style.display = 'none'
+    }
 
     try {
       const data = await this.data
       const value = data.content
-      loadText(value)
-      sessionStorage?.setItem(cacheKey, JSON.stringify(value))
+      if (value) {
+        loadText(value)
+        sessionStorage?.setItem(cacheKey, JSON.stringify(value))
+      } else {
+        hideElement()
+      }
     } catch (error) {
-      loadText()
+      hideElement()
     }
   }
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdransf/api-text",
-  "version": "1.3.1",
+  "version": "1.4.0",
   "description": "A web component to load text from an API and display it.",
   "main": "api-text.js",
   "repository": {