Files
snort/packages/app/src/Element/User/DisplayName.tsx

43 lines
1.3 KiB
TypeScript

import "./DisplayName.css";
import { useMemo } from "react";
import { HexKey, UserMetadata, NostrPrefix } from "@snort/system";
import AnimalName from "Element/User/AnimalName";
import { hexToBech32 } from "SnortUtils";
interface DisplayNameProps {
pubkey: HexKey;
user: UserMetadata | undefined;
}
export function getDisplayName(user: UserMetadata | undefined, pubkey: HexKey): string {
return getDisplayNameOrPlaceHolder(user, pubkey)[0];
}
export function getDisplayNameOrPlaceHolder(user: UserMetadata | undefined, pubkey: HexKey): [string, boolean] {
let name = hexToBech32(NostrPrefix.PublicKey, pubkey).substring(0, 12);
let isPlaceHolder = false;
if (typeof user?.display_name === "string" && user.display_name.length > 0) {
name = user.display_name;
} else if (typeof user?.name === "string" && user.name.length > 0) {
name = user.name;
} else if (pubkey && CONFIG.animalNamePlaceholders) {
name = AnimalName(pubkey);
isPlaceHolder = true;
}
return [name.trim(), isPlaceHolder];
}
const DisplayName = ({ pubkey, user }: DisplayNameProps) => {
const [name, isPlaceHolder] = useMemo(() => getDisplayNameOrPlaceHolder(user, pubkey), [user, pubkey]);
if (isPlaceHolder) {
return <span className="placeholder">{name}</span>;
}
return name;
};
export default DisplayName;