import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/router";
import * as i2 from "@angular/common";
import * as i3 from "../avatar-photo/avatar-photo.component";
import * as i4 from "@angular/material/icon";
import * as i5 from "@angular/material/legacy-card";
// import { ConnectionHoverService } from './connection-hover.servive'
// import { NSProfileDataV2 } from '../../../profile-v2/models/profile-v2.model'
// import { ConnectionHoverService } from '../connection-name/connection-hover.servive'
export class ConnectionHoverCardComponent {
    // hoverUser!: NSProfileDataV2.IProfile
    constructor(router, activeRoute) {
        this.router = router;
        this.activeRoute = activeRoute;
        if (this.activeRoute.parent) {
            this.me = this.activeRoute.parent.snapshot.data.me;
        }
        // this.connectionHoverService.fetchProfile(this.userId).subscribe((fp: NSProfileDataV2.IProfile) => {
        //   this.hoverUser = fp
        // })
    }
    ngOnInit() {
    }
    ngAfterViewInit() {
        // const userId = this.user.id || this.user.identifier
    }
    get getUserName() {
        let name = 'Guest';
        if (this.hoverUser && !this.hoverUser.personalDetails) {
            if (this.hoverUser.firstName) {
                name = `${this.hoverUser.firstName} ${this.hoverUser.lastName}`;
            }
            else {
                name = `${this.hoverUser.name}`;
            }
        }
        else if (this.hoverUser && this.hoverUser.personalDetails) {
            if (this.hoverUser.personalDetails.middlename) {
                // tslint:disable-next-line: max-line-length
                name = `${this.hoverUser.personalDetails.firstname} ${this.hoverUser.personalDetails.middlename} ${this.hoverUser.personalDetails.surname}`;
            }
            else if (this.hoverUser.personalDetails.firstName) {
                name = `${this.hoverUser.personalDetails.firstName} ${this.hoverUser.personalDetails.surname}`;
            }
            else {
                name = `${this.hoverUser.personalDetails.firstname} ${this.hoverUser.personalDetails.surname}`;
            }
        }
        return name;
    }
    getUseravatarName() {
        let name = 'Guest';
        if (this.hoverUser && !this.hoverUser.personalDetails) {
            if (this.hoverUser.firstName) {
                name = `${this.hoverUser.firstName} ${this.hoverUser.lastName}`;
            }
            else {
                name = `${this.hoverUser.name}`;
            }
        }
        else if (this.hoverUser && this.hoverUser.personalDetails) {
            if (this.hoverUser.personalDetails.middlename) {
                // tslint:disable-next-line: max-line-length
                name = `${this.hoverUser.personalDetails.firstname} ${this.hoverUser.personalDetails.middlename} ${this.hoverUser.personalDetails.surname}`;
            }
            else if (this.hoverUser.personalDetails.firstName) {
                name = `${this.hoverUser.personalDetails.firstName} ${this.hoverUser.personalDetails.surname}`;
            }
            else {
                name = `${this.hoverUser.personalDetails.firstname} ${this.hoverUser.personalDetails.surname}`;
            }
        }
        return name;
    }
    goToUserProfile() {
        this.router.navigate(['/app/person-profile', (this.hoverUser.id)]);
        // this.router.navigate(['/app/person-profile'], { queryParams: { emailId: } })
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConnectionHoverCardComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConnectionHoverCardComponent, selector: "ws-widget-connection-hover-card", inputs: { hoverUser: "hoverUser" }, host: { classAttribute: "flex flex-1" }, ngImport: i0, template: "<mat-card class=\"flex flex-col card-container\">\n    <!-- ==========={{hoverUser | json}}================ -->\n    <!-- <div class=\"flex flex-col card-container\"> -->\n    <div class=\"photo-container flex items-center justify-center\">\n        <div class=\"fixd\" i18n-aria-label role=\"link\" aria-label=\"click on it to visit user profile\">\n            <ws-widget-avatar-photo [name]=\"getUseravatarName()\" [photoUrl]=\"hoverUser?.photo\" size=\"l-s\">\n            </ws-widget-avatar-photo>\n            <span class=\"profile-badge\" *ngIf=\"hoverUser?.verifiedKarmayogi\">  <img class=\"profile-badge\" src=\"fusion-assets/images/profile-badge.png\" height=\"18\">\n            </span>\n            \n        </div>\n    </div>\n    <mat-card-content class=\"name-container flex flex-col width-expand\">\n        <div *ngIf=\"hoverUser\" class=\"margin-top-xs\" i18n-aria-label role=\"link\">\n            <div class=\"mat-title name ws-mat-black-text truncate\">\n                <!-- {{hoverUser?.personalDetails?.firstname}}{{' '}}{{hoverUser?.personalDetails?.middlename}}\n                {{' '}}{{hoverUser?.personalDetails?.surname}} -->\n                {{getUserName}}\n            </div>\n            <!-- *ngFor=\"let pro of hoverUser?.professionalDetails\" -->\n            <div class=\"flex flex-1\" >\n                <span class=\"mat-body-1 ws-mat-black60-text truncate\">\n                    {{hoverUser?.designation || hoverUser?.designationOther}}\n                </span>\n                <span *ngIf=\"hoverUser?.designation || hoverUser?.designationOther\" class=\"mat-body-1 ws-mat-black60-text\">&nbsp;at &nbsp;</span>\n                <div class=\"designation ws-mat-black60-text truncate\">\n                    {{hoverUser?.department}}\n                </div>\n            </div>\n            <!-- <mat-divider class=\"p-inherit margin-top-s margin-bottom-s\"></mat-divider> -->\n\n            <div class=\"flex flex-1 flex-column\">\n                <!-- <div class=\"flex flex-1 m-margin cursor-pointer\">\n                    <mat-icon>call</mat-icon>\n                    <a *ngIf=\"hoverUser?.personalDetails?.mobile\" href=\"tel:{{hoverUser?.personalDetails?.mobile}}\">\n                        <span class=\"mat-body-2 margin-left-s ws-mat-black60-text\">\n                            {{hoverUser?.personalDetails?.mobile || 'Not available'}}\n                        </span>\n                    </a>\n                    <span *ngIf=\"!hoverUser?.personalDetails?.mobile\" class=\"mat-body-2 margin-left-s\">\n                        {{'Not available'}}\n                    </span>\n                </div> -->\n                <!-- <div class=\"flex flex-1 m-margin cursor-pointer\">\n                    <mat-icon>email</mat-icon>\n                    <a *ngIf=\"hoverUser?.personalDetails?.primaryEmail\"\n                        href=\"mailto:{{hoverUser?.personalDetails?.primaryEmail}}\">\n                        <span class=\"mat-body-2 margin-left-s ws-mat-black60-text\">\n                            {{hoverUser?.personalDetails?.primaryEmail || 'Not available'}}\n                        </span>\n                    </a>\n                    <span *ngIf=\"!hoverUser?.personalDetails?.primaryEmail\" class=\"mat-body-2 margin-left-s\">\n                        {{'Not available'}}\n                    </span>\n                </div> -->\n                <div class=\"flex flex-1 m-margin margin-bottom-s cursor-pointer\">\n                    <a role=\"link\" class=\"flex ws-mat-default-text\" (click)=\"goToUserProfile()\">\n                        <mat-icon>group</mat-icon>\n                        <span class=\"mat-body-2 margin-left-s\" >{{'Network Profile'}}</span>\n                    </a>\n                </div>\n            </div>\n\n        </div>\n    </mat-card-content>\n    <!-- </div> -->\n</mat-card>\n\n\n<!-- (click)=\"goToUserProfile(user)\" -->\n", styles: [".card-container{height:238px;width:320px;border-radius:12px-8px;padding:0;min-height:238px;min-width:320px}.m-t-fix{margin-top:40px}.fixd{position:absolute;display:flex;left:24px;top:31px}.photo-container{background:#f8f4f9;padding:16px 0;min-height:60px}.name-container{padding:16px 24px}.name{text-transform:capitalize}.designation{line-height:21px}.action-container{padding:16px 0}.m-margin{margin-top:8px}.p-inherit{position:inherit!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.AvatarPhotoComponent, selector: "ws-widget-avatar-photo", inputs: ["datalen", "photoUrl", "name", "size", "randomColor", "initials", "showBadge"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i5.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConnectionHoverCardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ws-widget-connection-hover-card', host: { class: 'flex flex-1' }, template: "<mat-card class=\"flex flex-col card-container\">\n    <!-- ==========={{hoverUser | json}}================ -->\n    <!-- <div class=\"flex flex-col card-container\"> -->\n    <div class=\"photo-container flex items-center justify-center\">\n        <div class=\"fixd\" i18n-aria-label role=\"link\" aria-label=\"click on it to visit user profile\">\n            <ws-widget-avatar-photo [name]=\"getUseravatarName()\" [photoUrl]=\"hoverUser?.photo\" size=\"l-s\">\n            </ws-widget-avatar-photo>\n            <span class=\"profile-badge\" *ngIf=\"hoverUser?.verifiedKarmayogi\">  <img class=\"profile-badge\" src=\"fusion-assets/images/profile-badge.png\" height=\"18\">\n            </span>\n            \n        </div>\n    </div>\n    <mat-card-content class=\"name-container flex flex-col width-expand\">\n        <div *ngIf=\"hoverUser\" class=\"margin-top-xs\" i18n-aria-label role=\"link\">\n            <div class=\"mat-title name ws-mat-black-text truncate\">\n                <!-- {{hoverUser?.personalDetails?.firstname}}{{' '}}{{hoverUser?.personalDetails?.middlename}}\n                {{' '}}{{hoverUser?.personalDetails?.surname}} -->\n                {{getUserName}}\n            </div>\n            <!-- *ngFor=\"let pro of hoverUser?.professionalDetails\" -->\n            <div class=\"flex flex-1\" >\n                <span class=\"mat-body-1 ws-mat-black60-text truncate\">\n                    {{hoverUser?.designation || hoverUser?.designationOther}}\n                </span>\n                <span *ngIf=\"hoverUser?.designation || hoverUser?.designationOther\" class=\"mat-body-1 ws-mat-black60-text\">&nbsp;at &nbsp;</span>\n                <div class=\"designation ws-mat-black60-text truncate\">\n                    {{hoverUser?.department}}\n                </div>\n            </div>\n            <!-- <mat-divider class=\"p-inherit margin-top-s margin-bottom-s\"></mat-divider> -->\n\n            <div class=\"flex flex-1 flex-column\">\n                <!-- <div class=\"flex flex-1 m-margin cursor-pointer\">\n                    <mat-icon>call</mat-icon>\n                    <a *ngIf=\"hoverUser?.personalDetails?.mobile\" href=\"tel:{{hoverUser?.personalDetails?.mobile}}\">\n                        <span class=\"mat-body-2 margin-left-s ws-mat-black60-text\">\n                            {{hoverUser?.personalDetails?.mobile || 'Not available'}}\n                        </span>\n                    </a>\n                    <span *ngIf=\"!hoverUser?.personalDetails?.mobile\" class=\"mat-body-2 margin-left-s\">\n                        {{'Not available'}}\n                    </span>\n                </div> -->\n                <!-- <div class=\"flex flex-1 m-margin cursor-pointer\">\n                    <mat-icon>email</mat-icon>\n                    <a *ngIf=\"hoverUser?.personalDetails?.primaryEmail\"\n                        href=\"mailto:{{hoverUser?.personalDetails?.primaryEmail}}\">\n                        <span class=\"mat-body-2 margin-left-s ws-mat-black60-text\">\n                            {{hoverUser?.personalDetails?.primaryEmail || 'Not available'}}\n                        </span>\n                    </a>\n                    <span *ngIf=\"!hoverUser?.personalDetails?.primaryEmail\" class=\"mat-body-2 margin-left-s\">\n                        {{'Not available'}}\n                    </span>\n                </div> -->\n                <div class=\"flex flex-1 m-margin margin-bottom-s cursor-pointer\">\n                    <a role=\"link\" class=\"flex ws-mat-default-text\" (click)=\"goToUserProfile()\">\n                        <mat-icon>group</mat-icon>\n                        <span class=\"mat-body-2 margin-left-s\" >{{'Network Profile'}}</span>\n                    </a>\n                </div>\n            </div>\n\n        </div>\n    </mat-card-content>\n    <!-- </div> -->\n</mat-card>\n\n\n<!-- (click)=\"goToUserProfile(user)\" -->\n", styles: [".card-container{height:238px;width:320px;border-radius:12px-8px;padding:0;min-height:238px;min-width:320px}.m-t-fix{margin-top:40px}.fixd{position:absolute;display:flex;left:24px;top:31px}.photo-container{background:#f8f4f9;padding:16px 0;min-height:60px}.name-container{padding:16px 24px}.name{text-transform:capitalize}.designation{line-height:21px}.action-container{padding:16px 0}.m-margin{margin-top:8px}.p-inherit{position:inherit!important}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i1.ActivatedRoute }]; }, propDecorators: { hoverUser: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 