preview: add primitive fetch que and wait for noxy response

Instead of just blindly fetch noxy requests, this adds a simple
fetch que that waits until the pending response is done and
continues with the next one whichever seen first, this is not
in chronological order, but incoming event order (incoming events
from different relays).

src/main.js

@@ -168,16 +168,23 @@ const getNoxyUrl = (type, url, id, relay) => {
   return link;
 }
 
-function linkPreview(href, id, relay) {
+const fetchQue = [];
-  if ((/\.(gif|jpe?g|png)$/i).test(href)) {
+let fetchPending;
-    return elem('div', {},
+const fetchNext = (href, id, relay) => {
-      [elem('img', {className: 'preview-image-only', loading: 'lazy', src: getNoxyUrl('data', href, id, relay).href})]
-    );
-  }
   const noxy = getNoxyUrl('meta', href, id, relay);
   const previewId = noxy.searchParams.toString();
-  fetch(noxy.href)
+  if (fetchPending) {
-    .then(data => data.json ? data.json() : data)
+    fetchQue.push({href, id, relay});
+    return previewId;
+  }
+  fetchPending = fetch(noxy.href)
+    .then(data => {
+      if (data.status === 200) {
+        return data.json();
+      }
+      // fetchQue.push({href, id, relay}); // could try one more time
+      return Promise.reject(data);
+    })
     .then(meta => {
       const container = document.getElementById(previewId);
       container.append(elem('a', {href, rel: 'noopener noreferrer', target: '_blank'}, [
@@ -189,7 +196,24 @@ function linkPreview(href, id, relay) {
       ]));
       container.classList.add('preview-loaded');
     })
+    .finally(() => {
+      fetchPending = false;
+      if (fetchQue.length) {
+        const {href, id, relay} = fetchQue.shift();
+        return fetchNext(href, id, relay);
+      }
+    })
     .catch(console.warn);
+  return previewId;
+};
+
+function linkPreview(href, id, relay) {
+  if ((/\.(gif|jpe?g|png)$/i).test(href)) {
+    return elem('div', {},
+      [elem('img', {className: 'preview-image-only', loading: 'lazy', src: getNoxyUrl('data', href, id, relay).href})]
+    );
+  }
+  const previewId = fetchNext(href, id, relay);
   return elem('div', {
     className: 'preview',
     id: previewId