Kieran/snort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: upgrade caches to worker

Browse Source
This commit is contained in:
Kieran
2024-01-17 15:47:01 +00:00
parent 3c808688f8
commit aa58ec4185
32 changed files with 698 additions and 417 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/app/src/Pages/Layout/HasNotificationsMarker.tsx
View File

@ -1,14 +1,11 @@
import { useMemo, useSyncExternalStore } from "react";
import { useMemo } from "react";
import { Notifications } from "@/Cache";
import { useNotificationsView } from "@/Feed/WorkerRelayView";
import useLogin from "@/Hooks/useLogin";
export function HasNotificationsMarker() {
const readNotifications = useLogin(s => s.readNotifications);
const notifications = useSyncExternalStore(
c => Notifications.hook(c, "*"),
() => Notifications.snapshot(),
);
const notifications = useNotificationsView();
const latestNotification = useMemo(
() => notifications.reduce((acc, v) => (v.created_at > acc ? v.created_at : acc), 0),
[notifications],

146
packages/app/src/Pages/Notifications/NotificationGroup.tsx Normal file
View File

@ -0,0 +1,146 @@
import { unwrap } from "@snort/shared";
import { EventKind, NostrLink, parseZap, TaggedNostrEvent } from "@snort/system";
import { useUserProfile } from "@snort/system-react";
import { useMemo } from "react";
import { useInView } from "react-intersection-observer";
import { FormattedMessage, useIntl } from "react-intl";
import { useNavigate } from "react-router-dom";
import Icon from "@/Components/Icons/Icon";
import ProfileImage from "@/Components/User/ProfileImage";
import { dedupe, getDisplayName } from "@/Utils";
import { formatShort } from "@/Utils/Number";
import { notificationContext } from "./notificationContext";
import { NotificationContext } from "./Notifications";
export function NotificationGroup({ evs, onClick }: { evs: Array<TaggedNostrEvent>; onClick?: (link: NostrLink) => void; }) {
const { ref, inView } = useInView({ triggerOnce: true });
const { formatMessage } = useIntl();
const kind = evs[0].kind;
const navigate = useNavigate();
const zaps = useMemo(() => {
return evs.filter(a => a.kind === EventKind.ZapReceipt).map(a => parseZap(a));
}, [evs]);
const pubkeys = dedupe(
evs.map(a => {
if (a.kind === EventKind.ZapReceipt) {
const zap = unwrap(zaps.find(b => b.id === a.id));
return zap.anonZap ? "anon" : zap.sender ?? a.pubkey;
}
return a.pubkey;
})
);
const firstPubkey = pubkeys[0];
const firstPubkeyProfile = useUserProfile(inView ? (firstPubkey === "anon" ? "" : firstPubkey) : "");
const context = notificationContext(evs[0]);
const totalZaps = zaps.reduce((acc, v) => acc + v.amount, 0);
const iconName = () => {
switch (kind) {
case EventKind.Reaction:
return "heart-solid";
case EventKind.ZapReceipt:
return "zap-solid";
case EventKind.Repost:
return "repeat";
case EventKind.TextNote:
return "reverse-left";
}
return "";
};
const actionName = (n: number, name: string) => {
switch (kind) {
case EventKind.TextNote: {
return "";
}
case EventKind.Reaction: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} liked} other{{name} & {n} others liked}}"
id="kuPHYE"
values={{
n,
name,
}} />
);
}
case EventKind.Repost: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} reposted} other{{name} & {n} others reposted}}"
id="kJYo0u"
values={{
n,
name,
}} />
);
}
case EventKind.ZapReceipt: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} zapped} other{{name} & {n} others zapped}}"
id="Lw+I+J"
values={{
n,
name,
}} />
);
}
}
return `${kind}'d your post`;
};
return (
<div className="card notification-group" ref={ref}>
{inView && (
<>
<div className="flex flex-col g12">
<div>
<Icon name={iconName()} size={24} className={iconName()} />
</div>
<div>{kind === EventKind.ZapReceipt && formatShort(totalZaps)}</div>
</div>
<div className="flex flex-col w-max g12">
<div className="flex">
{pubkeys
.filter(a => a !== "anon")
.slice(0, 12)
.map(v => (
<ProfileImage
key={v}
showUsername={kind === EventKind.TextNote}
pubkey={v}
size={40}
overrideUsername={v === "" ? formatMessage({ defaultMessage: "Anon", id: "bfvyfs" }) : undefined} />
))}
</div>
{kind !== EventKind.TextNote && (
<div className="names">
{actionName(
pubkeys.length - 1,
firstPubkey === "anon"
? formatMessage({ defaultMessage: "Anon", id: "bfvyfs" })
: getDisplayName(firstPubkeyProfile, firstPubkey)
)}
</div>
)}
{context && (
<NotificationContext
link={context}
onClick={() => {
if (onClick) {
onClick(context);
} else {
navigate(`/${context.encode(CONFIG.eventLinkPrefix)}`);
}
}} />
)}
</div>
</>
)}
</div>
);
}

