import { Component, computed, Inject } from '@angular/core';
import { ViewMode, ViewModes } from '@red/domain';
import { ViewModeService } from '../../services/view-mode.service';
import { FilePreviewStateService } from '../../services/file-preview-state.service';
import { FileDataService } from '../../services/file-data.service';
import { ConfirmOptions, IConfirmationDialogData, Toaster } from '@iqser/common-ui';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { FilePreviewDialogService } from '../../services/file-preview-dialog.service';
import { Roles } from '@users/roles';
import { BASE_HREF } from '@iqser/common-ui/lib/utils';

@Component({
    selector: 'redaction-view-switch',
    templateUrl: './view-switch.component.html',
    styleUrls: ['./view-switch.component.scss'],
})
export class ViewSwitchComponent {
    readonly roles = Roles;
    readonly viewModes = ViewModes;
    readonly canSwitchToDeltaView = computed(() => {
        const annotations = this._fileDataService.annotations();
        const file = this._state.file();
        const hasChangeLog = annotations.some(a => a.isChangeLogEntry);
        return hasChangeLog && !file.isApproved;
    });
    readonly canSwitchToRedactedView = computed(() => {
        const file = this._state.file();
        return !file.analysisRequired && !file.excluded;
    });
    readonly canSwitchToEarmarksView = computed(() => {
        const file = this._state.file();
        return file.hasHighlights && !file.analysisRequired && !file.excluded;
    });

    constructor(
        @Inject(BASE_HREF) private readonly _baseHref: string,
        readonly viewModeService: ViewModeService,
        private readonly _state: FilePreviewStateService,
        private readonly _fileDataService: FileDataService,
        private readonly _dialogService: FilePreviewDialogService,
        private readonly _toaster: Toaster,
    ) {}

    switchView(viewMode: ViewMode) {
        if (viewMode === ViewModes.REDACTED) {
            return this.#switchToRedactedView();
        }
        this.viewModeService.switchTo(viewMode);
    }

    async #switchToRedactedView() {
        const suggestions = this._fileDataService.annotations().filter(a => a.isSuggestion);
        if (!suggestions.length) {
            return this.viewModeService.switchToRedacted();
        }

        const question = _('unapproved-suggestions.confirmation-dialog.not-displayed-question');
        const data: IConfirmationDialogData = {
            title: _('unapproved-suggestions.confirmation-dialog.title'),
            question: question,
            confirmationText: _('unapproved-suggestions.confirmation-dialog.confirmation-text'),
            denyText: _('unapproved-suggestions.confirmation-dialog.deny-text'),
            checkboxes: [
                {
                    label: _('unapproved-suggestions.confirmation-dialog.checkbox-text'),
                    value: false,
                },
            ],
            checkboxesValidation: false,
        };

        return this._dialogService.openDialog('confirm', data, result => {
            if (!result) {
                return;
            }

            if (result === ConfirmOptions.SECOND_CONFIRM) {
                this._toaster.success(_('unapproved-suggestions.confirmation-dialog.success-confirmation-text'), {
                    params: { settingsUrl: `${this._baseHref}/main/account/warnings-preferences` },
                });
            }
            this.viewModeService.switchToRedacted();
        });
    }
}
