import { NotificationContext } from '@allianz/taly-core/schemas';
import { LiveAnnouncer } from '@angular/cdk/a11y';

import {
  ChangeDetectionStrategy,
  Component,
  ElementRef,
  EventEmitter,
  inject,
  Input,
  NgZone,
  OnDestroy,
  OnInit,
  Output
} from '@angular/core';
import { NxLinkModule } from '@allianz/ng-aquila/link';
import { NxListModule } from '@allianz/ng-aquila/list';
import { NxMessageModule } from '@allianz/ng-aquila/message';

const I18N_NOTIFICATION_CONTEXT: Record<NotificationContext, string> = {
  info: $localize`:Context of an info notification:info`,
  success: $localize`:Context of a success notification:success`,
  warning: $localize`:Context of a warning notification:warning`,
  error: $localize`:Context of an error notification:error`
};

/**
 * A wrapper around the NDBX NotificationComponent that adds LiveAnnouncer support
 */
@Component({
  selector: 'taly-notification',
  templateUrl: './notification.component.html',
  styleUrls: ['./notification.component.scss'],
  imports: [NxMessageModule, NxLinkModule, NxListModule],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class NotificationComponent implements OnInit, OnDestroy {
  private liveAnnouncer = inject(LiveAnnouncer);
  private elementRef = inject<ElementRef<HTMLElement>>(ElementRef);

  /**
   * The context of the notification.
   */
  @Input() context!: NotificationContext;

  /**
   * Indicates whether the notification is closable or not.
   */
  @Input() closable!: boolean | undefined;

  /**
   * Output event emitted when the notification is closed.
   */
  @Output() closeNotification = new EventEmitter<void>();

  private i18nNotificationContext!: string;

  /**
   * The label for the close button.
   */
  closeButtonLabel = '';

  private domChanges!: MutationObserver;

  private ngZone = inject(NgZone);

  ngOnInit() {
    this.i18nNotificationContext = I18N_NOTIFICATION_CONTEXT[this.context];

    if (this.closable) {
      this.closeButtonLabel = $localize`:Label for the close button in a notification:Close ${this.i18nNotificationContext} notification`;
    }

    this.ngZone.runOutsideAngular(() => {
      this.domChanges = new MutationObserver(() => {
        this.a11yAnnounceNotification();
      });

      this.domChanges.observe(this.elementRef.nativeElement, {
        subtree: true,
        childList: true,
        characterData: true
      });
    });
  }

  private a11yAnnounceNotification() {
    const NOTIFICATION_WORD = $localize`:Word for notification:notification`;
    const notificationContent = this.elementRef.nativeElement?.textContent?.trim();
    const announcement = `${this.i18nNotificationContext} ${NOTIFICATION_WORD}. ${notificationContent}`;

    this.liveAnnouncer.announce(announcement);
  }

  ngOnDestroy(): void {
    this.domChanges.disconnect();
  }
}