2023-11-02 01:57:04 +00:00
|
|
|
import { useEffect, useState } from "react";
|
|
|
|
import PostCard from "./PostCard/PostCard";
|
|
|
|
import NewThreadCard from "./PostCard/NewThreadCard";
|
|
|
|
import { getPow } from "../utils/mine";
|
|
|
|
import { Event } from "nostr-tools";
|
|
|
|
import { subGlobalFeed } from "../utils/subscriptions";
|
|
|
|
import { uniqBy } from "../utils/utils";
|
|
|
|
import PWAInstallPopup from "./Modals/PWACheckModal";
|
2023-09-02 07:24:30 +00:00
|
|
|
|
2023-09-15 15:56:25 +00:00
|
|
|
const Home = () => {
|
2023-09-24 13:22:51 +00:00
|
|
|
const [events, setEvents] = useState<Event[]>([]);
|
2023-11-02 01:57:04 +00:00
|
|
|
const [filterDifficulty, setFilterDifficulty] = useState(
|
|
|
|
localStorage.getItem("filterDifficulty") || "20"
|
|
|
|
);
|
|
|
|
const [inBrowser, setInBrowser] = useState(false);
|
2023-09-02 07:24:30 +00:00
|
|
|
|
2023-09-24 13:22:51 +00:00
|
|
|
const onEvent = (event: Event) => {
|
2023-09-15 15:56:25 +00:00
|
|
|
setEvents((prevEvents) => [...prevEvents, event]);
|
|
|
|
};
|
2023-09-15 07:06:37 +00:00
|
|
|
|
2023-09-15 15:56:25 +00:00
|
|
|
useEffect(() => {
|
|
|
|
subGlobalFeed(onEvent);
|
2023-09-24 13:22:51 +00:00
|
|
|
// If you eventually need a cleanup function, put it here
|
2023-10-30 04:58:33 +00:00
|
|
|
|
|
|
|
const handleDifficultyChange = (event: any) => {
|
|
|
|
const customEvent = event as CustomEvent;
|
|
|
|
const { difficulty, filterDifficulty } = customEvent.detail;
|
|
|
|
setFilterDifficulty(filterDifficulty);
|
|
|
|
};
|
2023-11-01 02:34:17 +00:00
|
|
|
|
|
|
|
// if ((window.navigator as any).standalone || window.matchMedia('(display-mode: standalone)').matches) {
|
|
|
|
// console.log('App is running in standalone mode.');
|
|
|
|
// } else {
|
|
|
|
// console.log('App is running in a browser.');
|
2023-11-02 01:57:04 +00:00
|
|
|
// setInBrowser(true)
|
2023-11-01 02:34:17 +00:00
|
|
|
// }
|
2023-11-02 01:57:04 +00:00
|
|
|
|
|
|
|
window.addEventListener("difficultyChanged", handleDifficultyChange);
|
|
|
|
|
2023-10-30 04:58:33 +00:00
|
|
|
return () => {
|
2023-11-02 01:57:04 +00:00
|
|
|
window.removeEventListener("difficultyChanged", handleDifficultyChange);
|
2023-10-30 04:58:33 +00:00
|
|
|
};
|
2023-09-24 13:22:51 +00:00
|
|
|
}, []);
|
2023-09-02 07:24:30 +00:00
|
|
|
|
2023-09-15 15:56:25 +00:00
|
|
|
const uniqEvents = events.length > 0 ? uniqBy(events, "id") : [];
|
2023-11-02 01:57:04 +00:00
|
|
|
|
2023-09-24 13:22:51 +00:00
|
|
|
const filteredAndSortedEvents = uniqEvents
|
2023-11-02 01:57:04 +00:00
|
|
|
.filter(
|
|
|
|
(event) =>
|
|
|
|
getPow(event.id) > Number(filterDifficulty) &&
|
|
|
|
event.kind === 1 &&
|
|
|
|
!event.tags.some((tag) => tag[0] === "e")
|
2023-09-24 13:22:51 +00:00
|
|
|
)
|
|
|
|
.sort((a, b) => (b.created_at as any) - (a.created_at as any));
|
|
|
|
|
|
|
|
const getMetadataEvent = (event: Event) => {
|
2023-11-02 01:57:04 +00:00
|
|
|
const metadataEvent = uniqEvents.find(
|
|
|
|
(e) => e.pubkey === event.pubkey && e.kind === 0
|
|
|
|
);
|
2023-09-24 13:22:51 +00:00
|
|
|
if (metadataEvent) {
|
|
|
|
return metadataEvent;
|
|
|
|
}
|
|
|
|
return null;
|
2023-11-02 01:57:04 +00:00
|
|
|
};
|
2023-09-24 13:22:51 +00:00
|
|
|
|
|
|
|
const countReplies = (event: Event) => {
|
2023-11-02 01:57:04 +00:00
|
|
|
return uniqEvents.filter((e) =>
|
|
|
|
e.tags.some((tag) => tag[0] === "e" && tag[1] === event.id)
|
|
|
|
).length;
|
|
|
|
};
|
2023-09-02 07:24:30 +00:00
|
|
|
|
|
|
|
return (
|
2023-11-02 01:57:04 +00:00
|
|
|
<main className="text-white mb-20">
|
2023-11-01 02:34:17 +00:00
|
|
|
{/* {inBrowser && <PWAInstallPopup onClose={() => setInBrowser(false)} />} */}
|
2023-11-02 12:58:13 +00:00
|
|
|
<div className="w-full px-4 sm:px-0 sm:max-w-xl mx-auto my-2">
|
2023-09-03 13:04:25 +00:00
|
|
|
<NewThreadCard />
|
2023-11-02 01:57:04 +00:00
|
|
|
</div>
|
2023-11-02 12:58:13 +00:00
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
|
2023-11-02 01:57:04 +00:00
|
|
|
{filteredAndSortedEvents.map((event) => (
|
|
|
|
<PostCard
|
|
|
|
key={event.id}
|
|
|
|
event={event}
|
|
|
|
metadata={getMetadataEvent(event)}
|
|
|
|
replyCount={countReplies(event)}
|
|
|
|
/>
|
2023-09-02 07:24:30 +00:00
|
|
|
))}
|
|
|
|
</div>
|
2023-09-03 12:46:07 +00:00
|
|
|
</main>
|
2023-09-02 07:24:30 +00:00
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default Home;
|