External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

fixed undefined values and tooltips

Browse Source
This commit is contained in:
plebbitor
2023-04-22 18:02:47 +02:00
parent a0d35dfd61
commit 981f049811
2 changed files with 22 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/views/Board.jsx
+8 -8
View File
@@ -501,10 +501,10 @@ const Board = () => {
</div> </div>
</span> </span>
{thread.content ? ( {thread.content ? (
thread.content.length > 1000 ? thread.content?.length > 1000 ?
<Fragment key={`fragment5-${thread.cid}`}> <Fragment key={`fragment5-${thread.cid}`}>
<blockquote key={`bq-${thread.cid}`}> <blockquote key={`bq-${thread.cid}`}>
<Post content={thread.content.slice(0, 1000)} key={`post-${thread.cid}`} /> <Post content={thread.content?.slice(0, 1000)} key={`post-${thread.cid}`} />
<span key={`ttl-s-${thread.cid}`} className="ttl"> (...) <span key={`ttl-s-${thread.cid}`} className="ttl"> (...)
<br key={`ttl-s-br1-${thread.cid}`} /><br key={`ttl-s-br2${thread.cid}`} /> <br key={`ttl-s-br1-${thread.cid}`} /><br key={`ttl-s-br2${thread.cid}`} />
Post too long.&nbsp; Post too long.&nbsp;
@@ -642,13 +642,13 @@ const Board = () => {
</div> </div>
) : null} ) : null}
{reply.content ? ( {reply.content ? (
reply.content.length > 500 ? reply.content?.length > 500 ?
<Fragment key={`fragment8-${reply.cid}`}> <Fragment key={`fragment8-${reply.cid}`}>
<blockquote key={`pm-${reply.cid}`} comment={reply} className="post-message"> <blockquote key={`pm-${reply.cid}`} comment={reply} className="post-message">
<Link to={() => {}} key={`r-pm-${reply.cid}`} className="quotelink" onClick={(event) => handleQuoteClick(reply, shortParentCid, thread.shortCid, event)}> <Link to={() => {}} key={`r-pm-${reply.cid}`} className="quotelink" onClick={(event) => handleQuoteClick(reply, shortParentCid, thread.shortCid, event)}>
{`c/${shortParentCid}`}{shortParentCid === thread.shortCid ? " (OP)" : null} {`c/${shortParentCid}`}{shortParentCid === thread.shortCid ? " (OP)" : null}
</Link> </Link>
<Post content={reply.content.slice(0, 500)} key={`post-${reply.cid}`} /> <Post content={reply.content?.slice(0, 500)} key={`post-${reply.cid}`} />
<span key={`ttl-s-${reply.cid}`} className="ttl"> (...) <span key={`ttl-s-${reply.cid}`} className="ttl"> (...)
<br key={`ttl-s-br1-${reply.cid}`} /><br key={`ttl-s-br2${reply.cid}`} /> <br key={`ttl-s-br1-${reply.cid}`} /><br key={`ttl-s-br2${reply.cid}`} />
Comment too long.&nbsp; Comment too long.&nbsp;
@@ -766,10 +766,10 @@ const Board = () => {
</div> </div>
) : null} ) : null}
{thread.content ? ( {thread.content ? (
thread.content.length > 500 ? thread.content?.length > 500 ?
<Fragment key={`fragment12-${thread.cid}`}> <Fragment key={`fragment12-${thread.cid}`}>
<blockquote key={`mob-bq-${thread.cid}`} className="post-message-mobile"> <blockquote key={`mob-bq-${thread.cid}`} className="post-message-mobile">
<Post content={thread.content.slice(0, 500)} key={`post-mobile-${thread.cid}`} /> <Post content={thread.content?.slice(0, 500)} key={`post-mobile-${thread.cid}`} />
<span key={`mob-ttl-s-${thread.cid}`} className="ttl"> (...) <span key={`mob-ttl-s-${thread.cid}`} className="ttl"> (...)
<br key={`mob-ttl-s-br1-${thread.cid}`} /><br key={`mob-ttl-s-br2${thread.cid}`} /> <br key={`mob-ttl-s-br1-${thread.cid}`} /><br key={`mob-ttl-s-br2${thread.cid}`} />
Post too long.&nbsp; Post too long.&nbsp;
@@ -879,13 +879,13 @@ const Board = () => {
</div> </div>
) : null} ) : null}
{reply.content ? ( {reply.content ? (
reply.content.length > 500 ? reply.content?.length > 500 ?
<Fragment key={`fragment15-${reply.cid}`}> <Fragment key={`fragment15-${reply.cid}`}>
<blockquote key={`mob-pm-${reply.cid}`} className="post-message"> <blockquote key={`mob-pm-${reply.cid}`} className="post-message">
<Link to={() => {}} key={`mob-r-pm-${reply.cid}`} className="quotelink" onClick={(event) => handleQuoteClick(reply, shortParentCid, thread.shortCid, event)}> <Link to={() => {}} key={`mob-r-pm-${reply.cid}`} className="quotelink" onClick={(event) => handleQuoteClick(reply, shortParentCid, thread.shortCid, event)}>
{`c/${shortParentCid}`}{shortParentCid === thread.shortCid ? " (OP)" : null} {`c/${shortParentCid}`}{shortParentCid === thread.shortCid ? " (OP)" : null}
</Link> </Link>
<Post content={reply.content.slice(0, 500)} key={`post-mobile-${reply.cid}`} comment={reply} /> <Post content={reply.content?.slice(0, 500)} key={`post-mobile-${reply.cid}`} comment={reply} />
<span key={`mob-ttl-s-${reply.cid}`} className="ttl"> (...) <span key={`mob-ttl-s-${reply.cid}`} className="ttl"> (...)
<br key={`mob-ttl-s-br1-${reply.cid}`} /><br key={`mob-ttl-s-br2${reply.cid}`} /> <br key={`mob-ttl-s-br1-${reply.cid}`} /><br key={`mob-ttl-s-br2${reply.cid}`} />
Comment too long.&nbsp; Comment too long.&nbsp;
src/components/views/Pending.jsx
+14 -5
View File
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
import { Helmet } from 'react-helmet-async'; import { Helmet } from 'react-helmet-async';
import { Link, useNavigate, useParams } from 'react-router-dom'; import { Link, useNavigate, useParams } from 'react-router-dom';
import { Tooltip } from 'react-tooltip'; import { Tooltip } from 'react-tooltip';
import { useAccountComment } from '@plebbit/plebbit-react-hooks'; import { useAccount, useAccountComment } from '@plebbit/plebbit-react-hooks';
import useGeneralStore from '../../hooks/stores/useGeneralStore'; import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, PostForm, BoardForm } from '../styled/Board.styled'; import { Container, NavBar, Header, Break, PostForm, BoardForm } from '../styled/Board.styled';
import { ReplyFormLink, TopBar, BottomBar } from '../styled/Thread.styled'; import { ReplyFormLink, TopBar, BottomBar } from '../styled/Thread.styled';
@@ -31,6 +31,7 @@ const Pending = () => {
const { index } = useParams(); const { index } = useParams();
const account = useAccount();
const comment = useAccountComment({commentIndex: index}); const comment = useAccountComment({commentIndex: index});
const [visible] = useState(true); const [visible] = useState(true);
@@ -258,8 +259,12 @@ const Pending = () => {
&nbsp; &nbsp;
<span className="poster-address"> <span className="poster-address">
(u/ (u/
<span key={`pa-${"pending"}`} className="poster-address"> <span key={`pa-${"pending"}`} className="poster-address"
{comment.author?.address} data-tooltip-id="tooltip"
data-tooltip-content={account?.author?.address}
data-tooltip-place="top"
>
{account?.author?.address.slice(0, 10) + "(...)"}
</span>) </span>)
</span> </span>
&nbsp; &nbsp;
@@ -302,8 +307,12 @@ const Pending = () => {
&nbsp; &nbsp;
<span key={`mob-pa-${"pending"}`} className="poster-address-mobile"> <span key={`mob-pa-${"pending"}`} className="poster-address-mobile">
(u/ (u/
<span key={`mob-ha-${"pending"}`} className="highlight-address-mobile"> <span key={`mob-ha-${"pending"}`} className="poster-address-mobile"
{comment.author?.address} data-tooltip-id="tooltip"
data-tooltip-content={account?.author?.address}
data-tooltip-place="top"
>
{account?.author?.address.slice(0, 10) + "(...)"}
</span> </span>
)&nbsp; )&nbsp;
</span> </span>