72 lines
2 KiB
JavaScript
72 lines
2 KiB
JavaScript
|
import React from 'react';
|
||
|
|
import i18n from '../i18n';
|
||
|
|
import GuildRecord from '../records/GuildRecord';
|
||
|
|
import GuildIcon from './common/GuildIcon';
|
||
|
|
|
||
|
|
import '../styles/invite_header.styl';
|
||
|
|
|
||
|
|
const TEXT_SCALE = 0.7;
|
||
|
|
/**
|
||
|
|
* The number of guild members that differentiates a tightly knit guild (personal)
|
||
|
|
* vs a larger community based guild. This is large because temp accounts can count towards
|
||
|
|
* the member count.
|
||
|
|
*/
|
||
|
|
const PERSONAL_GUILD_MEMBER_LIMIT = 250;
|
||
|
|
|
||
|
|
const InviteHeaderGuildContext = ({invite}) => {
|
||
|
|
const guild = new GuildRecord(invite.guild);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="invite-header guild">
|
||
|
|
<h1 className="title">{i18n.Messages.INSTANT_INVITE_YOU_HAVE_BEEN_INVITED_TO_JOIN}</h1>
|
||
|
|
<h2>
|
||
|
|
<GuildIcon guild={guild} className="invite-guild-icon" />
|
||
|
|
<div>{guild.name}</div>
|
||
|
|
</h2>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Show inviter name and guild name/icon
|
||
|
|
*/
|
||
|
|
const InviteHeaderFullContext = ({invite}) => {
|
||
|
|
const guild = new GuildRecord(invite.guild);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="invite-header full">
|
||
|
|
<h1 className="title">{i18n.Messages.INSTANT_INVITE_YOU_HAVE_BEEN_INVITED_TO_JOIN}</h1>
|
||
|
|
<p>
|
||
|
|
{i18n.Messages.INSTANT_INVITE_GUILD_BY_USER.format({
|
||
|
|
username: invite.inviter.username,
|
||
|
|
guild: invite.guild.name,
|
||
|
|
guildNameHook(children, key) {
|
||
|
|
return (
|
||
|
|
<span className="guild-wrap" key={key}>
|
||
|
|
{children}
|
||
|
|
<GuildIcon guild={guild} size="xsmall" className="invite-guild-icon" textScale={TEXT_SCALE} />
|
||
|
|
</span>
|
||
|
|
);
|
||
|
|
},
|
||
|
|
})}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
const InviteHeader = props => {
|
||
|
|
const {invite} = props;
|
||
|
|
|
||
|
|
if (invite.inviter == null || invite.approximate_member_count > PERSONAL_GUILD_MEMBER_LIMIT) {
|
||
|
|
return <InviteHeaderGuildContext {...props} />;
|
||
|
|
} else {
|
||
|
|
return <InviteHeaderFullContext {...props} />;
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
export default InviteHeader;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
// WEBPACK FOOTER //
|
||
|
|
// ./discord_app/components/InviteHeader.js
|