src/shared/components/community/community-link.tsx

   1 import { Component } from "inferno";
   2 import { Link } from "inferno-router";
   3 import { CommunitySafe } from "lemmy-js-client";
   4 import { hostname, showAvatars } from "../../utils";
   5 import { PictrsImage } from "../common/pictrs-image";
   6
   7 interface CommunityLinkProps {
   8   // TODO figure this out better
   9   community: CommunitySafe;
  10   realLink?: boolean;
  11   useApubName?: boolean;
  12   muted?: boolean;
  13   hideAvatar?: boolean;
  14 }
  15
  16 export class CommunityLink extends Component<CommunityLinkProps, any> {
  17   constructor(props: any, context: any) {
  18     super(props, context);
  19   }
  20
  21   render() {
  22     let community = this.props.community;
  23     let name_: string, title: string, link: string;
  24     let local = community.local == null ? true : community.local;
  25     if (local) {
  26       name_ = community.name;
  27       title = community.title;
  28       link = `/c/${community.name}`;
  29     } else {
  30       let domain = hostname(community.actor_id);
  31       name_ = `${community.name}@${domain}`;
  32       title = `${community.title}@${domain}`;
  33       link = !this.props.realLink ? `/c/${name_}` : community.actor_id;
  34     }
  35
  36     let apubName = `!${name_}`;
  37     let displayName = this.props.useApubName ? apubName : title;
  38     return !this.props.realLink ? (
  39       <Link
  40         title={apubName}
  41         className={`${this.props.muted ? "text-muted" : ""}`}
  42         to={link}
  43       >
  44         {this.avatarAndName(displayName)}
  45       </Link>
  46     ) : (
  47       <a
  48         title={apubName}
  49         className={`${this.props.muted ? "text-muted" : ""}`}
  50         href={link}
  51       >
  52         {this.avatarAndName(displayName)}
  53       </a>
  54     );
  55   }
  56
  57   avatarAndName(displayName: string) {
  58     let community = this.props.community;
  59     return (
  60       <>
  61         {!this.props.hideAvatar && community.icon && showAvatars() && (
  62           <PictrsImage src={community.icon} icon />
  63         )}
  64         <span class="overflow-wrap-anywhere">{displayName}</span>
  65       </>
  66     );
  67   }
  68 }