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

added onclick event for sub list

Browse Source
This commit is contained in:
plebbitor
2023-02-07 22:55:00 +01:00
parent 0969cf9bb8
commit 1046576fac
3 changed files with 91 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/safari-pinned-tab.svg
-36
View File
@@ -1,36 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.14, written by Peter Selinger 2001-2017
</metadata>
<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M1795 5029 c-22 -4 -43 -5 -47 -3 -4 2 -9 0 -13 -6 -3 -5 -13 -10
-21 -10 -24 0 -105 -40 -149 -73 -141 -105 -221 -272 -179 -372 15 -37 64 -82
98 -91 13 -3 27 -11 29 -18 3 -6 -24 -43 -59 -81 -167 -179 -169 -338 -7 -439
24 -14 50 -26 59 -26 31 0 7 -25 -57 -59 -293 -155 -593 -406 -785 -658 -20
-27 -39 -50 -43 -53 -28 -23 -221 -344 -221 -369 0 -6 -4 -11 -10 -11 -5 0
-10 -8 -10 -18 0 -10 -4 -22 -9 -28 -5 -5 -25 -47 -44 -94 -89 -217 -153 -458
-173 -650 -4 -30 -9 -73 -13 -95 -8 -43 -6 -197 3 -230 38 -148 143 -281 271
-344 122 -60 227 -59 290 4 27 27 51 81 47 107 -3 16 28 15 46 -3 12 -10 25
-19 30 -19 5 0 15 -7 23 -16 38 -46 188 -96 261 -87 58 6 138 54 138 82 0 6 4
11 9 11 5 0 12 11 15 25 10 39 29 29 55 -28 145 -308 408 -629 701 -857 25
-19 47 -38 48 -42 2 -5 8 -8 12 -8 5 0 37 -20 72 -44 123 -85 301 -181 453
-244 52 -21 259 -93 279 -96 6 -1 40 -9 76 -18 148 -37 182 -40 288 -24 125
18 286 136 351 257 39 74 50 163 25 211 -20 39 -63 76 -96 83 -39 9 -35 33 15
81 121 119 166 232 132 334 -27 83 -117 145 -246 172 -32 6 -59 15 -59 18 0 4
46 26 103 50 189 79 408 201 517 286 147 115 202 164 295 256 61 60 126 130
145 155 19 25 40 50 45 57 122 135 306 462 387 690 65 180 119 399 120 487 0
42 -2 81 -5 86 -3 5 -9 25 -12 44 -3 19 -10 38 -16 43 -5 6 -9 16 -9 24 0 32
-92 151 -161 207 -30 25 -107 64 -134 68 -11 1 -25 5 -30 9 -14 9 -75 3 -109
-11 -33 -13 -76 -51 -76 -67 0 -19 -25 -64 -35 -64 -6 0 -24 14 -40 32 -114
121 -249 177 -350 145 -48 -14 -108 -74 -135 -133 -26 -59 -51 -163 -43 -178
4 -7 2 -8 -5 -1 -6 6 -29 56 -51 113 -149 375 -389 713 -691 971 -126 108
-218 173 -395 278 -99 59 -404 193 -475 208 -8 2 -27 8 -42 14 -16 6 -28 8
-28 6 0 -2 -12 0 -27 6 -36 14 -45 16 -123 33 -84 19 -155 24 -205 15z"/>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.2 KiB

