forked from Kieran/snort
smaller trending notes
This commit is contained in:
parent
e8abd5ac09
commit
468dc3bae6
19
packages/app/src/Element/Trending/ShortNote.tsx
Normal file
19
packages/app/src/Element/Trending/ShortNote.tsx
Normal file
@ -0,0 +1,19 @@
|
||||
import { NostrLink, TaggedNostrEvent } from "@snort/system";
|
||||
import ProfileImage from "@/Element/User/ProfileImage";
|
||||
import Text from "@/Element/Text";
|
||||
import { Link } from "react-router-dom";
|
||||
import NoteTime from "@/Element/Event/NoteTime";
|
||||
|
||||
export default function ShortNote({ event }: { event: TaggedNostrEvent }) {
|
||||
return (
|
||||
<Link to={`/${NostrLink.fromEvent(event).encode(CONFIG.eventLinkPrefix)}`} className="flex flex-col">
|
||||
<div className="flex flex-row justify-between">
|
||||
<ProfileImage pubkey={event.pubkey} size={32} showNip05={false} />
|
||||
<NoteTime from={event.created_at * 1000} />
|
||||
</div>
|
||||
<div className="ml-10">
|
||||
<Text {...event} truncate={75} />
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
}
|
@ -8,6 +8,8 @@ import NostrBandApi from "@/External/NostrBand";
|
||||
import { ErrorOrOffline } from "@/Element/ErrorOrOffline";
|
||||
import { useLocale } from "@/IntlProvider";
|
||||
import useModeration from "@/Hooks/useModeration";
|
||||
import ShortNote from "@/Element/Trending/ShortNote";
|
||||
import classNames from "classnames";
|
||||
|
||||
export default function TrendingNotes({ count = Infinity, small = false }) {
|
||||
// Added count prop with a default value
|
||||
@ -45,13 +47,17 @@ export default function TrendingNotes({ count = Infinity, small = false }) {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<div className={classNames("flex flex-col", { "gap-4": small, "py-4": small })}>
|
||||
{posts
|
||||
.filter(a => !isEventMuted(a))
|
||||
.slice(0, count) // Limit the number of posts displayed
|
||||
.map(e => (
|
||||
.map(e =>
|
||||
small ? (
|
||||
<ShortNote key={e.id} event={e as TaggedNostrEvent} />
|
||||
) : (
|
||||
<Note key={e.id} data={e as TaggedNostrEvent} related={related?.data ?? []} depth={0} options={options} />
|
||||
))}
|
||||
),
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -15,11 +15,11 @@ export default function RightColumn() {
|
||||
<SearchBox />
|
||||
</div>
|
||||
<div className="overflow-y-auto hide-scrollbar">
|
||||
<div className="bg-superdark rounded-lg py-4 px-2 mt-8">
|
||||
<div className="font-bold text-lg px-[12px]">
|
||||
<div className="bg-superdark rounded-lg p-4 mt-8 text-neutral-500">
|
||||
<div className="font-bold text-lg">
|
||||
<FormattedMessage defaultMessage="Trending notes" id="6k7xfM" />
|
||||
</div>
|
||||
<TrendingNotes small={true} count={5} />
|
||||
<TrendingNotes small={true} count={100} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user