stoat-for-desktop/components/modal/modals/UserProfileMutualFriends.tsx

43 lines
1.1 KiB
TypeScript

import { For } from "solid-js";
import { Trans } from "@lingui-solid/solid/macro";
import { Avatar, Dialog, DialogProps, List, OverflowingText } from "@revolt/ui";
import { useModals } from "..";
import { Modals } from "../types";
export function UserProfileMutualFriendsModal(
props: DialogProps & Modals & { type: "user_profile_mutual_friends" },
) {
const { openModal } = useModals();
return (
<Dialog
minWidth={420}
show={props.show}
onClose={props.onClose}
title={<Trans>Mutual Friends</Trans>}
actions={[{ text: <Trans>Close</Trans> }]}
>
<List>
<For each={props.users}>
{(user) => (
<List.Item
onClick={() => openModal({ type: "user_profile", user })}
>
<Avatar
slot="icon"
size={36}
src={user.animatedAvatarURL}
fallback={user.displayName}
/>
<OverflowingText>{user.username}</OverflowingText>
</List.Item>
)}
</For>
</List>
</Dialog>
);
}