From e15307be3b3e905d5ab406a92c661ece5f4673aa Mon Sep 17 00:00:00 2001
From: enes <enes@nostrdev.com>
Date: Wed, 1 Jan 2025 16:16:39 +0100
Subject: [PATCH] fix(mod): loading mod edge case

Close #175 - Add timeout to requests and try again button
---
 src/pages/404.tsx       | 18 ++++++++++++++++--
 src/pages/mod/loader.ts |  7 ++++---
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index d3e5a77..f2db88b 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -1,4 +1,4 @@
-import { Link, useRouteError } from 'react-router-dom'
+import { Link, useLocation, useRouteError } from 'react-router-dom'
 import { appRoutes } from 'routes'
 
 interface NotFoundPageProps {
@@ -12,6 +12,8 @@ export const NotFoundPage = ({
 }: Partial<NotFoundPageProps>) => {
   const error = useRouteError() as Partial<NotFoundPageProps>
 
+  const location = useLocation()
+
   return (
     <div className='InnerBodyMain'>
       <div className='ContainerMain'>
@@ -23,7 +25,19 @@ export const NotFoundPage = ({
             <div>
               <p>{error?.message || message}</p>
             </div>
-            <div className='IBMSMAction'>
+            <div
+              className='IBMSMAction'
+              style={{
+                gap: '10px'
+              }}
+            >
+              <Link
+                to={location.pathname}
+                className='btn btnMain IBMSMActionBtn'
+                type='button'
+              >
+                Try again
+              </Link>
               <Link
                 to={appRoutes.home}
                 className='btn btnMain IBMSMActionBtn'
diff --git a/src/pages/mod/loader.ts b/src/pages/mod/loader.ts
index 3c7ebc2..d311109 100644
--- a/src/pages/mod/loader.ts
+++ b/src/pages/mod/loader.ts
@@ -20,7 +20,8 @@ import {
   getLocalStorageItem,
   getReportingSet,
   log,
-  LogType
+  LogType,
+  timeout
 } from 'utils'
 
 export const modRouteLoader =
@@ -84,8 +85,8 @@ export const modRouteLoader =
 
       // Parallel fetch mod event, latest events, mute, nsfw, repost lists
       const settled = await Promise.allSettled([
-        ndkContext.fetchEvent(modFilter),
-        ndkContext.fetchEvents(latestFilter),
+        Promise.race([ndkContext.fetchEvent(modFilter), timeout(2000)]),
+        Promise.race([ndkContext.fetchEvents(latestFilter), timeout(2000)]),
         ndkContext.getMuteLists(loggedInUserPubkey), // Pass pubkey for logged-in users
         getReportingSet(CurationSetIdentifiers.NSFW, ndkContext),
         getReportingSet(CurationSetIdentifiers.Repost, ndkContext)