chore: use consistent empty vdom return types in core

This commit is contained in:
David Wheatley 2021-12-20 16:21:18 +01:00
parent 4ad961c972
commit 0334b6c972
No known key found for this signature in database
GPG Key ID: DCC0FCE349280DFF
20 changed files with 54 additions and 57 deletions

View File

@ -20,6 +20,6 @@ export default class DashboardWidget extends Component {
* @return {VirtualElement}
*/
content() {
return [];
return null;
}
}

View File

@ -21,7 +21,7 @@ export default class ExtensionsWidget extends DashboardWidget {
return (
<div className="ExtensionsWidget-list">
{Object.keys(categories).map((category) => (this.categorizedExtensions[category] ? this.extensionCategory(category) : ''))}
{Object.keys(categories).map((category) => !!this.categorizedExtensions[category] && this.extensionCategory(category))}
</div>
);
}
@ -41,7 +41,7 @@ export default class ExtensionsWidget extends DashboardWidget {
<Link href={app.route('extension', { id: extension.id })}>
<div className="ExtensionListItem-content">
<span className="ExtensionListItem-icon ExtensionIcon" style={extension.icon}>
{extension.icon ? icon(extension.icon.name) : ''}
{!!extension.icon && icon(extension.icon.name)}
</span>
<span className="ExtensionListItem-title">{extension.extra['flarum-extension'].title}</span>
</div>

View File

@ -18,7 +18,7 @@ export default class LoadingModal<ModalAttrs extends ILoadingModalAttrs = ILoadi
}
content() {
return '';
return null;
}
onsubmit(e: Event): void {

View File

@ -56,9 +56,8 @@ export default class PermissionGrid<CustomAttrs extends IPermissionGridAttrs = I
{scopes.map((scope) => (
<th>
{scope.label}{' '}
{scope.onremove
? Button.component({ icon: 'fas fa-times', className: 'Button Button--text PermissionGrid-removeScope', onclick: scope.onremove })
: ''}
{!!scope.onremove &&
Button.component({ icon: 'fas fa-times', className: 'Button Button--text PermissionGrid-removeScope', onclick: scope.onremove })}
</th>
))}
<th>{this.scopeControlItems().toArray()}</th>

View File

@ -175,7 +175,7 @@ export default class UserListPage extends AdminPage {
'id',
{
name: app.translator.trans('core.admin.users.grid.columns.user_id.title'),
content: (user: User) => user.id() ?? '',
content: (user: User) => user.id() ?? null,
},
100
);

View File

@ -128,9 +128,9 @@ export default class Dropdown extends Component {
*/
getButtonContent(children) {
return [
this.attrs.icon ? icon(this.attrs.icon, { className: 'Button-icon' }) : '',
!!this.attrs.icon && icon(this.attrs.icon, { className: 'Button-icon' }),
<span className="Button-label">{this.attrs.label}</span>,
this.attrs.caretIcon ? icon(this.attrs.caretIcon, { className: 'Button-caret' }) : '',
!!this.attrs.caretIcon && icon(this.attrs.caretIcon, { className: 'Button-caret' }),
];
}

View File

@ -89,7 +89,7 @@ export default class EditUserModal<CustomAttrs extends IEditUserModalAttrs = IEd
disabled={this.nonAdminEditingAdmin()}
/>
</div>
{!this.isEmailConfirmed() && this.userIsAdmin(app.session.user) ? (
{!this.isEmailConfirmed() && this.userIsAdmin(app.session.user) && (
<div>
{Button.component(
{
@ -100,8 +100,6 @@ export default class EditUserModal<CustomAttrs extends IEditUserModalAttrs = IEd
app.translator.trans('core.lib.edit_user.activate_button')
)}
</div>
) : (
''
)}
</div>,
30
@ -126,7 +124,7 @@ export default class EditUserModal<CustomAttrs extends IEditUserModalAttrs = IEd
/>
{app.translator.trans('core.lib.edit_user.set_password_label')}
</label>
{this.setPassword() ? (
{this.setPassword() && (
<input
className="FormControl"
type="password"
@ -135,8 +133,6 @@ export default class EditUserModal<CustomAttrs extends IEditUserModalAttrs = IEd
bidi={this.password}
disabled={this.nonAdminEditingAdmin()}
/>
) : (
''
)}
</div>
</div>,

View File

@ -105,7 +105,7 @@ export default abstract class Modal<ModalAttrs extends IInternalModalAttrs = IIn
<h3 className="App-titleControl App-titleControl--text">{this.title()}</h3>
</div>
{this.alertAttrs ? <div className="Modal-alert">{Alert.component(this.alertAttrs)}</div> : ''}
{!!this.alertAttrs && <div className="Modal-alert">{Alert.component(this.alertAttrs)}</div>}
{this.content()}
</form>

View File

@ -65,7 +65,7 @@ export default class Navigation extends Component {
getPaneButton() {
const { pane } = app;
if (!pane || !pane.active) return '';
if (!pane || !pane.active) return null;
return Button.component({
className: 'Button Button--icon Navigation-pin' + (pane.pinned ? ' active' : ''),
@ -81,7 +81,7 @@ export default class Navigation extends Component {
* @protected
*/
getDrawerButton() {
if (!this.attrs.drawer) return '';
if (!this.attrs.drawer) return null;
const { drawer } = app;
const user = app.session.user;

View File

@ -12,7 +12,7 @@ export default class RequestErrorModal<CustomAttrs extends IRequestErrorModalAtt
}
title() {
return this.attrs.error.xhr ? `${this.attrs.error.xhr.status} ${this.attrs.error.xhr.statusText}` : '';
return !!this.attrs.error.xhr && `${this.attrs.error.xhr.status} ${this.attrs.error.xhr.statusText}`;
}
content() {

View File

@ -12,6 +12,6 @@ export default class Switch extends Checkbox {
}
getDisplay() {
return this.attrs.loading ? super.getDisplay() : '';
return !!this.attrs.loading && super.getDisplay();
}
}

View File

@ -51,7 +51,7 @@ export default class Composer extends Component {
<div className="Composer-handle" oncreate={this.configHandle.bind(this)} />
<ul className="Composer-controls">{listItems(this.controlItems().toArray())}</ul>
<div className="Composer-content" onclick={showIfMinimized}>
{body.componentClass ? body.componentClass.component({ ...body.attrs, composer: this.state, disabled: classes.minimized }) : ''}
{!!body.componentClass && body.componentClass.component({ ...body.attrs, composer: this.state, disabled: classes.minimized })}
</div>
</div>
);

View File

@ -125,17 +125,16 @@ export default class LogInModal<CustomAttrs extends ILoginModalAttrs = ILoginMod
}
footer() {
return [
<p className="LogInModal-forgotPassword">
<a onclick={this.forgotPassword.bind(this)}>{app.translator.trans('core.forum.log_in.forgot_password_link')}</a>
</p>,
app.forum.attribute('allowSignUp') ? (
<p className="LogInModal-signUp">{app.translator.trans('core.forum.log_in.sign_up_text', { a: <a onclick={this.signUp.bind(this)} /> })}</p>
) : (
''
),
];
return (
<>
<p className="LogInModal-forgotPassword">
<a onclick={this.forgotPassword.bind(this)}>{app.translator.trans('core.forum.log_in.forgot_password_link')}</a>
</p>
{!!app.forum.attribute('allowSignUp') && (
<p className="LogInModal-signUp">{app.translator.trans('core.forum.log_in.sign_up_text', { a: <a onclick={this.signUp.bind(this)} /> })}</p>
)}
</>
);
}
/**

View File

@ -96,7 +96,7 @@ export default class NotificationList extends Component {
<ul className="NotificationGroup-content">
{group.notifications.map((notification) => {
const NotificationComponent = app.notificationComponents[notification.contentType()];
return NotificationComponent ? <li>{NotificationComponent.component({ notification })}</li> : '';
return !!NotificationComponent && <li>{NotificationComponent.component({ notification })}</li>;
})}
</ul>
</div>

View File

@ -59,7 +59,7 @@ export default class Post extends Component {
<aside className="Post-actions">
<ul>
{listItems(this.actionItems().toArray())}
{controls.length ? (
{!!controls.length && (
<li>
<Dropdown
className="Post-controls"
@ -73,8 +73,6 @@ export default class Post extends Component {
{controls}
</Dropdown>
</li>
) : (
''
)}
</ul>
</aside>
@ -114,7 +112,7 @@ export default class Post extends Component {
* @return {Array}
*/
content() {
return [];
return null;
}
/**
@ -124,7 +122,10 @@ export default class Post extends Component {
* @returns {string[]}
*/
classes(existing) {
let classes = (existing || '').split(' ').concat(['Post']);
const classes = (existing || '')
.split(' ')
.filter((x) => x.trim() !== '')
.concat(['Post']);
const user = this.attrs.post.user();
const discussion = this.attrs.post.discussion();

View File

@ -55,6 +55,6 @@ export default class PostMeta extends Component {
* @returns {String}
*/
getPermalink(post) {
return window.location.origin + app.route.post(post);
return app.forum.attribute('baseUrl') + app.route.post(post);
}
}

View File

@ -18,7 +18,7 @@ export default class PostPreview extends Component {
const post = this.attrs.post;
const user = post.user();
const content = post.contentType() === 'comment' && post.contentPlain();
const excerpt = content ? highlight(content, this.attrs.highlight, 300) : '';
const excerpt = !!content && highlight(content, this.attrs.highlight, 300);
return (
<Link className="PostPreview" href={app.route.post(post)} onclick={this.attrs.onclick}>

View File

@ -29,7 +29,10 @@ export default class PostUser extends Component {
);
}
let card = '';
/**
* @type {import('mithril').Children}
*/
let card = null;
if (!post.isHidden() && this.attrs.cardVisible) {
card = UserCard.component({

View File

@ -34,19 +34,18 @@ export default class UserCard extends Component {
<div className={'UserCard ' + (this.attrs.className || '')} style={color && { '--usercard-bg': color }}>
<div className="darkenBackground">
<div className="container">
{controls.length
? Dropdown.component(
{
className: 'UserCard-controls App-primaryControl',
menuClassName: 'Dropdown-menu--right',
buttonClassName: this.attrs.controlsButtonClassName,
label: app.translator.trans('core.forum.user_controls.button'),
accessibleToggleLabel: app.translator.trans('core.forum.user_controls.toggle_dropdown_accessible_label'),
icon: 'fas fa-ellipsis-v',
},
controls
)
: ''}
{!!controls.length &&
Dropdown.component(
{
className: 'UserCard-controls App-primaryControl',
menuClassName: 'Dropdown-menu--right',
buttonClassName: this.attrs.controlsButtonClassName,
label: app.translator.trans('core.forum.user_controls.button'),
accessibleToggleLabel: app.translator.trans('core.forum.user_controls.toggle_dropdown_accessible_label'),
icon: 'fas fa-ellipsis-v',
},
controls
)}
<div className="UserCard-profile">
<h2 className="UserCard-identity">
@ -60,7 +59,7 @@ export default class UserCard extends Component {
)}
</h2>
{badges.length ? <ul className="UserCard-badges badges">{listItems(badges)}</ul> : ''}
{!!badges.length && <ul className="UserCard-badges badges">{listItems(badges)}</ul>}
<ul className="UserCard-info">{listItems(this.infoItems().toArray())}</ul>
</div>

View File

@ -260,7 +260,7 @@ class ComposerState {
// let the CSS decide how high it is. If it's fullscreen, then we need to
// make it as high as the window.
if (this.position === ComposerState.Position.MINIMIZED) {
return '';
return null;
} else if (this.position === ComposerState.Position.FULLSCREEN) {
return $(window).height();
}