Show users without metadata in filter lists

This commit is contained in:
Bojan Mojsilovic 2023-08-30 12:35:15 +02:00
parent a02cdc18c5
commit ed25bcc151
2 changed files with 35 additions and 15 deletions

View File

@ -5,7 +5,7 @@ import { APP_ID } from '../App';
import Avatar from '../components/Avatar/Avatar'; import Avatar from '../components/Avatar/Avatar';
import PageCaption from '../components/PageCaption/PageCaption'; import PageCaption from '../components/PageCaption/PageCaption';
import { algoNpub, Kind, specialAlgos } from '../constants'; import { algoNpub, Kind, specialAlgos } from '../constants';
import { npubToHex } from '../lib/keys'; import { hexToNpub, npubToHex } from '../lib/keys';
import { getCategorizedList, getFilterlists, getProfileMuteList, getUserProfileInfo, getUserProfiles } from '../lib/profile'; import { getCategorizedList, getFilterlists, getProfileMuteList, getUserProfileInfo, getUserProfiles } from '../lib/profile';
import { subscribeTo } from '../sockets'; import { subscribeTo } from '../sockets';
import { convertToUser, nip05Verification, userName } from '../stores/profile'; import { convertToUser, nip05Verification, userName } from '../stores/profile';
@ -30,7 +30,8 @@ const Mutelist: Component = () => {
const intl = useIntl(); const intl = useIntl();
const toast = useToastContext(); const toast = useToastContext();
const [mutedUsers, setMutedUsers] = createStore<PrimalUser[]>([]); const [mutedUsers, setMutedUsers] = createStore<Record<string,PrimalUser>>({});
const [mutedPubkeys, setMutedPubkeys] = createStore<string[]>([]);
const [author, setAuthor] = createSignal<PrimalUser>(); const [author, setAuthor] = createSignal<PrimalUser>();
const [isFetching, setIsFetching] = createSignal(true); const [isFetching, setIsFetching] = createSignal(true);
@ -40,17 +41,23 @@ const Mutelist: Component = () => {
const pubkey = npub.startsWith('npub') ? npubToHex(npub) : npub; const pubkey = npub.startsWith('npub') ? npubToHex(npub) : npub;
const random = Math.floor(Math.random() * 10_000); const random = Math.floor(Math.random() * 10_000);
const subId = `prl_${random}_${APP_ID}`; const subId = `prl_${random}_${APP_ID}`;
let users: PrimalUser[] = []; let pubkeys: string[] = [];
let users: Record<string, PrimalUser> = {};
const unsub = subscribeTo(subId, (type, _, response) => { const unsub = subscribeTo(subId, (type, _, response) => {
if (type === 'EVENT') { if (type === 'EVENT') {
if (response && [Kind.CategorizedPeople, Kind.MuteList].includes(response?.kind || 0)) {
// @ts-ignore
pubkeys = response.tags.reduce((acc, t) => t[0] === 'p' ? [...acc, t[1]] : acc, []);
}
if (response?.kind === Kind.Metadata) { if (response?.kind === Kind.Metadata) {
users.push(convertToUser(response)); users[response.pubkey] = convertToUser(response);
} }
} }
if (type === 'EOSE') { if (type === 'EOSE') {
setMutedUsers(() => [ ...users ]); setMutedPubkeys(() => [...pubkeys]);
setMutedUsers(() => ({ ...users }));
setIsFetching(false); setIsFetching(false);
unsub(); unsub();
} }
@ -87,6 +94,8 @@ const Mutelist: Component = () => {
getUserProfileInfo(pubkey, subId); getUserProfileInfo(pubkey, subId);
}; };
const user = (pubkey: string) => mutedUsers[pubkey];
createEffect(() => { createEffect(() => {
if (params.npub) { if (params.npub) {
getMutelist(params.npub); getMutelist(params.npub);
@ -134,7 +143,7 @@ const Mutelist: Component = () => {
<div> <div>
<For <For
each={mutedUsers} each={mutedPubkeys}
fallback={ fallback={
<Show when={!isFetching()}> <Show when={!isFetching()}>
<div class={styles.emptyListBanner}> <div class={styles.emptyListBanner}>
@ -143,15 +152,26 @@ const Mutelist: Component = () => {
</Show> </Show>
} }
> >
{user => ( {pubkey => (
<div class={styles.mutedUser}> <div class={styles.mutedUser}>
<Link class={styles.userInfo} href={`/p/${user.npub}`}> <Show
<Avatar src={user.picture} size='sm' /> when={user(pubkey)}
<div class={styles.userName}> fallback={
<div class={styles.title}>{userName(user)}</div> <Link class={styles.userInfo} href={`/p/${hexToNpub(pubkey)}`}>
<div class={styles.verification}>{nip05Verification(user)}</div> <div class={styles.userName}>
</div> <div class={styles.verification}>{hexToNpub(pubkey)}</div>
</Link> </div>
</Link>
}
>
<Link class={styles.userInfo} href={`/p/${user(pubkey).npub}`}>
<Avatar src={user(pubkey).picture} size='sm' />
<div class={styles.userName}>
<div class={styles.title}>{userName(user(pubkey))}</div>
<div class={styles.verification}>{nip05Verification(user(pubkey))}</div>
</div>
</Link>
</Show>
</div> </div>
)} )}
</For> </For>

View File

@ -146,8 +146,8 @@
display: flex; display: flex;
align-items: center; align-items: center;
text-decoration: none; text-decoration: none;
height: 36px;
.userName { .userName {
height: 36px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;