62 lines
1.8 KiB
TypeScript
62 lines
1.8 KiB
TypeScript
import "./Root.css";
|
|
import { useState } from "react";
|
|
import { useSelector } from "react-redux";
|
|
import { Link } from "react-router-dom";
|
|
|
|
import Tabs, { Tab } from "Element/Tabs";
|
|
import { RootState } from "State/Store";
|
|
import Timeline from "Element/Timeline";
|
|
import { HexKey } from "Nostr";
|
|
import { TimelineSubject } from "Feed/TimelineFeed";
|
|
|
|
const RootTab: Record<string, Tab> = {
|
|
Posts: { text: "Posts", value: 0 },
|
|
PostsAndReplies: { text: "Conversations", value: 1 },
|
|
Global: { text: "Global", value: 2 },
|
|
};
|
|
|
|
export default function RootPage() {
|
|
const [loggedOut, pubKey, follows] = useSelector<
|
|
RootState,
|
|
[boolean | undefined, HexKey | undefined, HexKey[]]
|
|
>((s) => [s.login.loggedOut, s.login.publicKey, s.login.follows]);
|
|
const [tab, setTab] = useState<Tab>(RootTab.Posts);
|
|
|
|
function followHints() {
|
|
if (follows?.length === 0 && pubKey && tab !== RootTab.Global) {
|
|
return (
|
|
<>
|
|
Hmm nothing here.. Checkout <Link to={"/new"}>New users page</Link> to
|
|
follow some recommended nostrich's!
|
|
</>
|
|
);
|
|
}
|
|
}
|
|
|
|
const isGlobal = loggedOut || tab.value === RootTab.Global.value;
|
|
const timelineSubect: TimelineSubject = isGlobal
|
|
? { type: "global", items: [], discriminator: "all" }
|
|
: { type: "pubkey", items: follows, discriminator: "follows" };
|
|
return (
|
|
<>
|
|
<div className="main-content">
|
|
{pubKey && (
|
|
<Tabs
|
|
tabs={[RootTab.Posts, RootTab.PostsAndReplies, RootTab.Global]}
|
|
tab={tab}
|
|
setTab={setTab}
|
|
/>
|
|
)}
|
|
</div>
|
|
{followHints()}
|
|
<Timeline
|
|
key={tab.value}
|
|
subject={timelineSubect}
|
|
postsOnly={tab.value === RootTab.Posts.value}
|
|
method={"TIME_RANGE"}
|
|
window={tab.value === RootTab.Global.value ? 60 : undefined}
|
|
/>
|
|
</>
|
|
);
|
|
}
|