Convert stateless components
This commit is contained in:
Zack Rauen
parent
c6d58bdc2d
commit
2976a4cf00
|
|
@ -1,17 +1,15 @@
|
|||
import {React, DiscordClasses} from "modules";
|
||||
import SimpleMarkdown from "../../structs/markdown";
|
||||
|
||||
export default class EmptyImage extends React.Component {
|
||||
render() {
|
||||
return <div className={`bd-empty-image-container ${DiscordClasses.EmptyImage.emptyContainer}` + (this.props.className ? ` ${this.props.className}` : "")}>
|
||||
<div className={`bd-empty-image ${DiscordClasses.EmptyImage.emptyImage}`}></div>
|
||||
<div className={`bd-empty-image-header ${DiscordClasses.EmptyImage.emptyHeader}`}>
|
||||
{this.props.title || "You don't have anything!"}
|
||||
</div>
|
||||
<div className={`bd-empty-image-message`}>
|
||||
{SimpleMarkdown.parseToReact(this.props.message || "You should probably get something.")}
|
||||
</div>
|
||||
{this.props.children}
|
||||
</div>;
|
||||
}
|
||||
export default function EmptyImage(props) {
|
||||
return <div className={`bd-empty-image-container ${DiscordClasses.EmptyImage.emptyContainer}` + (props.className ? ` ${props.className}` : "")}>
|
||||
<div className={`bd-empty-image ${DiscordClasses.EmptyImage.emptyImage}`}></div>
|
||||
<div className={`bd-empty-image-header ${DiscordClasses.EmptyImage.emptyHeader}`}>
|
||||
{props.title || "You don't have anything!"}
|
||||
</div>
|
||||
<div className={`bd-empty-image-message`}>
|
||||
{SimpleMarkdown.parseToReact(props.message || "You should probably get something.")}
|
||||
</div>
|
||||
{props.children}
|
||||
</div>;
|
||||
}
|
||||
|
|
@ -1,13 +1,11 @@
|
|||
import {React, DiscordModules} from "modules";
|
||||
import MagnifyingGlass from "../icons/magnifyingglass";
|
||||
|
||||
export default class NoResults extends React.Component {
|
||||
render() {
|
||||
return <div className={"bd-empty-results" + (this.props.className ? ` ${this.props.className}` : "")}>
|
||||
<MagnifyingGlass />
|
||||
<div className="bd-empty-results-text">
|
||||
{this.props.text || DiscordModules.Strings.SEARCH_NO_RESULTS || ""}
|
||||
</div>
|
||||
</div>;
|
||||
}
|
||||
export default function NoResults(props) {
|
||||
return <div className={"bd-empty-results" + (props.className ? ` ${props.className}` : "")}>
|
||||
<MagnifyingGlass />
|
||||
<div className="bd-empty-results-text">
|
||||
{props.text || DiscordModules.Strings.SEARCH_NO_RESULTS || ""}
|
||||
</div>
|
||||
</div>;
|
||||
}
|
||||
|
|
@ -4,21 +4,15 @@ import HistoryIcon from "../icons/history";
|
|||
import Modals from "../modals";
|
||||
|
||||
|
||||
export default class SettingsTitle extends React.Component {
|
||||
renderHeader() {
|
||||
return <h2 className="bd-sidebar-header-label">BetterDiscord</h2>;
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div className="bd-sidebar-header">
|
||||
{this.renderHeader()}
|
||||
<DiscordModules.Tooltip color="primary" position="top" text="Changelog">
|
||||
{props =>
|
||||
<div {...props} className="bd-changelog-button" onClick={() => Modals.showChangelogModal(Changelog)}>
|
||||
<HistoryIcon className="bd-icon" size="16px" />
|
||||
</div>
|
||||
}
|
||||
</DiscordModules.Tooltip>
|
||||
</div>;
|
||||
}
|
||||
}
|
||||
export default function SettingsTitle() {
|
||||
return <div className="bd-sidebar-header">
|
||||
<h2 className="bd-sidebar-header-label">BetterDiscord</h2>
|
||||
<DiscordModules.Tooltip color="primary" position="top" text="Changelog">
|
||||
{props =>
|
||||
<div {...props} className="bd-changelog-button" onClick={() => Modals.showChangelogModal(Changelog)}>
|
||||
<HistoryIcon className="bd-icon" size="16px" />
|
||||
</div>
|
||||
}
|
||||
</DiscordModules.Tooltip>
|
||||
</div>;
|
||||
}
|
||||
|
|
@ -7,40 +7,34 @@ import Toasts from "./toasts";
|
|||
|
||||
import Checkmark from "./icons/check";
|
||||
|
||||
class CoreUpdaterPanel extends React.Component {
|
||||
render() {
|
||||
return <Drawer name="BetterDiscord" collapsible={true}>
|
||||
<SettingItem name={`Core v${Config.version}`} note={this.props.hasUpdate ? Strings.Updater.versionAvailable.format({version: this.props.remoteVersion}) : Strings.Updater.noUpdatesAvailable} inline={true} id={"core-updater"}>
|
||||
{!this.props.hasUpdate && <div className="bd-filled-checkmark"><Checkmark /></div>}
|
||||
{this.props.hasUpdate && <button className="bd-button" onClick={this.props.update}>{Strings.Updater.updateButton}</button>}
|
||||
</SettingItem>
|
||||
</Drawer>;
|
||||
}
|
||||
function CoreUpdaterPanel(props) {
|
||||
return <Drawer name="BetterDiscord" collapsible={true}>
|
||||
<SettingItem name={`Core v${Config.version}`} note={props.hasUpdate ? Strings.Updater.versionAvailable.format({version: props.remoteVersion}) : Strings.Updater.noUpdatesAvailable} inline={true} id={"core-updater"}>
|
||||
{!props.hasUpdate && <div className="bd-filled-checkmark"><Checkmark /></div>}
|
||||
{props.hasUpdate && <button className="bd-button" onClick={props.update}>{Strings.Updater.updateButton}</button>}
|
||||
</SettingItem>
|
||||
</Drawer>;
|
||||
}
|
||||
|
||||
class NoUpdates extends React.Component {
|
||||
render() {
|
||||
return <div className="bd-empty-updates">
|
||||
<Checkmark size="48px" />
|
||||
{Strings.Updater.upToDateBlankslate.format({type: this.props.type})}
|
||||
</div>;
|
||||
}
|
||||
function NoUpdates(props) {
|
||||
return <div className="bd-empty-updates">
|
||||
<Checkmark size="48px" />
|
||||
{Strings.Updater.upToDateBlankslate.format({type: props.type})}
|
||||
</div>;
|
||||
}
|
||||
|
||||
class AddonUpdaterPanel extends React.Component {
|
||||
render() {
|
||||
const filenames = this.props.pending;
|
||||
return <Drawer name={Strings.Panels[this.props.type]} collapsible={true} button={filenames.length ? {title: Strings.Updater.updateAll, onClick: () => this.props.updateAll(this.props.type)} : null}>
|
||||
{!filenames.length && <NoUpdates type={this.props.type} />}
|
||||
{filenames.map(f => {
|
||||
const info = this.props.updater.cache[f];
|
||||
const addon = this.props.updater.manager.addonList.find(a => a.filename === f);
|
||||
return <SettingItem name={`${addon.name} v${addon.version}`} note={Strings.Updater.versionAvailable.format({version: info.version})} inline={true} id={addon.name}>
|
||||
<button className="bd-button" onClick={() => this.props.update(this.props.type, f)}>{Strings.Updater.updateButton}</button>
|
||||
</SettingItem>;
|
||||
})}
|
||||
</Drawer>;
|
||||
}
|
||||
function AddonUpdaterPanel(props) {
|
||||
const filenames = props.pending;
|
||||
return <Drawer name={Strings.Panels[props.type]} collapsible={true} button={filenames.length ? {title: Strings.Updater.updateAll, onClick: () => props.updateAll(props.type)} : null}>
|
||||
{!filenames.length && <NoUpdates type={props.type} />}
|
||||
{filenames.map(f => {
|
||||
const info = props.updater.cache[f];
|
||||
const addon = props.updater.manager.addonList.find(a => a.filename === f);
|
||||
return <SettingItem name={`${addon.name} v${addon.version}`} note={Strings.Updater.versionAvailable.format({version: info.version})} inline={true} id={addon.name}>
|
||||
<button className="bd-button" onClick={() => props.update(props.type, f)}>{Strings.Updater.updateButton}</button>
|
||||
</SettingItem>;
|
||||
})}
|
||||
</Drawer>;
|
||||
}
|
||||
|
||||
export default class UpdaterPanel extends React.Component {
|
||||
|
|
|
|||
Loading…
Reference in New Issue