@chat21/chat21-ionic 3.0.82-rc.7 → 3.0.83

package/src/app/components/navbar/navbar.component.html

@@ -1,103 +0,0 @@
-<ion-navbar class="navbar navbar-absolute">
-  <div class="container-fluid">
-      <!-- <div class="navbar-left">
-        left
-      </div> -->
-      <div class="navbar-right">
-        <!-- test site -->
-        <ng-container *ngIf="project">
-          <button class="btn simulate-visitor-btn btn-success-no-boxshadow " (click)="testWidgetPage()">
-            <i class="material-icons" style="padding-top: 0px;font-size: 24px;">play_arrow</i>
-            {{translationsMap.get('NAVBAR.SIMULATE_VISITOR')}}
-          </button>
-        </ng-container>
-
-        <!--  ------ PROJECTS  DROPDOWN ------ -->
-        <ng-container *ngIf="project">
-            <li>
-              <button class="btn dropdown-toggle project-dropdown" (click)="openDropdownProjects = !openDropdownProjects">
-                <i class="material-icons" style="margin-right: 3px;">keyboard_arrow_down</i>
-                <span style="text-transform: none"> {{ project?.id_project?.name }} </span>
-              </button>
-              <div class="ripple-container"></div>
-              <div id="navbar_dropdown" class="dropdown-menu" [ngClass]="{'open': openDropdownProjects}">
-                
-                <!--  PROJECT SETTINGS  -->
-                <!-- <li *ngIf="USER_ROLE !== 'agent'">
-                  <a (click)="onClickDropdownOption('projectSettings')">
-                    <i class="material-icons" style="padding-right: 5px; margin-bottom: 2px; font-size: 20px">settings</i>
-                    {{translationsMap?.get('NAVBAR.PROJECT_SETTINGS')}}
-                  </a>
-                </li> -->
-  
-                <!--  ALL PROJECTS -->
-                <li (click)="onClickDropdownOption('allProjects')">
-                  <a style="cursor: pointer">
-                    <i class="material-icons" style="padding-right: 5px; margin-bottom: 2px; font-size: 20px">view_list</i>
-                    {{translationsMap?.get('NAVBAR.VIEW_ALL_PROJECTS')}}
-                  </a>
-                </li>
-  
-                <!--  ADD PROJECT -->
-                <li id="navbar_create_prjct" *ngIf="MT === true" (click)="onClickDropdownOption('addProject')">
-                  <a style="cursor: pointer">
-                    <i class="material-icons" style="padding-right: 5px; margin-bottom: 2px; font-size: 20px">add_circle_outline </i>
-                    {{translationsMap?.get('NAVBAR.ADD_PROJECT')}}
-                  </a>
-                </li>
-  
-                <li class="divider"></li>
-  
-                <!--  RECENT PROJECTS -->
-                <li>
-                  <span style="padding-left: 24px;font-size: 12px; color: rgb(118,149,165);font-weight: 400">
-                    {{translationsMap?.get('NAVBAR.RECENT_PROJECTS')}}
-                  </span>
-                </li>
-                <!-- 
-                ***** ngFor - reverse order of output using the index *****
-                Reverse() works in place. It means, it will change the original array. 
-                Slice without parameters returns a copy of projects, so original array, in this case, stays unchanged.  
-                let prjct of projects?.reverse()
-                -->
-                <!-- *ngFor="let prjct of projects?.slice().reverse() | slice:0:5; let i=index" -->
-                <li *ngFor="let prjct of projects?.slice() | slice:0:5; let i=index" style="cursor: pointer">
-                  <a (click)="goToHome(prjct?.id_project?._id, prjct?.id_project?.name)"
-                    [ngClass]="{'li-selected' : prjct?.id_project?._id === project?.id_project?.id }">
-  
-                    <span> {{ prjct?.id_project?.name }} </span>
-                  </a>
-                </li>
-
-                <ng-container *ngIf="projects?.length > 5">
-                  <li class="divider"></li>
-                  <li>
-                    <span style="padding-left: 24px;font-size: 12px; color: rgb(118,149,165);font-weight: 400">
-                      {{translationsMap?.get('NAVBAR.OTHER_PROJECTS')}}
-                    </span>
-                  </li>
-    
-                  <!-- *ngFor="let prjct of projects?.slice().reverse() | slice:5:10; let i=index" -->
-                  <li *ngFor="let prjct of projects?.slice() | slice:5:10; let i=index" style="cursor: pointer">
-                    <a (click)="goToHome(prjct?.id_project?._id, prjct?.id_project?.name)">
-                      {{ prjct?.id_project?.name }}
-                    </a>
-                  </li>
-                </ng-container>
-  
-              </div>
-            </li>
-        </ng-container>
-
-        <!--  Sound on / off -->
-        <ng-container *ngIf="project">
-          <button class="btn volume" style="cursor: pointer;" *ngIf="isSoundEnabled" (click)="onClickSound('disabled')">
-            <i class="material-icons">volume_up</i>
-          </button>
-          <button class="btn volume" style="cursor: pointer;" *ngIf="!isSoundEnabled" (click)="onClickSound('enabled')">
-            <i class="material-icons">volume_off</i>
-          </button>
-        </ng-container>
-      </div>
-  </div>
-</ion-navbar>

