fix(pending post): invalid pending post index would break the view, redirect to not found instead

src/views/pending-post/pending-post.tsx

@@ -1,11 +1,12 @@
 import { useEffect } from 'react';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
-import { useAccountComment } from '@plebbit/plebbit-react-hooks';
+import { useAccountComment, useAccountComments } from '@plebbit/plebbit-react-hooks';
 import { isSettingsView } from '../../lib/utils/view-utils';
 import { Post } from '../post';
 import SettingsModal from '../../components/settings-modal';
 
 const PendingPost = () => {
+  const { accountComments } = useAccountComments();
   const { accountCommentIndex } = useParams<{ accountCommentIndex?: string }>();
   const commentIndex = accountCommentIndex ? parseInt(accountCommentIndex) : undefined;
   const post = useAccountComment({ commentIndex });
@@ -16,6 +17,19 @@ const PendingPost = () => {
 
   useEffect(() => window.scrollTo(0, 0), []);
 
+  const isValidAccountCommentIndex =
+    !accountCommentIndex ||
+    (!isNaN(parseInt(accountCommentIndex)) &&
+      parseInt(accountCommentIndex) >= 0 &&
+      accountComments?.length > 0 &&
+      parseInt(accountCommentIndex) < accountComments.length);
+
+  useEffect(() => {
+    if (!isValidAccountCommentIndex) {
+      navigate('/not-found', { replace: true });
+    }
+  }, [isValidAccountCommentIndex, navigate]);
+
   useEffect(() => {
     if (post?.cid && post?.subplebbitAddress) {
       navigate(`/p/${post?.subplebbitAddress}/c/${post?.cid}`, { replace: true });