import { __decorate } from "tslib";
import { Component, Input } from '@angular/core';
import { UserFormComponent } from './user-form.component';
import { debounceTime, distinctUntilChanged, finalize } from 'rxjs/operators';
import { UntilDestroy } from '@ngneat/until-destroy';
import { ActionPopupComponent } from '../action-popup';
import { UserTypeEnum } from './user-type.enum';
import { TechlifyListingControllerInterface } from '../base-model';
import * as i0 from "@angular/core";
import * as i1 from "../core";
import * as i2 from "./current-user.service";
import * as i3 from "../user-config";
import * as i4 from "@angular/material/dialog";
import * as i5 from "./user.service";
import * as i6 from "@angular/forms";
import * as i7 from "../request-helper/request-helper.service";
import * as i8 from "@angular/router";
import * as i9 from "@angular/common";
import * as i10 from "@angular/material/button";
import * as i11 from "@angular/material/form-field";
import * as i12 from "@angular/material/icon";
import * as i13 from "@angular/material/input";
import * as i14 from "@angular/material/sort";
import * as i15 from "@angular/material/table";
import * as i16 from "@angular/material/card";
import * as i17 from "@angular/material/tooltip";
import * as i18 from "@angular/material/button-toggle";
import * as i19 from "@angular/material/progress-bar";
import * as i20 from "@angular/flex-layout/flex";
import * as i21 from "@angular/flex-layout/extended";
import * as i22 from "ngx-infinite-scroll";
import * as i23 from "../searchable-selector/searchable-selector.component";
import * as i24 from "./user-enable-button-component/user-enable-button.component";
let UsersViewAllComponent = class UsersViewAllComponent extends TechlifyListingControllerInterface {
    constructor(http, alertService, currentUserService, userConfigService, dialog, userService, fb, requestHelperService, activatedRoute) {
        super();
        this.http = http;
        this.alertService = alertService;
        this.currentUserService = currentUserService;
        this.userConfigService = userConfigService;
        this.dialog = dialog;
        this.userService = userService;
        this.fb = fb;
        this.requestHelperService = requestHelperService;
        this.activatedRoute = activatedRoute;
        this.userTypeIds = [];
        this.isWorking = false;
        this.title = 'User Management';
        this.pageEvent = { page: 1, perPage: 25, lastPage: 1 };
        this.displayedColumns = [
            'index',
            'name',
            'email',
            'type',
            'roles',
            'last_login',
            'added_by',
            'actions'
        ];
        this.scrollContainer = '.mat-sidenav-content';
        this.models = [];
        this.lastPage = 0;
        this.config = this.userConfigService.getConfig();
        if (this.config?.scrollContainer) {
            // Set to null if scroll has to be done from root
            this.scrollContainer = this.config?.scrollContainer === 'root' ? null : this.config?.scrollContainer;
        }
    }
    // tslint:disable-next-line:typedef
    ngOnInit() {
        // create the filter form
        this.createForm();
        this.currentUser = this.currentUserService.getUser();
        this.filterForm.valueChanges.subscribe({
            next: (value) => {
                const params = this.requestHelperService.convertToFormData(value);
                this.requestHelperService.updateQueryParams(params);
            }
        });
        // update form with query params
        this.requestHelperService.updateFormWithQueryParams(this.filterForm, {
            role_ids: { multiple: true },
            status: { multiple: true },
        });
        // listen for route change
        this.activatedRoute.queryParams
            .pipe(debounceTime(800), distinctUntilChanged())
            .subscribe(() => {
            this.reload();
        });
    }
    createForm() {
        this.filterForm = this.fb.group({
            search: [''],
            role_ids: [''],
            status: ['enabled'],
            sort_by: ['id|ASC'],
            relations: ['roles,type,userClients.type,creator,userClient'],
            appends: ['last_login'],
            client_id: [this.clientId]
        });
    }
    loadData() {
        this.isWorking = true;
        let params = this.requestHelperService.convertToFormData(this.filterForm.value);
        const clientId = this.clientId ?? this.currentUser?.client_id;
        params = { ...params, num_items: `${this.pageEvent.perPage}|${this.pageEvent.page}`, user_type_ids: this.userTypeIds.toString() };
        this.http.get('api/users', { params }).subscribe({
            next: (result) => {
                this.isWorking = false;
                this.models = this.models.concat(result?.data);
                this.pageEvent.page = result.current_page;
                this.pageEvent.lastPage = result.last_page;
                this.models.forEach((userData) => {
                    const client = (userData?.user_clients || [])
                        .find((userClient) => userClient.client_id === clientId && userClient.user_id === userData.id);
                    if (client) {
                        userData.user_type_id = client.user_type_id;
                        userData.client_id = client.client_id;
                    }
                });
            },
            error: () => this.isWorking = false
        });
    }
    createOrEditUser(user) {
        user = user ? user : {};
        user.client_id = this.clientId ?? this.currentUser?.client_id;
        const dialogRef = this.dialog.open(UserFormComponent, {
            width: '700px',
            data: user,
            autoFocus: false,
            restoreFocus: false
        });
        dialogRef.afterClosed().subscribe(async (result) => {
            if (result) {
                this.reload();
            }
        });
    }
    deleteUser(user) {
        if (this.currentUser.id !== user?.id) {
            const dialogRef = this.dialog.open(ActionPopupComponent, {
                width: '400px',
                data: {
                    title: 'Deleting User',
                    message: `Are you sure to proceed deleting the user ${user.name}?`
                },
                autoFocus: false
            });
            dialogRef.afterClosed().subscribe(async (result) => {
                if (result) {
                    // Action confirmed
                    await this.userService.deleteUser(user.id, { client_id: user.client_id });
                    this.reload();
                }
            });
        }
        else {
            this.alertService.addAlert('Current user cannot be deleted', 'warn');
        }
    }
    /**
     * Handle the sort change event.
     * @param sort Sort
     */
    onSortChange(sort) {
        const direction = sort.direction ? sort.direction : 'asc';
        const column = sort.active ? sort.active : 'id';
        this.filterForm.get('sort_by').setValue(column + '|' + direction);
    }
    reload() {
        this.models = [];
        this.pageEvent = { page: 1, perPage: 25, lastPage: 1 };
        this.loadData();
    }
    onScroll() {
        if (this.pageEvent.lastPage > this.pageEvent.page) {
            this.pageEvent.page += 1;
            this.loadData();
        }
    }
    /**
     * Get the user type for the current client.
     *
     * @param user User
     */
    getUserType(user) {
        let userClient;
        if (this.currentUserService.getUser()?.user_type_id === UserTypeEnum.ADMIN && !!this.clientId) {
            userClient = (user?.user_clients).find((item) => item?.client_id === this.clientId);
        }
        else {
            userClient = (user?.user_clients).find((item) => item?.client_id === this.currentUser?.client_id);
        }
        return userClient?.type?.title || '';
    }
    resetPassword(user) {
        this.isWorking = true;
        this.userService.resetPassword(user)
            .pipe(finalize(() => this.isWorking = false))
            .subscribe(_ => this.alertService.addAlert('Password reset email sent', 'success'));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UsersViewAllComponent, deps: [{ token: i1.HttpService }, { token: i1.AlertService }, { token: i2.CurrentUserService }, { token: i3.UserConfigService }, { token: i4.MatDialog }, { token: i5.UserService }, { token: i6.UntypedFormBuilder }, { token: i7.RequestHelperService }, { token: i8.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UsersViewAllComponent, selector: "app-users-view-all", inputs: { clientId: "clientId", userTypeIds: "userTypeIds", title: "title" }, usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n          *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n          (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\"\n          *ngIf=\"config?.userConfig?.showImportButton && currentUserService?.hasPermission('user_create')\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n          *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n          *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n            <span class=\"material-icons-outlined\">\n              toggle_on\n            </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n          *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n            <span class=\"material-icons-outlined\">\n              vpn_lock\n            </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" fxLayout fxLayoutAlign=\"end start\" fxLayoutGap=\"0.3rem\">\n        <mat-form-field appearance=\"outline\" style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\"\n            formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field appearance=\"outline\" style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group [hideSingleSelectionIndicator]=\"true\" [hideMultipleSelectionIndicator]=\"true\"\n          formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n        [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n        [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              <!-- !element?.user_client condition added to check if user has user_client record -->\n              {{ !element?.user_client ? '' : element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap text-light\">\n              <span *ngFor=\"let role of element?.roles\" class=\"badge bg-secondary\">\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('techlify_rbac.user.reset_password')\" type=\"button\"\n                mat-icon-button (click)=\"resetPassword(element)\" matTooltip=\"Reset User Password\">\n                <mat-icon>refresh</mat-icon>\n              </button>\n\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>", dependencies: [{ kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i10.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i10.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i11.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i11.MatLabel, selector: "mat-label" }, { kind: "component", type: i12.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i14.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i14.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i15.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i15.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i15.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i15.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i15.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i15.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i15.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i15.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i15.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i15.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i16.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i16.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i17.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i18.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i18.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: i19.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i20.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i20.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i20.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i21.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i22.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: i23.SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "panelWidth", "focusSearchOnOpen", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }, { kind: "component", type: i24.UserEnableButtonComponent, selector: "app-user-enable-button", inputs: ["user", "isUseIcons"], outputs: ["onSave"] }, { kind: "pipe", type: i9.DatePipe, name: "date" }] }); }
};
UsersViewAllComponent = __decorate([
    UntilDestroy()
], UsersViewAllComponent);
export { UsersViewAllComponent };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UsersViewAllComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-users-view-all', template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n          *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n          (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\"\n          *ngIf=\"config?.userConfig?.showImportButton && currentUserService?.hasPermission('user_create')\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n          *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n          *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n            <span class=\"material-icons-outlined\">\n              toggle_on\n            </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n          *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n            <span class=\"material-icons-outlined\">\n              vpn_lock\n            </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" fxLayout fxLayoutAlign=\"end start\" fxLayoutGap=\"0.3rem\">\n        <mat-form-field appearance=\"outline\" style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\"\n            formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field appearance=\"outline\" style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group [hideSingleSelectionIndicator]=\"true\" [hideMultipleSelectionIndicator]=\"true\"\n          formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n        [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n        [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              <!-- !element?.user_client condition added to check if user has user_client record -->\n              {{ !element?.user_client ? '' : element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap text-light\">\n              <span *ngFor=\"let role of element?.roles\" class=\"badge bg-secondary\">\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('techlify_rbac.user.reset_password')\" type=\"button\"\n                mat-icon-button (click)=\"resetPassword(element)\" matTooltip=\"Reset User Password\">\n                <mat-icon>refresh</mat-icon>\n              </button>\n\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>" }]
        }], ctorParameters: () => [{ type: i1.HttpService }, { type: i1.AlertService }, { type: i2.CurrentUserService }, { type: i3.UserConfigService }, { type: i4.MatDialog }, { type: i5.UserService }, { type: i6.UntypedFormBuilder }, { type: i7.RequestHelperService }, { type: i8.ActivatedRoute }], propDecorators: { clientId: [{
                type: Input
            }], userTypeIds: [{
                type: Input
            }], title: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 