package/src/app/components/navbar/navbar.component.scss

@@ -1,249 +0,0 @@
-.navbar-absolute{
-    position: absolute;
-    width: calc(100%  - var(--sidebar-width));
-    margin-left: var(--sidebar-width);
-    padding-top: 5px;
-    z-index: 1;
-    padding-bottom: 5px;
-    border-bottom: 1px solid #e7e7e7;
-    top: 0;
-
-    -webkit-font-smoothing: auto;
-}
-
-.navbar{
-    background-color: #fff;
-    color: #555;
-    min-height: var(--nav-bar-heigth);
-    transition: all 150ms ease 0s;
-}
-
-.container-fluid{
-    padding-right: 15px;
-    padding-left: 15px;
-    margin-right: auto;
-    margin-left: auto;
-
-    width: 100%;
-}
-
-ion-navbar{
-    display: flex;
-    align-items: center;
-}
-
-.navbar-collapse{
-    border-top: none;
-    box-shadow: none;
-
-    padding-right: 15px;
-    padding-left: 15px;
-}
-
-.navbar-right{
-    float: right;
-
-    display: inline-flex;
-    align-items: center;
-}
-
-.navbar-left{
-    float: left;
-}
-
-.simulate-visitor-btn{
-    font-size: 12px;
-    padding: 0px 11px 0px 4px !important;
-    max-height: 24px;
-    border-radius: 30px;
-    font-family: 'Poppins';
-
-    box-shadow: unset!important;
-    text-transform: none!important;
-    background: #3ecf8e!important;
-    color: #fff;
-
-}
-
-.btn{
-    display: flex;
-    position: relative;
-    flex-flow: row nowrap;
-    align-items: center;
-    justify-content: center;
-
-    border: 1px solid transparent;
-    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
-}
-
-
-.dropdown-toggle, .volume{
-    background-color: transparent;
-    color: inherit;
-
-    padding: 0px 15px;
-    font-weight: 400;
-}
-
-.project-dropdown {
-    max-width: 180px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    font-size: 12px;
-}
-
-li{
-    position: relative;
-    display: block
-}
-
-.dropdown-menu {
-    border-radius: 3px;
-    box-shadow: 0 2px 5px 0 rgb(0, 0, 0, 0.26);
-
-    position: absolute;
-    top: 100%;
-    right: 0;
-    left: auto;
-    z-index: 1000;
-    display: none;
-    float: left;
-    min-width: 160px;
-    padding: 5px 0;
-    margin: 2px 0 0;
-    font-size: 14px;
-    text-align: left;
-    list-style: none;
-    background-color: #fff;
-    -webkit-background-clip: padding-box;
-    background-clip: padding-box;
-}
-.dropdown-menu{
-    max-height: 240px;
-    overflow-y: auto;
-}
-.dropdown-menu:not(.open){
-    margin-top: -20px;
-    opacity: 0;
-    visibility: hidden;
-    display: block;
-}
-
-.dropdown-menu.open{
-    margin-top: 12px; //0;
-    opacity: 1;
-    visibility: visible;
-    display: block;
-    transition: all 150ms linear;
-}
-
-.dropdown-menu li {
-    position: relative;
-
-    .li-selected{
-        color: #4285f4;
-        background-color: #eee;
-    }
-}
-
-.dropdown-menu .divider{
-    background-color: rgba(0,0,0,.12);
-    margin: 5px 0;
-
-    height: 1px;
-    overflow: hidden;
-}
-
-.dropdown-menu li>a{
-    font-size: 13px;
-    padding: 10px 20px;
-    margin: 0 5px;
-    border-radius: 2px;
-    transition: all 150ms linear;
-
-    display: block;
-    clear: both;
-    font-weight: 400;
-    line-height: 1.42857143;
-    color: #333;
-    white-space: nowrap;
-    text-decoration: none;
-
-    cursor: pointer;
-
-    .material-icons {
-        vertical-align: middle;
-    }
-
-    &:hover{
-        background-color: #3ea9f5;
-        color: #fff;
-        box-shadow: 0 12px 20px -10px rgba(62, 169, 245, 0.28), 0 4px 20px 0 rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(62, 169, 245, 0.2);
-    }
-}
-
-
-.material-icons {
-    font-family: "Material Icons";
-    font-weight: 400;
-    font-style: normal;
-    font-size: 24px;
-    line-height: 1;
-    letter-spacing: normal;
-    text-transform: none;
-    display: inline-block;
-    white-space: nowrap;
-    word-wrap: normal;
-    direction: ltr;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    text-rendering: optimizeLegibility;
-    font-feature-settings: "liga";
-
-    top: 0;
-    position: relative;
-    font-size: 20px;
-    vertical-align: middle;
-}
-
-.ripple-container {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 1;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-    border-radius: inherit;
-    pointer-events: none;
-
-    .disabled &{
-        display: none;
-    }
-}
-.ripple {
-    position: absolute;
-    width: 20px;
-    height: 20px;
-    margin-left: -10px;
-    margin-top: -10px;
-    border-radius: 100%;
-    background-color: #000; // fallback color
-    background-color: rgba(0,0,0,0.05);
-    transform: scale(1);
-    transform-origin: 50%;
-    opacity: 0;
-    pointer-events: none;
-}
-.ripple.ripple-on {
-    transition: opacity 0.15s ease-in 0s, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
-    opacity: 0.1;
-}
-.ripple.ripple-out {
-    transition: opacity 0.1s linear 0s !important;
-    opacity: 0;
-}
-
-
-

