2017-06-08_509bba0/509bba0_unpacked_with_node_modules/discord_app/components/InviteModal.js
2022-07-26 10:06:20 -07:00

109 lines
3 KiB
JavaScript
Executable file

import React from 'react';
import Flux from '../lib/flux';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import InviteModalStore from '../stores/InviteModalStore';
import Scroller from './common/Scroller';
import Spinner from './common/Spinner';
import {Messages} from '../i18n';
import GuildIcon from './common/GuildIcon';
import InviteModalActionCreators from '../actions/InviteModalActionCreators';
import NativeUtils from '../utils/NativeUtils';
import AvatarUtils from '../utils/AvatarUtils';
import classNames from 'classnames';
import '../styles/invite_modal.styl';
const InviteModal = React.createClass({
mixins: [PureRenderMixin, Flux.StoreListenerMixin(InviteModalStore)],
statics: {
modalConfig: {
closable: true,
store: InviteModalStore,
},
},
getStateFromStores() {
return InviteModalStore.getState();
},
componentDidMount() {
if (NativeUtils.isWindows()) {
// On Windows 10 focus is a no-op for non-minimized windows.
NativeUtils.minimize(true);
} else {
NativeUtils.restore(true);
}
NativeUtils.focus(true);
},
render() {
const {invite, error, submitting} = this.state;
if (!invite) {
return null;
}
const {channel, guild} = invite;
let splash;
if (guild.splash) {
splash = (
<div
className="invite-splash"
style={{
backgroundImage: `url(${AvatarUtils.getGuildSplashURL({id: guild.id, splash: guild.splash})})`,
}}
/>
);
}
let body;
let title;
if (error) {
body = error;
title = Messages.INVITE_MODAL_ERROR_TITLE;
} else {
title = Messages.INVITE_MODAL_TITLE;
body = Messages.INVITE_MODAL_CONTENT.format({
channelName: channel.name,
guildName: guild.name,
});
}
const spinner = submitting ? <Spinner type="pulsing-ellipsis" /> : null;
return (
<div className="invite-modal">
{splash}
<Scroller theme="light">
<div className="invite-content">
<GuildIcon guild={guild} size="xxxlarge" textScale={2.5} />
<div className={classNames('invite-title', {error})}>{title}</div>
<div className={classNames('invite-body', {error})}>{body}</div>
<div className="invite-actions">
<button className={classNames('button', {submitting})} disabled={submitting} onClick={this.acceptInvite}>
{Messages.INVITE_MODAL_BUTTON.format({guildName: guild.name})}
{spinner}
</button>
<div onClick={this.close} className="invite-cancel">{Messages.INIVTE_MODAL_NO_THANKS}</div>
</div>
</div>
</Scroller>
</div>
);
},
acceptInvite() {
InviteModalActionCreators.acceptInvite(this.state.invite.code, 'Desktop Invite Modal');
},
close() {
InviteModalActionCreators.close();
},
});
export default InviteModal;
// WEBPACK FOOTER //
// ./discord_app/components/InviteModal.js