import {
Component,
Inject,
OnDestroy,
} from '@angular/core';
import {
LocaleService, SettingsService, LocaleSubject
} from "../../../web";
import {
NotifyService
} from '../../services/notify/notify';
import { Subscription } from 'rxjs'
// requires to be in a mat-menu
@Component({
selector: 'cory-mat-translation-menu',
template: `
<button mat-menu-item disabled>
{{ i18n.material.title.language }}
</button>
<div class="cory-mat-menu-divider"></div>
<button
mat-menu-item *ngFor="let translation of translationKeys"
(click)="clickChangeTranslate(translation)"
[class.cory-mat-menu-item-active]="translation == locale.current"
>
{{ settings.translations.language[translation] }}
</button>
`,
})
export class TranslationMenu implements OnDestroy {
subscriptions$: Array<Subscription> = []
i18n: any;
settings: any;
constructor(
private notify: NotifyService,
public locale: LocaleService,
protected settingsAll: SettingsService
) {
this.settings = settingsAll.data.core;
this.subscriptions$.push(
this.locale.subscribe((data: LocaleSubject) => {
this.i18n = data.locale.data;
})
)
}
public clickChangeTranslate(translation: string) {
try {
this.locale.setTranslation(translation);
this.notify.info(this.settingsAll.data.core.translations.display[translation]);
} catch (e) {
console.error(e);
}
}
get translationKeys() {
return Object.keys(this.settings.translations.language)
}
ngOnDestroy(): void {
this.subscriptions$.forEach(subs$ => subs$.unsubscribe())
}
}