package/src/app/components/navbar/navbar.component.ts

@@ -1,190 +0,0 @@
-import { AppConfigProvider } from 'src/app/services/app-config';
-import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk-auth.service';
-import { EventsService } from 'src/app/services/events-service';
-import { ProjectsService } from './../../services/projects/projects.service';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
-import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
-import { Project } from 'src/chat21-core/models/projects';
-import { CustomTranslateService } from 'src/chat21-core/providers/custom-translate.service';
-
-@Component({
-  selector: 'app-navbar',
-  templateUrl: './navbar.component.html',
-  styleUrls: ['./navbar.component.scss'],
-})
-export class NavbarComponent implements OnInit {
-
-  @Input() isSoundEnabled: boolean;
-  @Output() onSoundChange = new EventEmitter<string>();
-
-  private logger: LoggerService = LoggerInstance.getInstance();
-  private tiledeskToken: string;
-
-  public projects: Project[];
-  public project: any;
-  private USER_ROLE: string;
-
-  public translationsMap: Map<string, string> = new Map();
-
-  public openDropdownProjects: boolean = false
-  private public_Key: string;
-  public isVisible: boolean;
-  public MT: boolean;
-
-  constructor(
-    private projectsService: ProjectsService,
-    private tiledeskAuthService: TiledeskAuthService,
-    private appConfigProvider: AppConfigProvider,
-    private translateService: CustomTranslateService, 
-    private events: EventsService,  
-  ) { }
-
-  ngOnInit() {
-    this.listenToUserGoOnline();
-    this.getStoredProjectAndUserRole();
-    this.initTranslations();
-    this.getOSCODE();
-  }
-
-  initTranslations(){
-    let keys= [
-      "NAVBAR.SIMULATE_VISITOR",
-      "NAVBAR.PROJECT_SETTINGS",
-      "NAVBAR.VIEW_ALL_PROJECTS",
-      "NAVBAR.ADD_PROJECT",
-      "NAVBAR.RECENT_PROJECTS",
-      "NAVBAR.OTHER_PROJECTS"
-    ]
-
-    this.translationsMap = this.translateService.translateLanguage(keys)
-  }
-
-  listenToUserGoOnline(){
-    this.events.subscribe('go:online', (isOnline)=> {
-      this.logger.log('[NAVBAR] listen to go:online --> ', isOnline);
-      if(isOnline){
-        this.tiledeskToken = this.tiledeskAuthService.getTiledeskToken();
-        this.getProjects()
-      }
-    });
-  }
-
-  getProjects() {
-    this.logger.log('[NAVBAR] calling getProjects ... ');
-    this.projectsService.getProjects(this.tiledeskToken).subscribe((projects: any) => {
-      this.logger.log('[NAVBAR] getProjects PROJECTS ', projects);
-      if (projects) {
-          // this.projects = projects;
-          this.projects = projects.filter((project: any) => {
-              // this.logger.log('[NAVBAR] getProjects PROJECTS status ', project.id_project.status);
-              return project.id_project.status === 100;
-          });
-          this.logger.log('[NAVBAR] getProjects this.projects ', this.projects);
-      }
-    }, (error) => {
-        this.logger.error('[NAVBAR] getProjects - ERROR ', error)
-    }, () => {
-        this.logger.log('[NAVBAR] getProjects - COMPLETE')
-    });
-  }
-
-  getStoredProjectAndUserRole() {
-    this.events.subscribe('storage:last_project',project =>{
-      this.logger.log('[NAVBAR] stored_project ', project)
-      if (project && project !== 'undefined') {
-        this.project = project;
-        this.USER_ROLE = project.role;
-      }
-    })
-  }
-
-  getOSCODE() {
-    this.public_Key = this.appConfigProvider.getConfig().t2y12PruGU9wUtEGzBJfolMIgK;
-    this.logger.log('[NAVBAR] AppConfigService getAppConfig public_Key', this.public_Key)
-    this.logger.log('[NAVBAR] public_Key', this.public_Key)
-
-    let keys = this.public_Key.split("-");
-    // this.logger.log('PUBLIC-KEY (Navbar) - public_Key keys', keys)
-
-    keys.forEach(key => {
-        // this.logger.log('NavbarComponent public_Key key', key)
-        if (key.includes("PAY")) {
-            // this.logger.log('PUBLIC-KEY (Navbar) - key', key);
-            let pay = key.split(":");
-            // this.logger.log('PUBLIC-KEY (Navbar) - pay key&value', pay);
-            if (pay[1] === "F") {
-                this.isVisible = false;
-                // this.logger.log('PUBLIC-KEY (Navbar) - pay isVisible', this.isVisible);
-            } else {
-                this.isVisible = true;
-                // this.logger.log('PUBLIC-KEY (Navbar) - pay isVisible', this.isVisible);
-            }
-        }
-
-        if (key.includes("MTT")) {
-            // this.logger.log('PUBLIC-KEY (Navbar) - key', key);
-            let mt = key.split(":");
-            // this.logger.log('PUBLIC-KEY (Navbar) - mt key&value', mt);
-            if (mt[1] === "F") {
-                this.MT = false;
-                // this.logger.log('PUBLIC-KEY (Navbar) - mt is', this.MT);
-            } else {
-                this.MT = true;
-                // this.logger.log('PUBLIC-KEY (Navbar) - mt is', this.MT);
-            }
-        }
-    });
-
-    if (!this.public_Key.includes("MTT")) {
-        this.MT = false;
-        // this.logger.log('PUBLIC-KEY (Navbar) - mt is', this.MT);
-    }
-
-  }
-
-
-  onClickSound(event: string){
-    this.onSoundChange.emit(event)
-  }
-
-
-  testWidgetPage() {
-    const simulateVisitorBtnElem = <HTMLElement>document.querySelector('.simulate-visitor-btn');
-    simulateVisitorBtnElem.blur();
-    // + '&isOpen=true'
-    const url = this.appConfigProvider.getConfig().testsiteBaseUrl + '?tiledesk_projectid=' + this.project.id_project.id + '&project_name=' + this.project.id_project.name + '&role=' + this.USER_ROLE
-    window.open(url, '_blank');
-  }
-
-  onClickDropdownOption(event: string){
-    const baseUrl = this.appConfigProvider.getConfig().dashboardUrl
-    let url = baseUrl
-    if(event === 'projectSettings'){
-      url = baseUrl + '#/project/' + this.project.id_project.id + '/project-settings/general' + '?token=' + this.tiledeskToken
-    }else if(event ==='allProjects'){
-      url = baseUrl + '#/projects/' + '?token=' + this.tiledeskToken
-    }else if('addProject'){
-      url = baseUrl + '#/create-new-project/' + '?token=' + this.tiledeskToken
-    }
-    console.log('onClickDropdownOption-->', url)
-    window.open(url, '_blank');
-  }
-
-  goToHome(id_project: string, project_name: string,) {
-    // this.logger.log('!NAVBAR  goToHome prjct ', prjct)
-    this.logger.log('[NAVBAR] goToHome id_project ', id_project, 'project_name', project_name)
-    // RUNS ONLY IF THE THE USER CLICK OVER A PROJECT WITH THE ID DIFFERENT FROM THE CURRENT PROJECT ID
-    const baseUrl = this.appConfigProvider.getConfig().dashboardUrl
-    if (id_project !== this.project.id_project.id) {
-      // this.subscription.unsubscribe();
-      // this.unsubscribe$.next();
-      // this.unsubscribe$.complete();
-
-      const url = this.appConfigProvider.getConfig().dashboardUrl + `#/project/${id_project}/home`
-      window.open(url, '_blank');
-
-    }
-}
-
-}

