fix i18n error rendering

This commit is contained in:
softsimon 2024-07-08 12:48:29 +09:00
parent 5316d1705a
commit 32eaf29aaa
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7

View File

@ -1,4 +1,4 @@
import { AfterViewInit, Component, Input, OnInit, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core'; import { Component, EmbeddedViewRef, Input, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser'; import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
export const MempoolErrors = { export const MempoolErrors = {
@ -42,8 +42,8 @@ export function isMempoolError(error: string) {
selector: 'app-mempool-error', selector: 'app-mempool-error',
templateUrl: './mempool-error.component.html' templateUrl: './mempool-error.component.html'
}) })
export class MempoolErrorComponent implements OnInit, AfterViewInit { export class MempoolErrorComponent implements OnInit {
@ViewChild('lowBalance') lowBalance!: TemplateRef<any>; @ViewChild('lowBalance', { static: true }) lowBalance!: TemplateRef<any>;
@Input() error: string; @Input() error: string;
@Input() alertClass = 'alert-danger'; @Input() alertClass = 'alert-danger';
@Input() textOnly = false; @Input() textOnly = false;
@ -51,18 +51,22 @@ export class MempoolErrorComponent implements OnInit, AfterViewInit {
constructor( constructor(
private sanitizer: DomSanitizer, private sanitizer: DomSanitizer,
private viewContainerRef: ViewContainerRef,
) { } ) { }
ngAfterViewInit(): void {
// Special hack for the i18n string with a href link inside
const view = this.viewContainerRef.createEmbeddedView(this.lowBalance);
const rawHtml = view.rootNodes.map(node => node.outerHTML).join('');
MempoolErrors['not_enough_balance'] = rawHtml;
}
ngOnInit(): void { ngOnInit(): void {
if (Object.keys(MempoolErrors).includes(this.error)) { // Special hack for the i18n string with a href link inside
const embeddedViewRef: EmbeddedViewRef<any> = this.lowBalance.createEmbeddedView({});
embeddedViewRef.detectChanges();
const rawHtml = embeddedViewRef.rootNodes.map((node) => {
if (node.nodeType === Node.TEXT_NODE) {
return node.textContent;
} else if (node.nodeType === Node.ELEMENT_NODE) {
return node.outerHTML;
}
return '';
}).join('');
MempoolErrors['not_enough_balance'] = rawHtml;
if (Object.keys(MempoolErrors).includes(this.error)) {
this.errorContent = this.sanitizer.bypassSecurityTrustHtml(MempoolErrors[this.error]); this.errorContent = this.sanitizer.bypassSecurityTrustHtml(MempoolErrors[this.error]);
} else { } else {
this.errorContent = this.error; this.errorContent = this.error;