pixel.horse/src/ts/components/admin/shared/pony-info/pony-info.ts

import { Component, Input, OnChanges } from '@angular/core';
import { hasFlag } from '../../../../common/utils';
import { Character, CharacterFlags } from '../../../../common/adminInterfaces';
import { isForbiddenName } from '../../../../common/security';
import { AdminModel } from '../../../services/adminModel';

@Component({
	selector: 'pony-info',
	templateUrl: 'pony-info.pug',
	styleUrls: ['pony-info.scss'],
})
export class PonyInfo implements OnChanges {
	@Input() pony?: Character;
	@Input() highlight = false;
	labelClass = 'badge-none';
	private promise?: Promise<void>;
	constructor(private model: AdminModel) {
	}
	get isBadCM() {
		return !!this.pony && hasFlag(this.pony.flags, CharacterFlags.BadCM);
	}
	ngOnChanges() {
		if (this.pony) {
			if (isForbiddenName(this.pony.name)) {
				this.labelClass = 'badge-forbidden';
			} else if (hasFlag(this.pony.flags, CharacterFlags.BadCM)) {
				this.labelClass = 'badge-danger';
			} else {
				this.labelClass = 'badge-none';
			}
		}
	}
	onShown() {
		if (this.pony && !this.pony.ponyInfo && !this.promise) {
			this.promise = this.model.getPonyInfo(this.pony)
				.finally(() => this.promise = undefined);
		}
	}
	click() {
		console.log(this.pony);
	}
}