package/src/app/services/projects/projects.service.spec.ts

@@ -1,12 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { ProjectsService } from './projects.service';
-
-describe('ProjectsService', () => {
-  beforeEach(() => TestBed.configureTestingModule({}));
-
-  it('should be created', () => {
-    const service: ProjectsService = TestBed.get(ProjectsService);
-    expect(service).toBeTruthy();
-  });
-});

package/src/app/services/projects/projects.service.ts

@@ -1,43 +0,0 @@
-import { HttpClient, HttpHeaders } from '@angular/common/http';
-import { Injectable } from '@angular/core';
-import { map } from 'rxjs/operators';
-import { Project } from 'src/chat21-core/models/projects';
-import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
-import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
-import { AppConfigProvider } from '../app-config';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class ProjectsService {
-
-  private apiUrl: string;
-  private logger: LoggerService = LoggerInstance.getInstance();
-
-  constructor(
-    public http: HttpClient,
-    public appConfigProvider: AppConfigProvider
-  ) {
-   
-    this.logger.log('[PROJECTS-SERVICE] HELLO !');
-    this.apiUrl = appConfigProvider.getConfig().apiUrl;
-    this.logger.log('[PROJECTS-SERVICE] apiUrl ', this.apiUrl);
-  }
-
-  public getProjects(token: string) {
-    const url = this.apiUrl  + "projects/";
-    this.logger.log('[PROJECTS-SERVICE] getProjects - URL ', url);
-
-    const httpOptions = {
-      headers: new HttpHeaders({
-        'Content-Type': 'application/json',
-        Authorization: token
-      })
-    };
-    
-    return this.http.get(url, httpOptions).pipe(map((res: Project[]) => {
-        this.logger.log('[PROJECTS-SERVICE] getProjects - RES ', res);
-        return res
-    }))
-  }
-}

