doot/TAO
1
0
Fork 0
mirror of https://github.com/smolgrrr/TAO.git synced 2024-09-20 09:21:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix thread

Browse Source
This commit is contained in:
smolgrrr 2023-11-06 21:40:10 +11:00
parent 1b69768298
commit f9c07267b2
1 changed files with 36 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
client/src/components/Thread/Thread.tsx
View File

@ -23,7 +23,8 @@ const Thread = () => {
const [postType, setPostType] = useState("");
const [hasRun, setHasRun] = useState(false);
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
const onEvent = (event: Event, relay: string) => {
@ -80,15 +81,19 @@ const Thread = () => {
.sort((a, b) => (b.created_at as any) - (a.created_at as any));
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)
const eventsSortedByPow = [...uniqEvents].slice(1).sort((a, b) => getPow(b.id) - getPow(a.id));
const eventsSortedByPow = [...uniqEvents].slice(1)
.filter((event) =>
getPow(event.id) > Number(filterDifficulty) &&
event.kind === 1
).sort((a, b) => getPow(b.id) - getPow(a.id));
const displayedEvents = sortByPoW ? eventsSortedByPow : eventsSortedByTime;
const displayedEvents = sortByTime ? eventsSortedByTime : eventsSortedByPow;
if (!uniqEvents[0]) {
return (
@ -151,17 +156,17 @@ const Thread = () => {
id="toggleB"
type="checkbox"
className="sr-only"
checked={sortByPoW}
checked={sortByTime}
onChange={toggleSort}
/>
<div className="block bg-gray-600 w-10 h-6 rounded-full"></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 className={`ml-3 text-neutral-500 font-medium ${sortByPoW ? 'text-neutral-500' : ''}`}>
{sortByPoW ? 'Sort by PoW' : 'Sort by age'}
<div className={`ml-3 text-neutral-500 font-medium ${sortByTime ? 'text-neutral-500' : ''}`}>
{sortByTime ? 'Sort by oldest' : 'Sort by PoW'}
</div>
</label>
</div>