import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, Optional, Inject, Input, NgModule } from '@angular/core';
import * as i4 from '@angular/forms';
import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
import * as i1 from '@aztrix/helpers';
import { fuzzySortProfiles, HelperPipesModule } from '@aztrix/helpers';
import { SubjectFormat } from '@aztrix/models';
import { BASE_URL } from '@aztrix/sdk';
import { ReplaySubject, combineLatest, BehaviorSubject } from 'rxjs';
import { mergeMap, catchError, shareReplay, debounceTime, startWith, map } from 'rxjs/operators';
import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i3 from '@aztrix/components/search-query';
import { SearchQueryModule } from '@aztrix/components/search-query';
import * as i5 from '@aztrix/components/profile-cell';
import { ProfileCellModule } from '@aztrix/components/profile-cell';

class GroupSearchComponent {
    constructor(_http, baseUrl) {
        this._http = _http;
        this.baseUrl = baseUrl;
        this.query = new UntypedFormControl('');
        this.groupId$ = new ReplaySubject(1);
        this.memberIds$ = this.groupId$.pipe(mergeMap((groupId) => this._getMembers(groupId)));
        this.members$ = this.memberIds$.pipe(mergeMap((ids) => this._getProfiles(ids, SubjectFormat.FULL)), catchError((err) => {
            this.error$.next(true);
            throw err;
        }), shareReplay(1));
        this.membersSorted$ = combineLatest([
            this.members$,
            this.query.valueChanges.pipe(debounceTime(500)).pipe(startWith(this.query.value)),
        ]).pipe(map(([members, query]) => fuzzySortProfiles(members, query)));
        this.error$ = new BehaviorSubject(false);
    }
    ngOnChanges(changes) {
        if (changes.groupId && this.groupId) {
            this.groupId$.next(this.groupId);
        }
    }
    _getMembers(groupId) {
        return this._http.get(`${this.baseUrl || ''}/r/groups/${groupId}/members?format=ID`);
    }
    _getProfiles(ids, format) {
        return this._http.post(`${this.baseUrl || ''}/r/profiles/multipleProfiles?format=${format}`, { ids });
    }
}
GroupSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchComponent, deps: [{ token: i1.HttpClientService }, { token: BASE_URL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
GroupSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: GroupSearchComponent, selector: "ax-group-search", inputs: { groupId: "groupId" }, usesOnChanges: true, ngImport: i0, template: "<ax-search-query\n  placeholder=\"groups.overview.search.placeholder\"\n  [formControl]=\"query\"\n></ax-search-query>\n\n<div\n  class=\"loading\"\n  *ngIf=\"(members$ | async) === null && (error$ | async) === false; else results\"\n>\n  {{ 'label.loading' | translate }}...\n</div>\n\n<ng-template #results>\n  <div class=\"results\" *ngIf=\"(members$ | async)?.length; else noResults\">\n    <ax-profile-cell\n      *ngFor=\"let member of membersSorted$ | async\"\n      [profile]=\"member\"\n    ></ax-profile-cell>\n  </div>\n</ng-template>\n\n<ng-template #noResults>\n  <div\n    class=\"no-results\"\n    *ngIf=\"!(members$ | async)?.length && (error$ | async) === false; else error\"\n  >\n    <p>{{ 'search.results.absence' | translate }}</p>\n  </div>\n</ng-template>\n\n<ng-template #error>\n  <div class=\"error\" *ngIf=\"error$ | async\">\n    <p>{{ 'group-search.error' | translate }}</p>\n  </div>\n</ng-template>\n", styles: ["ax-search-query{margin:1rem}.loading{padding:0 1rem 1rem;color:#7a8692}.no-results,.error{padding:0 1rem 1rem;margin:0 auto;text-align:center;max-width:320px;color:#7a8692}.no-results p,.error p{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.SearchQueryComponent, selector: "ax-search-query", inputs: ["autofocus", "placeholder"], outputs: ["immediatlySearch"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5.ProfileCellComponent, selector: "ax-profile-cell", inputs: ["profile"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-group-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ax-search-query\n  placeholder=\"groups.overview.search.placeholder\"\n  [formControl]=\"query\"\n></ax-search-query>\n\n<div\n  class=\"loading\"\n  *ngIf=\"(members$ | async) === null && (error$ | async) === false; else results\"\n>\n  {{ 'label.loading' | translate }}...\n</div>\n\n<ng-template #results>\n  <div class=\"results\" *ngIf=\"(members$ | async)?.length; else noResults\">\n    <ax-profile-cell\n      *ngFor=\"let member of membersSorted$ | async\"\n      [profile]=\"member\"\n    ></ax-profile-cell>\n  </div>\n</ng-template>\n\n<ng-template #noResults>\n  <div\n    class=\"no-results\"\n    *ngIf=\"!(members$ | async)?.length && (error$ | async) === false; else error\"\n  >\n    <p>{{ 'search.results.absence' | translate }}</p>\n  </div>\n</ng-template>\n\n<ng-template #error>\n  <div class=\"error\" *ngIf=\"error$ | async\">\n    <p>{{ 'group-search.error' | translate }}</p>\n  </div>\n</ng-template>\n", styles: ["ax-search-query{margin:1rem}.loading{padding:0 1rem 1rem;color:#7a8692}.no-results,.error{padding:0 1rem 1rem;margin:0 auto;text-align:center;max-width:320px;color:#7a8692}.no-results p,.error p{margin-bottom:0}\n"] }]
        }], ctorParameters: function () {
        return [{ type: i1.HttpClientService }, { type: undefined, decorators: [{
                        type: Optional
                    }, {
                        type: Inject,
                        args: [BASE_URL]
                    }] }];
    }, propDecorators: { groupId: [{
                type: Input
            }] } });

class GroupSearchModule {
}
GroupSearchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
GroupSearchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchModule, declarations: [GroupSearchComponent], imports: [CommonModule,
        SearchQueryModule,
        ReactiveFormsModule,
        ProfileCellModule,
        HelperPipesModule], exports: [GroupSearchComponent] });
GroupSearchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchModule, imports: [CommonModule,
        SearchQueryModule,
        ReactiveFormsModule,
        ProfileCellModule,
        HelperPipesModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: GroupSearchModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [GroupSearchComponent],
                    imports: [
                        CommonModule,
                        SearchQueryModule,
                        ReactiveFormsModule,
                        ProfileCellModule,
                        HelperPipesModule,
                    ],
                    exports: [GroupSearchComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { GroupSearchComponent, GroupSearchModule };
//# sourceMappingURL=aztrix-components-group-search.mjs.map
//# sourceMappingURL=aztrix-components-group-search.mjs.map
