forked from Kieran/snort
followed by foafs
This commit is contained in:
parent
062212f311
commit
35d7ec4685
@ -1,7 +1,7 @@
|
||||
import "./LinkPreview.css";
|
||||
|
||||
import { CSSProperties, useEffect, useState } from "react";
|
||||
import { LRUCache } from 'typescript-lru-cache';
|
||||
import { LRUCache } from "typescript-lru-cache";
|
||||
|
||||
import { MediaElement } from "@/Components/Embed/MediaElement";
|
||||
import Spinner from "@/Components/Icons/Spinner";
|
||||
|
@ -12,10 +12,10 @@ import { DisplayAs, DisplayAsSelector } from "@/Components/Feed/DisplayAsSelecto
|
||||
import { TimelineRenderer } from "@/Components/Feed/TimelineRenderer";
|
||||
import { LiveStreams } from "@/Components/LiveStream/LiveStreams";
|
||||
import useHashtagsFeed from "@/Feed/HashtagsFeed";
|
||||
import useHistoryState from "@/Hooks/useHistoryState";
|
||||
import useLogin from "@/Hooks/useLogin";
|
||||
import useModeration from "@/Hooks/useModeration";
|
||||
import { dedupeByPubkey, findTag, orderDescending } from "@/Utils";
|
||||
import useHistoryState from "@/Hooks/useHistoryState";
|
||||
|
||||
export interface TimelineFollowsProps {
|
||||
postsOnly: boolean;
|
||||
@ -34,7 +34,7 @@ const TimelineFollows = (props: TimelineFollowsProps) => {
|
||||
const login = useLogin();
|
||||
const displayAsInitial = props.displayAs ?? login.feedDisplayAs ?? "list";
|
||||
const [displayAs, setDisplayAs] = useState<DisplayAs>(displayAsInitial);
|
||||
const [latest, setLatest] = useHistoryState(unixNow(), 'TimelineFollowsLatest');
|
||||
const [latest, setLatest] = useHistoryState(unixNow(), "TimelineFollowsLatest");
|
||||
const feed = useSyncExternalStore(
|
||||
cb => FollowsFeed.hook(cb, "*"),
|
||||
() => FollowsFeed.snapshot(),
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { socialGraphInstance } from "@snort/system";
|
||||
import { Fragment } from "react";
|
||||
import { HexKey, socialGraphInstance } from "@snort/system";
|
||||
import React, { Fragment, useMemo } from "react";
|
||||
import { FormattedMessage } from "react-intl";
|
||||
|
||||
import DisplayName from "@/Components/User/DisplayName";
|
||||
@ -9,52 +9,71 @@ import { ProfileLink } from "@/Components/User/ProfileLink";
|
||||
|
||||
const MAX_FOLLOWED_BY_FRIENDS = 3;
|
||||
|
||||
export default function FollowedBy({ pubkey }: { pubkey: string }) {
|
||||
const followedByFriends = socialGraphInstance.followedByFriends(pubkey);
|
||||
const followedByFriendsArray = Array.from(followedByFriends).slice(0, MAX_FOLLOWED_BY_FRIENDS);
|
||||
export default function FollowedBy({ pubkey }: { pubkey: HexKey }) {
|
||||
const followDistance = socialGraphInstance.getFollowDistance(pubkey);
|
||||
const { followedByFriendsArray, totalFollowedByFriends } = useMemo(() => {
|
||||
const followedByFriends = socialGraphInstance.followedByFriends(pubkey);
|
||||
return {
|
||||
followedByFriendsArray: Array.from(followedByFriends).slice(0, MAX_FOLLOWED_BY_FRIENDS),
|
||||
totalFollowedByFriends: followedByFriends.size,
|
||||
};
|
||||
}, [pubkey, followDistance]);
|
||||
|
||||
const renderFollowedByFriends = () => {
|
||||
return followedByFriendsArray.map((a, index) => (
|
||||
<div
|
||||
className={`inline-block ${index > 0 ? "-ml-5" : ""}`}
|
||||
key={a}
|
||||
style={{ zIndex: followedByFriendsArray.length - index }}>
|
||||
<ProfileImage showFollowDistance={false} pubkey={a} size={24} showUsername={false} />
|
||||
</div>
|
||||
));
|
||||
};
|
||||
|
||||
const renderFollowedByFriendsLinks = () => {
|
||||
return followedByFriendsArray.map((a, index) => (
|
||||
<Fragment key={a}>
|
||||
<ProfileLink pubkey={a} className="link inline">
|
||||
<DisplayName user={undefined} pubkey={a} />
|
||||
</ProfileLink>
|
||||
{index < followedByFriendsArray.length - 1 && ","}{" "}
|
||||
</Fragment>
|
||||
));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-row items-center">
|
||||
<div className="flex flex-row items-center">
|
||||
<FollowDistanceIndicator className="p-2" pubkey={pubkey} />
|
||||
{followedByFriendsArray.map((a, index) => {
|
||||
const zIndex = followedByFriendsArray.length - index;
|
||||
|
||||
return (
|
||||
<div className={`inline-block ${index > 0 ? "-ml-5" : ""}`} key={a} style={{ zIndex }}>
|
||||
<ProfileImage showFollowDistance={false} pubkey={a} size={24} showUsername={false} />
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
{renderFollowedByFriends()}
|
||||
</div>
|
||||
{followedByFriends.size > 0 && (
|
||||
{totalFollowedByFriends > 0 && (
|
||||
<div className="text-gray-light">
|
||||
<span className="mr-1">
|
||||
<FormattedMessage defaultMessage="Followed by" id="6mr8WU" />
|
||||
</span>
|
||||
{followedByFriendsArray.map((a, index) => (
|
||||
<Fragment key={a}>
|
||||
<ProfileLink pubkey={a} className="link inline">
|
||||
<DisplayName user={undefined} pubkey={a} />
|
||||
</ProfileLink>
|
||||
{index < followedByFriendsArray.length - 1 && ","}{" "}
|
||||
</Fragment>
|
||||
))}
|
||||
{followedByFriends.size > MAX_FOLLOWED_BY_FRIENDS && (
|
||||
{renderFollowedByFriendsLinks()}
|
||||
{totalFollowedByFriends > MAX_FOLLOWED_BY_FRIENDS && (
|
||||
<span>
|
||||
<FormattedMessage
|
||||
defaultMessage="and {count} others you follow"
|
||||
id="CYkOCI"
|
||||
values={{ count: followedByFriends.size - MAX_FOLLOWED_BY_FRIENDS }}
|
||||
values={{ count: totalFollowedByFriends - MAX_FOLLOWED_BY_FRIENDS }}
|
||||
/>
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{followedByFriends.size === 0 && (
|
||||
{followDistance > 3 && (
|
||||
<div className="text-gray-light">
|
||||
<FormattedMessage defaultMessage="Not followed by anyone you follow" id="IgsWFG" />
|
||||
</div>
|
||||
)}
|
||||
{followDistance === 3 && (
|
||||
<div className="text-gray-light">
|
||||
<FormattedMessage defaultMessage="Followed by friends of friends" id="2oCF7O" />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -23,9 +23,7 @@ const ErrorPage = () => {
|
||||
</AsyncButton>
|
||||
<h5>{error.message}</h5>
|
||||
<div className="my-2">{error.message}</div>
|
||||
<pre className="my-2 whitespace-pre-wrap">
|
||||
{error.stack}
|
||||
</pre>
|
||||
<pre className="my-2 whitespace-pre-wrap">{error.stack}</pre>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
@ -147,6 +147,9 @@
|
||||
"2mcwT8": {
|
||||
"defaultMessage": "New Note"
|
||||
},
|
||||
"2oCF7O": {
|
||||
"defaultMessage": "Followed by friends of friends"
|
||||
},
|
||||
"2ukA4d": {
|
||||
"defaultMessage": "{n} hours"
|
||||
},
|
||||
|
@ -26,7 +26,7 @@ registerRoute(
|
||||
maxEntries: 200,
|
||||
matchOptions: {
|
||||
ignoreVary: true,
|
||||
}
|
||||
},
|
||||
}),
|
||||
],
|
||||
}),
|
||||
@ -51,7 +51,7 @@ registerRoute(
|
||||
maxEntries: 200,
|
||||
matchOptions: {
|
||||
ignoreVary: true,
|
||||
}
|
||||
},
|
||||
}),
|
||||
],
|
||||
}),
|
||||
|
@ -48,6 +48,7 @@
|
||||
"2a2YiP": "{n} Bookmarks",
|
||||
"2k0Cv+": "Dislikes ({n})",
|
||||
"2mcwT8": "New Note",
|
||||
"2oCF7O": "Followed by friends of friends",
|
||||
"2ukA4d": "{n} hours",
|
||||
"2zJXeA": "Profiles",
|
||||
"39AHJm": "Sign Up",
|
||||
|
@ -19,9 +19,9 @@ export default defineConfig({
|
||||
type: "module",
|
||||
},
|
||||
workbox: {
|
||||
globPatterns: ['**/*.{js,html,wasm,woff,woff2,ttf,svg,png,jpg,jpeg,webp,ico,json}'],
|
||||
globPatterns: ["**/*.{js,html,wasm,woff,woff2,ttf,svg,png,jpg,jpeg,webp,ico,json}"],
|
||||
sourcemap: true,
|
||||
}
|
||||
},
|
||||
}),
|
||||
visualizer({
|
||||
open: true,
|
||||
|
Loading…
Reference in New Issue
Block a user