package/src/chat21-core/models/projects.ts

@@ -1,27 +0,0 @@
-export interface Project {
-    _id: string;
-    updatedAt?: any;
-    createdAt?: any;
-    name?: string;
-    activeOperatingHours?: boolean;
-    operatingHours?: any
-    createdBy?: string;
-    id_project?: any;
-    widget?: any;
-    settings?: any;
-    role?: string;
-    user_available?: boolean;
-    profile_name?: any;
-    profile_agents?: any;
-    trial_expired?: any;
-    trial_days_left?: number;
-    trial_days?: number;
-    profile_type?: string;
-    subscription_is_active?: any;
-    profile?: any;
-    subscription_end_date?: any;
-    subscription_id?: any;
-    subscription_creation_date?: any;
-    subscription_start_date?: any;
-    __v?: any;
-}

package/src/chat21-core/utils/convertRequestToConversation.ts

@@ -1,41 +0,0 @@
-import { TYPE_DIRECT, TYPE_SUPPORT_GROUP } from 'src/chat21-core/utils/constants';
-import { ConversationModel } from 'src/chat21-core/models/conversation';
-import { Inject, Injectable, OnInit } from '@angular/core';
-import { avatarPlaceholder, getColorBck } from './utils-user';
-import moment from 'moment';
-
-@Injectable()
-export class ConvertRequestToConversation {
-
-
-    
-    initialize(){
-
-    }
-
-    getConvFromRequest(request: any): ConversationModel{
-        return new ConversationModel(
-            request.request_id,
-            request.attributes,
-            request.request_id && (request.request_id.startsWith('group-') || request.request_id.startsWith('support-group'))? TYPE_SUPPORT_GROUP: TYPE_DIRECT,
-            request.lead && request.lead.fullname ? request.lead.fullname: null,
-            request.requester_id,
-            request.lead && request.lead.fullname ? request.lead.fullname: null,
-            request.requester_id,
-            '',
-            true,
-            request.first_text,
-            request.first_text,
-            request.requester_id,
-            '',
-            request.lead && request.lead.fullname ? request.lead.fullname: null,
-            '0',
-            moment(request.createdAt).unix(),
-            getColorBck(request.lead.fullname),
-            avatarPlaceholder(request.lead.fullname),
-            false,
-            'text'
-        ); 
-    }
-
-}