206
packages/app/src/Pages/Notifications/Notifications.tsx
View File

@ -1,75 +1,35 @@
import "./Notifications.css";
import { unwrap } from "@snort/shared";
import { EventExt, EventKind, NostrEvent, NostrLink, NostrPrefix, parseZap, TaggedNostrEvent } from "@snort/system";
import { useEventFeed, useUserProfile } from "@snort/system-react";
import { lazy, Suspense, useEffect, useMemo, useState, useSyncExternalStore } from "react";
import { useInView } from "react-intersection-observer";
import { FormattedMessage, useIntl } from "react-intl";
import { useNavigate } from "react-router-dom";
import { EventKind, NostrEvent, NostrLink, NostrPrefix, TaggedNostrEvent } from "@snort/system";
import { useEventFeed } from "@snort/system-react";
import { lazy, Suspense, useEffect, useMemo } from "react";
import { Notifications } from "@/Cache";
import { ShowMoreInView } from "@/Components/Event/ShowMore";
import Icon from "@/Components/Icons/Icon";
import { LiveEvent } from "@/Components/LiveStream/LiveEvent";
import PageSpinner from "@/Components/PageSpinner";
import Text from "@/Components/Text/Text";
import ProfileImage from "@/Components/User/ProfileImage";
import ProfilePreview from "@/Components/User/ProfilePreview";
import { useNotificationsView } from "@/Feed/WorkerRelayView";
import useLogin from "@/Hooks/useLogin";
import useModeration from "@/Hooks/useModeration";
import { dedupe, getDisplayName, orderDescending } from "@/Utils";
import { orderDescending } from "@/Utils";
import { markNotificationsRead } from "@/Utils/Login";
import { formatShort } from "@/Utils/Number";
const NotificationGraph = lazy(() => import("@/Pages/Notifications/NotificationChart"));
function notificationContext(ev: TaggedNostrEvent) {
switch (ev.kind) {
case EventKind.ZapReceipt: {
const aTag = ev.tags.find(a => a[0] === "a");
if (aTag) {
return NostrLink.fromTag(aTag);
}
const eTag = ev.tags.find(a => a[0] === "e");
if (eTag) {
return NostrLink.fromTag(eTag);
}
const pTag = ev.tags.find(a => a[0] === "p");
if (pTag) {
return NostrLink.fromTag(pTag);
}
break;
}
case EventKind.Repost:
case EventKind.Reaction: {
const thread = EventExt.extractThread(ev);
const tag = unwrap(thread?.replyTo ?? thread?.root ?? { value: ev.id, key: "e" });
if (tag.key === "e" || tag.key === "a") {
return NostrLink.fromThreadTag(tag);
} else {
throw new Error("Unknown thread context");
}
}
case EventKind.TextNote: {
return NostrLink.fromEvent(ev);
}
}
}
import { notificationContext } from "./notificationContext";
import { NotificationGroup } from "./NotificationGroup";
const NotificationGraph = lazy(() => import("@/Pages/Notifications/NotificationChart"));
export default function NotificationsPage({ onClick }: { onClick?: (link: NostrLink) => void }) {
const login = useLogin();
const { isMuted } = useModeration();
const groupInterval = 3600 * 3;
const [showN, setShowN] = useState(10);
const groupInterval = 3600 * 6;
useEffect(() => {
markNotificationsRead(login);
}, []);
const notifications = useSyncExternalStore(
c => Notifications.hook(c, "*"),
() => Notifications.snapshot(),
);
const notifications = useNotificationsView();
const timeKey = (ev: NostrEvent) => {
const onHour = ev.created_at - (ev.created_at % groupInterval);
@ -84,9 +44,8 @@ export default function NotificationsPage({ onClick }: { onClick?: (link: NostrL
const timeGrouped = useMemo(() => {
return myNotifications.reduce((acc, v) => {
const key = `${timeKey(v)}:${notificationContext(v as TaggedNostrEvent)?.encode(CONFIG.eventLinkPrefix)}:${
v.kind
}`;
const key = `${timeKey(v)}:${notificationContext(v as TaggedNostrEvent)?.encode(CONFIG.eventLinkPrefix)}:${v.kind
}`;
if (acc.has(key)) {
unwrap(acc.get(key)).push(v as TaggedNostrEvent);
} else {
@ -106,152 +65,15 @@ export default function NotificationsPage({ onClick }: { onClick?: (link: NostrL
)}
{login.publicKey &&
[...timeGrouped.entries()]
.slice(0, showN)
.map(([k, g]) => <NotificationGroup key={k} evs={g} onClick={onClick} />)}
<ShowMoreInView onClick={() => setShowN(s => Math.min(timeGrouped.size, s + 5))} />
<ShowMoreInView onClick={() => {}} />
</div>
</>
);
}
function NotificationGroup({ evs, onClick }: { evs: Array<TaggedNostrEvent>; onClick?: (link: NostrLink) => void }) {
const { ref, inView } = useInView({ triggerOnce: true });
const { formatMessage } = useIntl();
const kind = evs[0].kind;
const navigate = useNavigate();
const zaps = useMemo(() => {
return evs.filter(a => a.kind === EventKind.ZapReceipt).map(a => parseZap(a));
}, [evs]);
const pubkeys = dedupe(
evs.map(a => {
if (a.kind === EventKind.ZapReceipt) {
const zap = unwrap(zaps.find(b => b.id === a.id));
return zap.anonZap ? "anon" : zap.sender ?? a.pubkey;
}
return a.pubkey;
}),
);
const firstPubkey = pubkeys[0];
const firstPubkeyProfile = useUserProfile(inView ? (firstPubkey === "anon" ? "" : firstPubkey) : "");
const context = notificationContext(evs[0]);
const totalZaps = zaps.reduce((acc, v) => acc + v.amount, 0);
const iconName = () => {
switch (kind) {
case EventKind.Reaction:
return "heart-solid";
case EventKind.ZapReceipt:
return "zap-solid";
case EventKind.Repost:
return "repeat";
case EventKind.TextNote:
return "reverse-left";
}
return "";
};
const actionName = (n: number, name: string) => {
switch (kind) {
case EventKind.TextNote: {
return "";
}
case EventKind.Reaction: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} liked} other{{name} & {n} others liked}}"
id="kuPHYE"
values={{
n,
name,
}}
/>
);
}
case EventKind.Repost: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} reposted} other{{name} & {n} others reposted}}"
id="kJYo0u"
values={{
n,
name,
}}
/>
);
}
case EventKind.ZapReceipt: {
return (
<FormattedMessage
defaultMessage="{n,plural,=0{{name} zapped} other{{name} & {n} others zapped}}"
id="Lw+I+J"
values={{
n,
name,
}}
/>
);
}
}
return `${kind}'d your post`;
};
return (
<div className="card notification-group" ref={ref}>
{inView && (
<>
<div className="flex flex-col g12">
<div>
<Icon name={iconName()} size={24} className={iconName()} />
</div>
<div>{kind === EventKind.ZapReceipt && formatShort(totalZaps)}</div>
</div>
<div className="flex flex-col w-max g12">
<div className="flex">
{pubkeys
.filter(a => a !== "anon")
.slice(0, 12)
.map(v => (
<ProfileImage
key={v}
showUsername={kind === EventKind.TextNote}
pubkey={v}
size={40}
overrideUsername={v === "" ? formatMessage({ defaultMessage: "Anon", id: "bfvyfs" }) : undefined}
/>
))}
</div>
{kind !== EventKind.TextNote && (
<div className="names">
{actionName(
pubkeys.length - 1,
firstPubkey === "anon"
? formatMessage({ defaultMessage: "Anon", id: "bfvyfs" })
: getDisplayName(firstPubkeyProfile, firstPubkey),
)}
</div>
)}
{context && (
<NotificationContext
link={context}
onClick={() => {
if (onClick) {
onClick(context);
} else {
navigate(`/${context.encode(CONFIG.eventLinkPrefix)}`);
}
}}
/>
)}
</div>
</>
)}
</div>
);
}
function NotificationContext({ link, onClick }: { link: NostrLink; onClick: () => void }) {
export function NotificationContext({ link, onClick }: { link: NostrLink; onClick: () => void }) {
const ev = useEventFeed(link);
if (link.type === NostrPrefix.PublicKey) {
return <ProfilePreview pubkey={link.id} actions={<></>} />;

35
packages/app/src/Pages/Notifications/notificationContext.tsx Normal file
View File

@ -0,0 +1,35 @@
import { unwrap } from "@snort/shared";
import { EventExt, EventKind, NostrLink, TaggedNostrEvent } from "@snort/system";
export function notificationContext(ev: TaggedNostrEvent) {
switch (ev.kind) {
case EventKind.ZapReceipt: {
const aTag = ev.tags.find(a => a[0] === "a");
if (aTag) {
return NostrLink.fromTag(aTag);
}
const eTag = ev.tags.find(a => a[0] === "e");
if (eTag) {
return NostrLink.fromTag(eTag);
}
const pTag = ev.tags.find(a => a[0] === "p");
if (pTag) {
return NostrLink.fromTag(pTag);
}
break;
}
case EventKind.Repost:
case EventKind.Reaction: {
const thread = EventExt.extractThread(ev);
const tag = unwrap(thread?.replyTo ?? thread?.root ?? { value: ev.id, key: "e" });
if (tag.key === "e" || tag.key === "a") {
return NostrLink.fromThreadTag(tag);
} else {
throw new Error("Unknown thread context");
}
}
case EventKind.TextNote: {
return NostrLink.fromEvent(ev);
}
}
}

50
packages/app/src/Pages/settings/Cache.tsx
View File

@ -1,20 +1,16 @@
import { FeedCache } from "@snort/shared";
import { ReactNode, useSyncExternalStore } from "react";
import { ReactNode, useEffect, useState, useSyncExternalStore } from "react";
import { FormattedMessage, FormattedNumber } from "react-intl";
import {
Chats,
FollowLists,
FollowsFeed,
GiftsCache,
InteractionCache,
Notifications,
PaymentsCache,
RelayMetrics,
UserCache,
UserRelays,
} from "@/Cache";
import AsyncButton from "@/Components/Button/AsyncButton";
import { Relay } from "@/system";
export function CacheSettings() {
return (
@ -22,16 +18,12 @@ export function CacheSettings() {
<h3>
<FormattedMessage defaultMessage="Cache" id="DBiVK1" />
</h3>
<RelayCacheStats />
<CacheDetails cache={UserCache} name={<FormattedMessage defaultMessage="Profiles" id="2zJXeA" />} />
<CacheDetails cache={UserRelays} name={<FormattedMessage defaultMessage="Relay Lists" id="tGXF0Q" />} />
<CacheDetails cache={Notifications} name={<FormattedMessage defaultMessage="Notifications" id="NAidKb" />} />
<CacheDetails cache={FollowsFeed} name={<FormattedMessage defaultMessage="Follows Feed" id="uKqSN+" />} />
<CacheDetails cache={Chats} name={<FormattedMessage defaultMessage="Chats" id="ABAQyo" />} />
<CacheDetails cache={RelayMetrics} name={<FormattedMessage defaultMessage="Relay Metrics" id="tjpYlr" />} />
<CacheDetails cache={PaymentsCache} name={<FormattedMessage defaultMessage="Payments" id="iYc3Ld" />} />
<CacheDetails cache={InteractionCache} name={<FormattedMessage defaultMessage="Interactions" id="u+LyXc" />} />
<CacheDetails cache={GiftsCache} name={<FormattedMessage defaultMessage="Gift Wraps" id="fjAcWo" />} />
<CacheDetails cache={FollowLists} name={<FormattedMessage defaultMessage="Social Graph" id="CzHZoc" />} />
</div>
);
}
@ -65,3 +57,39 @@ function CacheDetails<T>({ cache, name }: { cache: FeedCache<T>; name: ReactNode
</div>
);
}
function RelayCacheStats() {
const [counts, setCounts] = useState<Record<string, number>>({});
useEffect(() => {
Relay.summary().then(setCounts);
}, []);
return (
<div className="flex justify-between br p bg-superdark">
<div className="flex flex-col g4">
<FormattedMessage defaultMessage="Worker Relay" id="xSoIUU" />
{Object.entries(counts).map(([k, v]) => {
return <small key={k}>
<FormattedMessage
defaultMessage="{n} kind {k} events"
id="I97cCX"
values={{
n: <FormattedNumber value={v} />,
k: k
}}
/>
</small>
})}
</div>
<div>
<AsyncButton onClick={() => {
}}>
<FormattedMessage defaultMessage="Clear" id="/GCoTA" />
</AsyncButton>
</div>
</div>
);
}