fix loop bug in thread view

This commit is contained in:
Tom
2023-05-10 10:00:08 +02:00
parent 762dec840d
commit b8d7e11744
2 changed files with 13 additions and 12 deletions
+2 -4
View File
@@ -1,5 +1,4 @@
import React, { useCallback, useEffect, useRef, useState } from 'react'; import React, { useCallback, useEffect, useRef, useState } from 'react';
import { useLocation } from 'react-router-dom';
import { usePublishComment } from '@plebbit/plebbit-react-hooks'; import { usePublishComment } from '@plebbit/plebbit-react-hooks';
import { StyledModal } from './styled/ReplyModal.styled'; import { StyledModal } from './styled/ReplyModal.styled';
import useGeneralStore from '../hooks/stores/useGeneralStore'; import useGeneralStore from '../hooks/stores/useGeneralStore';
@@ -33,8 +32,7 @@ const ReplyModal = ({ isOpen, closeModal }) => {
const [selectedText, setSelectedText] = useState(''); const [selectedText, setSelectedText] = useState('');
useError(errorMessage, [errorMessage]); useError(errorMessage, [errorMessage]);
const location = useLocation();
const onModalOpen = () => { const onModalOpen = () => {
@@ -109,7 +107,7 @@ const ReplyModal = ({ isOpen, closeModal }) => {
if (index !== undefined) { if (index !== undefined) {
setPendingCommentIndex(index); setPendingCommentIndex(index);
} }
}, [index, location, setPendingCommentIndex]); }, [index, setPendingCommentIndex]);
const resetFields = useCallback(() => { const resetFields = useCallback(() => {
+11 -8
View File
@@ -52,6 +52,11 @@ const Thread = () => {
const commentRef = useRef(); const commentRef = useRef();
const linkRef = useRef(); const linkRef = useRef();
const [triggerPublishComment, setTriggerPublishComment] = useState(false);
const [errorMessage, setErrorMessage] = useState(null);
useError(errorMessage, [errorMessage]);
const [isReplyOpen, setIsReplyOpen] = useState(false); const [isReplyOpen, setIsReplyOpen] = useState(false);
const navigate = useNavigate(); const navigate = useNavigate();
const [prevScrollPos, setPrevScrollPos] = useState(0); const [prevScrollPos, setPrevScrollPos] = useState(0);
@@ -63,6 +68,10 @@ const Thread = () => {
const stateString = useStateString(comment?.clients); const stateString = useStateString(comment?.clients);
const commentMediaInfo = getCommentMediaInfo(comment);
const fallbackImgUrl = "assets/filedeleted-res.gif";
const errorString = useMemo(() => { const errorString = useMemo(() => {
if (comment?.state === 'failed') { if (comment?.state === 'failed') {
let errorString = 'Failed fetching thread.' let errorString = 'Failed fetching thread.'
@@ -73,20 +82,13 @@ const Thread = () => {
} }
}, [comment?.state, comment?.error]) }, [comment?.state, comment?.error])
useEffect(() => { useEffect(() => {
if (errorString) { if (errorString) {
setErrorMessage(errorString); setErrorMessage(errorString);
} }
}, [errorString]); }, [errorString]);
const commentMediaInfo = getCommentMediaInfo(comment);
const fallbackImgUrl = "assets/filedeleted-res.gif";
const [errorMessage, setErrorMessage] = useState(null);
useError(errorMessage, [errorMessage]);
const [triggerPublishComment, setTriggerPublishComment] = useState(false);
const flattenedReplies = useMemo(() => const flattenedReplies = useMemo(() =>
flattenCommentsPages(comment.replies), [comment.replies] flattenCommentsPages(comment.replies), [comment.replies]
@@ -228,6 +230,7 @@ const Thread = () => {
await publishComment(); await publishComment();
resetFields(); resetFields();
})(); })();
setTriggerPublishComment(false);
} }
}, [publishCommentOptions, triggerPublishComment, publishComment, resetFields]); }, [publishCommentOptions, triggerPublishComment, publishComment, resetFields]);