src/shared/components/person-listing.tsx

   1 import { Component } from "inferno";
   2 import { Link } from "inferno-router";
   3 import { PersonSafe } from "lemmy-js-client";
   4 import { showAvatars, hostname, isCakeDay } from "../utils";
   5 import { CakeDay } from "./cake-day";
   6 import { PictrsImage } from "./pictrs-image";
   7
   8 interface PersonListingProps {
   9   person: PersonSafe;
  10   realLink?: boolean;
  11   useApubName?: boolean;
  12   muted?: boolean;
  13   hideAvatar?: boolean;
  14   showApubName?: boolean;
  15 }
  16
  17 export class PersonListing extends Component<PersonListingProps, any> {
  18   constructor(props: any, context: any) {
  19     super(props, context);
  20   }
  21
  22   render() {
  23     let person = this.props.person;
  24     let local = person.local == null ? true : person.local;
  25     let apubName: string, link: string;
  26
  27     if (local) {
  28       apubName = `@${person.name}`;
  29       link = `/u/${person.name}`;
  30     } else {
  31       apubName = `@${person.name}@${hostname(person.actor_id)}`;
  32       link = !this.props.realLink ? `/user/${person.id}` : person.actor_id;
  33     }
  34
  35     let displayName = this.props.useApubName
  36       ? apubName
  37       : person.display_name
  38       ? person.display_name
  39       : apubName;
  40
  41     if (this.props.showApubName && !local && person.display_name) {
  42       displayName = `${displayName} (${apubName})`;
  43     }
  44
  45     return (
  46       <>
  47         <Link
  48           title={apubName}
  49           className={this.props.muted ? "text-muted" : "text-info"}
  50           to={link}
  51         >
  52           {!this.props.hideAvatar && person.avatar && showAvatars() && (
  53             <PictrsImage src={person.avatar} icon />
  54           )}
  55           <span>{displayName}</span>
  56         </Link>
  57
  58         {isCakeDay(person.published) && <CakeDay creatorName={apubName} />}
  59       </>
  60     );
  61   }
  62 }