mirror of
https://github.com/smolgrrr/TAO.git
synced 2024-09-20 01:11:25 +00:00
fix render
This commit is contained in:
parent
acb3b4927e
commit
311ca3dbda
@ -3,6 +3,7 @@ import NewNoteCard from "../forms/PostFormCard";
|
||||
import { useParams } from "react-router-dom";
|
||||
import useProcessedEvents from "../../hooks/processedEvents";
|
||||
import HashtagBar from "../modals/HashtagBar";
|
||||
import { useState, useEffect } from "react";
|
||||
|
||||
const DEFAULT_DIFFICULTY = 0;
|
||||
|
||||
@ -10,6 +11,23 @@ const HashtagPage = () => {
|
||||
const { id } = useParams();
|
||||
const filterDifficulty = DEFAULT_DIFFICULTY;
|
||||
const { processedEvents } = useProcessedEvents(id as string, filterDifficulty);
|
||||
const [visibleEvents, setVisibleEvents] = useState(10);
|
||||
const [isAnimating, setIsAnimating] = useState(true);
|
||||
|
||||
const handleScroll = () => {
|
||||
if (window.innerHeight + window.scrollY >= document.body.offsetHeight) {
|
||||
setVisibleEvents((prev) => prev + 10);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(() => {
|
||||
setIsAnimating(false);
|
||||
}, 4000);
|
||||
|
||||
window.addEventListener("scroll", handleScroll);
|
||||
return () => window.removeEventListener("scroll", handleScroll);
|
||||
}, []);
|
||||
|
||||
// Render the component
|
||||
return (
|
||||
@ -18,15 +36,14 @@ const HashtagPage = () => {
|
||||
<NewNoteCard hashtag={id as string} />
|
||||
<HashtagBar />
|
||||
</div>
|
||||
<div className="grid grid-cols-1 max-w-xl mx-auto gap-1 px-4">
|
||||
{processedEvents.map((event) =>
|
||||
<div className={`grid grid-cols-1 max-w-xl mx-auto gap-1 ${isAnimating ? 'animate-pulse' : ''}`}>
|
||||
{processedEvents.slice(0, visibleEvents).map((event) =>
|
||||
<PostCard
|
||||
key={event.postEvent.id}
|
||||
event={event.postEvent}
|
||||
metadata={event.metadataEvent}
|
||||
replies={event.replies}
|
||||
/>
|
||||
|
||||
)}
|
||||
</div>
|
||||
</main>
|
||||
|
@ -12,13 +12,24 @@ const Home = () => {
|
||||
|
||||
const { processedEvents } = useProcessedEvents(undefined, filterDifficulty);
|
||||
const [isAnimating, setIsAnimating] = useState(true);
|
||||
const [visibleEvents, setVisibleEvents] = useState(10);
|
||||
|
||||
const handleScroll = () => {
|
||||
if (window.innerHeight + window.scrollY >= document.body.offsetHeight) {
|
||||
setVisibleEvents((prev) => prev + 10);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(() => {
|
||||
setIsAnimating(false);
|
||||
}, 4000);
|
||||
|
||||
return () => clearTimeout(timer);
|
||||
window.addEventListener("scroll", handleScroll);
|
||||
return () => {
|
||||
clearTimeout(timer);
|
||||
window.removeEventListener("scroll", handleScroll);
|
||||
};
|
||||
}, []);
|
||||
|
||||
// Render the component
|
||||
@ -29,7 +40,7 @@ const Home = () => {
|
||||
<HashtagBar />
|
||||
</div>
|
||||
<div className={`grid grid-cols-1 max-w-xl mx-auto gap-1 ${isAnimating ? 'animate-pulse' : ''}`}>
|
||||
{processedEvents.map((event) => (
|
||||
{processedEvents.slice(0, visibleEvents).map((event) => (
|
||||
<PostCard
|
||||
key={event.postEvent.id}
|
||||
event={event.postEvent}
|
||||
|
@ -12,6 +12,7 @@ import ThreadPostModal from '../forms/ThreadPostModal';
|
||||
const Thread = () => {
|
||||
const { id } = useParams();
|
||||
const [prevMentions, setPrevMentions] = useState<Event[]>([]);
|
||||
const [visibleReplyEvents, setVisibleReplyEvents] = useState(10);
|
||||
let decodeResult = nip19.decode(id as string);
|
||||
let hexID = decodeResult.data as string;
|
||||
const { noteEvents, metadataEvents } = useFetchEvents(undefined,false,hexID);
|
||||
@ -39,6 +40,17 @@ const Thread = () => {
|
||||
}
|
||||
}, [OPEvent]);
|
||||
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
if (window.innerHeight + window.scrollY >= document.body.offsetHeight) {
|
||||
setVisibleReplyEvents((prev) => prev + 10);
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener("scroll", handleScroll);
|
||||
return () => window.removeEventListener("scroll", handleScroll);
|
||||
}, []);
|
||||
|
||||
if (OPEvent) {
|
||||
const uniqEvents = uniqBy(prevMentions, "id");
|
||||
const earlierEvents = uniqEvents
|
||||
@ -68,7 +80,7 @@ const Thread = () => {
|
||||
<ThreadPostModal OPEvent={OPEvent} />
|
||||
<div className="col-span-full h-0.5 bg-neutral-900 mb-2"/> {/* This is the white line separator */}
|
||||
<div className="grid grid-cols-1 max-w-xl mx-auto gap-1">
|
||||
{replyEvents.map((event: Event) => (
|
||||
{replyEvents.slice(0, visibleReplyEvents).map((event: Event) => (
|
||||
<div className={`w-11/12 ${event.tags.find(tag => tag[0] === 'e' && tag[1] !== OPEvent.id) ? 'ml-auto' : 'mr-auto'}`}>
|
||||
<PostCard
|
||||
key={event.id}
|
||||
|
@ -292,7 +292,7 @@ export const subHashtagFeed = (
|
||||
filter: {
|
||||
"#t": [hashtag],
|
||||
kinds: [1],
|
||||
since: Math.floor(now - (3 * 60 * 60)),
|
||||
since: Math.floor(now - (24 * 60 * 60)),
|
||||
limit: 20,
|
||||
},
|
||||
unsub: true
|
||||
|
Loading…
Reference in New Issue
Block a user