fix(replymodal): replying didn't work from multiboard feeds (p/all, p/subscriptions)

This commit is contained in:
Tom (plebeius.eth)
2024-08-14 10:23:47 +02:00
parent f7bab7c83e
commit f6548cc2b8
6 changed files with 31 additions and 11 deletions
+1 -1
View File
@@ -147,7 +147,7 @@ const PostInfo = ({ openReplyModal, post, postReplyCount = 0, roles, isHidden }:
<Link to={`/p/${subplebbitAddress}/c/${cid}`} className={styles.linkToPost} title={t('link_to_post')} onClick={(e) => !cid && e.preventDefault()}>
c/
</Link>
<span className={styles.replyToPost} title={t('reply_to_post')} onMouseDown={() => openReplyModal && openReplyModal(cid, postCid)}>
<span className={styles.replyToPost} title={t('reply_to_post')} onMouseDown={() => openReplyModal && openReplyModal(cid, postCid, subplebbitAddress)}>
{shortCid}
</span>
</>
+1 -1
View File
@@ -136,7 +136,7 @@ const PostInfoAndMedia = ({ openReplyModal, post, postReplyCount = 0, roles }: P
<Link to={`/p/${subplebbitAddress}/c/${cid}`} className={styles.linkToPost} title={t('link_to_post')} onClick={(e) => !cid && e.preventDefault()}>
c/
</Link>
<span className={styles.replyToPost} title={t('reply_to_post')} onMouseDown={() => openReplyModal && openReplyModal(cid, postCid)}>
<span className={styles.replyToPost} title={t('reply_to_post')} onMouseDown={() => openReplyModal && openReplyModal(cid, postCid, subplebbitAddress)}>
{shortCid}
</span>
</>
+2 -2
View File
@@ -21,11 +21,11 @@ interface ReplyModalProps {
parentCid: string;
postCid: string;
scrollY: number;
subplebbitAddress: string;
}
const ReplyModal = ({ closeModal, showReplyModal, parentCid, postCid, scrollY }: ReplyModalProps) => {
const ReplyModal = ({ closeModal, showReplyModal, parentCid, postCid, scrollY, subplebbitAddress }: ReplyModalProps) => {
const { t } = useTranslation();
const { subplebbitAddress } = useParams() as { subplebbitAddress: string };
const { setPublishReplyOptions, publishReply } = usePublishReply({ cid: parentCid, subplebbitAddress });
const account = useAccount();
const { displayName } = account?.author || {};
+4 -2
View File
@@ -6,6 +6,7 @@ const useReplyModal = () => {
const [showReplyModal, setShowReplyModal] = useState(false);
const [activeCid, setActiveCid] = useState<string | null>(null);
const [threadCid, setThreadCid] = useState<string | null>(null);
const [subplebbitAddress, setSubplebbitAddress] = useState<string | null>(null);
const { resetSelectedText, setSelectedText } = useSelectedTextStore();
// on mobile, the css position is absolute instead of fixed, so we need to calculate the top position
@@ -23,7 +24,7 @@ const useReplyModal = () => {
text && setSelectedText(`>${text}\n`);
};
const openReplyModal = (parentCid: string, postCid: string) => {
const openReplyModal = (parentCid: string, postCid: string, subplebbitAddress: string) => {
getSelectedText();
if (isMobile) {
@@ -37,9 +38,10 @@ const useReplyModal = () => {
setActiveCid(parentCid);
setThreadCid(postCid);
setShowReplyModal(true);
setSubplebbitAddress(subplebbitAddress);
};
return { activeCid, threadCid, closeModal, openReplyModal, scrollY, showReplyModal };
return { activeCid, threadCid, closeModal, openReplyModal, scrollY, showReplyModal, subplebbitAddress };
};
export default useReplyModal;
+11 -2
View File
@@ -104,7 +104,7 @@ const Board = () => {
const { createdAt, description, error, rules, shortAddress, state, suggested } = subplebbit || {};
const title = isInAllView ? t('all') : isInSubscriptionsView ? t('subscriptions') : subplebbit?.title;
const { activeCid, threadCid, closeModal, openReplyModal, showReplyModal, scrollY } = useReplyModal();
const { activeCid, threadCid, closeModal, openReplyModal, showReplyModal, scrollY, subplebbitAddress: postSubplebbitAddress } = useReplyModal();
const { blocked, unblock } = useBlock({ address: subplebbitAddress });
const loadingStateString = useFeedStateString(subplebbitAddresses) || t('loading');
@@ -158,7 +158,16 @@ const Board = () => {
return (
<div className={styles.content}>
{location.pathname.endsWith('/settings') && <SettingsModal />}
{activeCid && threadCid && <ReplyModal closeModal={closeModal} parentCid={activeCid} postCid={threadCid} scrollY={scrollY} showReplyModal={showReplyModal} />}
{activeCid && threadCid && postSubplebbitAddress && (
<ReplyModal
closeModal={closeModal}
parentCid={activeCid}
postCid={threadCid}
scrollY={scrollY}
showReplyModal={showReplyModal}
subplebbitAddress={postSubplebbitAddress}
/>
)}
{feed.length !== 0 ? (
<>
{rules && rules.length > 0 && <SubplebbitRules subplebbitAddress={subplebbitAddress} createdAt={createdAt} rules={rules} />}
+12 -3
View File
@@ -22,7 +22,7 @@ export interface PostProps {
roles?: Role[];
showAllReplies?: boolean;
showReplies?: boolean;
openReplyModal?: (parentCid: string, postCid: string) => void;
openReplyModal?: (parentCid: string, postCid: string, subplebbitAddress: string) => void;
}
export const Post = ({ post, showAllReplies = false, showReplies = true, openReplyModal }: PostProps) => {
@@ -62,7 +62,7 @@ const PostPage = () => {
const subplebbit = useSubplebbit({ subplebbitAddress });
const { createdAt, description, rules, shortAddress, suggested, title } = subplebbit;
const { activeCid, threadCid, closeModal, openReplyModal, showReplyModal, scrollY } = useReplyModal();
const { activeCid, threadCid, closeModal, openReplyModal, showReplyModal, scrollY, subplebbitAddress: postSubplebbitAddress } = useReplyModal();
const comment = useComment({ commentCid });
@@ -91,7 +91,16 @@ const PostPage = () => {
return (
<div className={styles.content}>
{isInSettigsView && <SettingsModal />}
{activeCid && threadCid && <ReplyModal closeModal={closeModal} parentCid={activeCid} postCid={threadCid} scrollY={scrollY} showReplyModal={showReplyModal} />}
{activeCid && threadCid && postSubplebbitAddress && (
<ReplyModal
closeModal={closeModal}
parentCid={activeCid}
postCid={threadCid}
scrollY={scrollY}
showReplyModal={showReplyModal}
subplebbitAddress={postSubplebbitAddress}
/>
)}
{/* TODO: remove this replyCount error once api supports scrolling replies pages */}
{replyCount > 60 && <span className={styles.error}>Error: this thread has too many replies, some of them cannot be displayed right now.</span>}
{error && <span className={styles.error}>Error: {error.message}</span>}