error handling for req loading non-existant posts

Team-Tritan · Jun 12, 2022 · e7ff871 · e7ff871
1 parent 7988a2d
commit e7ff871
Show file tree

Hide file tree

Showing 5 changed files with 1,802 additions and 29 deletions.
diff --git a/components/Feed/Spinner.tsx b/components/Feed/Spinner.tsx
@@ -1,5 +1,18 @@
 'use strict';
 
+import Script from 'next/Script';
+
+export function removeDaThing() {
+    setTimeout(() => {
+        if (document.getElementById('spinner') && document.getElementById('text')) {
+            document.getElementById('text').innerHTML =
+                'Our robots could not find the page you requested.<br />It may have been moved, deleted, or never existed in the first place.<br /> <br /> ';
+
+            document.getElementById('spinner').style.display = 'none';
+        }
+    }, 3000);
+}
+
 export default function LoadingSpinner() {
     return (
         <>
@@ -9,12 +22,17 @@ export default function LoadingSpinner() {
             <div className="d-flex justify-content-center">
                 <div className="text-center">
                     <div
-                        className="spinner-border text-primary"
+                        className="spinner-border"
+                        id="spinner"
                         role="status"
-                        style={{ width: '3rem', height: '3rem' }}
+                        style={{ width: '3rem', height: '3rem', color: '#ffb6da' }}
                     ></div>
+                    <h3 id="text" className="text-white mt-3">
+                        Talking to the robots...
+                    </h3>
                 </div>
             </div>
+            {removeDaThing()}
         </>
     );
 }