mirror of
https://github.com/smolgrrr/TAO.git
synced 2024-09-20 09:21:25 +00:00
fix thread
This commit is contained in:
parent
1b69768298
commit
f9c07267b2
@ -23,7 +23,8 @@ const Thread = () => {
|
|||||||
const [postType, setPostType] = useState("");
|
const [postType, setPostType] = useState("");
|
||||||
const [hasRun, setHasRun] = useState(false);
|
const [hasRun, setHasRun] = useState(false);
|
||||||
const [preOPEvents, setPreOPEvents] = useState(['']);
|
const [preOPEvents, setPreOPEvents] = useState(['']);
|
||||||
const [sortByPoW, setSortByPoW] = useState(false);
|
const [sortByTime, setSortByTime] = useState(true);
|
||||||
|
const [filterDifficulty, setFilterDifficulty] = useState(localStorage.getItem("filterDifficulty") || "20");
|
||||||
|
|
||||||
// Define your callback function for subGlobalFeed
|
// Define your callback function for subGlobalFeed
|
||||||
const onEvent = (event: Event, relay: string) => {
|
const onEvent = (event: Event, relay: string) => {
|
||||||
@ -79,16 +80,20 @@ const Thread = () => {
|
|||||||
)
|
)
|
||||||
.sort((a, b) => (b.created_at as any) - (a.created_at as any));
|
.sort((a, b) => (b.created_at as any) - (a.created_at as any));
|
||||||
|
|
||||||
const toggleSort = () => {
|
const toggleSort = () => {
|
||||||
setSortByPoW(prev => !prev);
|
setSortByTime(prev => !prev);
|
||||||
};
|
};
|
||||||
|
|
||||||
const eventsSortedByTime = [...uniqEvents].slice(1).sort((a, b) => a.created_at - b.created_at);
|
const eventsSortedByTime = [...uniqEvents].slice(1).filter(event => event.kind === 1).sort((a, b) => a.created_at - b.created_at);
|
||||||
|
|
||||||
// Events sorted by PoW (assuming `getPow` returns a numerical representation of the PoW)
|
// Events sorted by PoW (assuming `getPow` returns a numerical representation of the PoW)
|
||||||
const eventsSortedByPow = [...uniqEvents].slice(1).sort((a, b) => getPow(b.id) - getPow(a.id));
|
const eventsSortedByPow = [...uniqEvents].slice(1)
|
||||||
|
.filter((event) =>
|
||||||
const displayedEvents = sortByPoW ? eventsSortedByPow : eventsSortedByTime;
|
getPow(event.id) > Number(filterDifficulty) &&
|
||||||
|
event.kind === 1
|
||||||
|
).sort((a, b) => getPow(b.id) - getPow(a.id));
|
||||||
|
|
||||||
|
const displayedEvents = sortByTime ? eventsSortedByTime : eventsSortedByPow;
|
||||||
|
|
||||||
if (!uniqEvents[0]) {
|
if (!uniqEvents[0]) {
|
||||||
return (
|
return (
|
||||||
@ -145,31 +150,31 @@ const Thread = () => {
|
|||||||
<ThreadPost OPEvent={uniqEvents[0]} state={showForm} type={postType} />
|
<ThreadPost OPEvent={uniqEvents[0]} state={showForm} type={postType} />
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center justify-center w-full py-4">
|
<div className="flex items-center justify-center w-full py-4">
|
||||||
<label htmlFor="toggleB" className="flex items-center cursor-pointer">
|
<label htmlFor="toggleB" className="flex items-center cursor-pointer">
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<input
|
<input
|
||||||
id="toggleB"
|
id="toggleB"
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
className="sr-only"
|
className="sr-only"
|
||||||
checked={sortByPoW}
|
checked={sortByTime}
|
||||||
onChange={toggleSort}
|
onChange={toggleSort}
|
||||||
/>
|
/>
|
||||||
<div className="block bg-gray-600 w-10 h-6 rounded-full"></div>
|
<div className="block bg-gray-600 w-10 h-6 rounded-full"></div>
|
||||||
<div
|
<div
|
||||||
className={`dot absolute left-1 top-1 bg-white w-4 h-4 rounded-full transition ${sortByPoW ? 'transform translate-x-full bg-blue-400' : ''
|
className={`dot absolute left-1 top-1 bg-white w-4 h-4 rounded-full transition ${sortByTime ? 'transform translate-x-full bg-blue-400' : ''
|
||||||
}`}
|
}`}
|
||||||
></div>
|
></div>
|
||||||
</div>
|
</div>
|
||||||
<div className={`ml-3 text-neutral-500 font-medium ${sortByPoW ? 'text-neutral-500' : ''}`}>
|
<div className={`ml-3 text-neutral-500 font-medium ${sortByTime ? 'text-neutral-500' : ''}`}>
|
||||||
{sortByPoW ? 'Sort by PoW' : 'Sort by age'}
|
{sortByTime ? 'Sort by oldest' : 'Sort by PoW'}
|
||||||
</div>
|
</div>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
|
||||||
<div className="col-span-full h-0.5 bg-neutral-900"></div> {/* This is the white line separator */}
|
<div className="col-span-full h-0.5 bg-neutral-900"></div> {/* This is the white line separator */}
|
||||||
{displayedEvents.map((event, index) => (
|
{displayedEvents.map((event, index) => (
|
||||||
<ReplyCard key={index} event={event} metadata={getMetadataEvent(event)} replyCount={countReplies(event)} repliedTo={repliedList(event)} />
|
<ReplyCard key={index} event={event} metadata={getMetadataEvent(event)} replyCount={countReplies(event)} repliedTo={repliedList(event)} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</>
|
</>
|
||||||
|
Loading…
Reference in New Issue
Block a user