src/components/Board.jsx
+85 -75
View File
@@ -17,9 +17,8 @@ const ImageBanner = () => {
const Board = () => {
const [defaultSubplebbits, setDefaultSubplebbits] = useState([]);
const {feed, hasMore, loadMore} = useFeed(['memes.eth'], 'new');
console.log({feed});
const [selectedTitle, setSelectedTitle] = useState("");
const [selectedAddress, setSelectedAddress] = useState("");
useEffect(() => {
let didCancel = false;
@@ -38,13 +37,24 @@ const Board = () => {
};
}, []);
const handleClick = (title, address) => {
setSelectedTitle(title);
setSelectedAddress(address);
};
const {feed, hasMore, loadMore} = useFeed([`${selectedAddress}`], 'new');
console.log(feed);
return (
<Container>
<NavBar>
<>
{defaultSubplebbits.map(subplebbit => (
<span className="boardList" key={subplebbit.address}>[
<a href="/board">{subplebbit.title}</a>
<span className="boardList" key={subplebbit.address}>
[
<a href="#" onClick={() => handleClick(subplebbit.title, subplebbit.address)}
>{subplebbit.title}</a>
]&nbsp;
</span>
))}
@@ -59,8 +69,8 @@ const Board = () => {
<ImageBanner />
</div>
<>
<div className="board-title">Crypto</div>
<div className="board-address">p/QmPjewdKya8iVkuQiiXQ5qRBsgVUAZg2LQ2m8v3LNJ7Ht8</div>
<div className="board-title">{selectedTitle}</div>
<div className="board-address">p/{selectedAddress}</div>
</>
</>
</Header>
@@ -91,90 +101,90 @@ const Board = () => {
</TopBar>
<BoardForm id="board-form" name="board-form" action="" method="post">
<div className="board">
<div id="t" className="thread">
<div id="pc" className="post-container op-container">
<div id="p" className="post op">
<span id="sa">
<img alt="H" className="ext-button thread-hide-button" data-cmd="hide" data-id="1-test" src="./post_expand_minus.png" title="Hide thread" />
</span>
<div id="pi" className="post-info">
 
<span className="name-block">
<span className="name">Tom</span>
 
<span className="poster-address">
(User: plebeius.eth)
</span>
{feed.map(object => (
<>
<div id="t" className="thread">
<div id="pc" className="post-container op-container">
<div id="p" className="post op">
<span id="sa">
<img alt="H" className="ext-button thread-hide-button" data-cmd="hide" data-id="1-test" src="./post_expand_minus.png" title="Hide thread" />
</span>
 
<span className="date-time" data-utc="data">2 weeks ago</span>
 
<span className="post-number">
<a href="post-link" title="Link to this post">No.</a>
<a href="post-link" title="Reply to this post">00000001</a>
   
<span>
[
<a className="reply-link" href="post-link">Reply</a>
]
<div id="pi" className="post-info">
<span className="name-block">
<span className="name">Tom</span>
<span className="poster-address">
(User: plebeius.eth)
</span>
</span>
</span>
<a className="post-menu-button" href="post-menu" title="Post menu" data-cmd="post-menu">▶</a>
<div id="backlink-id" className="backlink">
<span className="date-time" data-utc="data">2 weeks ago</span>
<span className="post-number">
<a href="post-link" title="Link to this post">No.</a>
<a href="post-link" title="Reply to this post">00000001</a>
<span>
[
<a className="reply-link" href="post-link">Reply</a>
]
</span>
</span>
<a className="post-menu-button" href="post-menu" title="Post menu" data-cmd="post-menu">▶</a>
<div id="backlink-id" className="backlink">
<span>
<a className="quote-link" href="post-link">{'>>'}00000002</a>
</span>
</div>
<blockquote>
<span className="quote">
{'>'}wen mvp
</span>
<br />
two more weeks
</blockquote>
</div>
<blockquote>
<span className="quote">
{'>'}wen mvp
</div>
</div>
<div key={`pc-${object.cid}`} className="post-container reply-container">
<div key={`sa-${object.cid}`} className="side-arrows">{'>>'}</div>
<div key={`pr-${object.cid}`} className="post-reply">
<div key={`pi-${object.cid}`} className="post-info">
<span key={`nb-${object.cid}`} className="nameblock">
<span key={`n-${object.cid}`} className="name">{object.author.displayName}</span>
<span key={`pa-${object.cid}`} className="poster-address">
(User: {object.author.address})
</span>
</span>
<span key={`dt-${object.cid}`} className="date-time" data-utc="data">2 weeks ago</span>
<span key={`pn-${object.cid}`} className="post-number">
<a key={`pl1-${object.cid}`} href="post-link" title="Link to this post">No.</a>
<a key={`pl2-${object.cid}`} href="post-link" title="Reply to this post">00000002</a>
</span>
<a key={`pmb-${object.cid}`} className="post-menu-button" href="#" title="Post menu" data-cmd="post-menu">▶</a>
</div>
<blockquote key={`pm-${object.cid}`} className="post-message">
<span key={`q-${object.cid}`} className="quote">
{'>'}{object.title}
</span>
<br />
two more weeks
{object.content}
</blockquote>
</div>
</div>
</div>
{feed.map(post => (
<div id="pc" className="post-container reply-container">
<div className="side-arrows">{'>>'}</div>
<div className="post-reply">
<div className="post-info">
 
<span className="nameblock">
<span className="name">Anonymous</span>
 
<span className="poster-address">
(User: {post.author.address})
</span>
</span>
 
<span className="date-time" data-utc="data">2 weeks ago</span>
 
<span className="post-number">
<a href="post-link" title="Link to this post">No.</a>
<a href="post-link" title="Reply to this post">00000002</a>
</span>
<a className="post-menu-button" href="#" title="Post menu" data-cmd="post-menu">▶</a>
</div>
<blockquote className="post-message">
<span className="quote">
{'>'}{post.title}
</span>
<br />
{post.content}
</blockquote>
</div>
</div>
<hr />
</>
))}
</div>
</div>
<div className="bottom-control">
<span></span>
</div>
</BoardForm>
</Container>
)
);
}
export default Board;
src/components/styles/Board.styled.jsx
+6
View File
@@ -228,4 +228,10 @@ export const BoardForm = styled.form`
word-break: break-word;
max-width: 100%;
}
hr {
border: none;
border-top: 1px solid #d9bfb7;
height: 0;
}
`;