Merge branch 'master' into features/NEW-IMPROVEMENTS-2-PROD

# Conflicts:
#	src/app/app.component.ts

CHANGELOG.md

@@ -1,5 +1,9 @@
 # tiledesk-dashboard
 
+### 2.7.70
+- Adds an icon on the chatbot cards of the chatbot list page to indicate that the chatbot is available to agents
+- Filters the blocks of the chatbots in the "Reassign conversation" page
+
 ### 2.7.68
 - Fixes logo position in widget setup page preview
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tiledesk/tiledesk-dashboard",
-  "version": "2.7.68",
+  "version": "2.7.70",
   "scripts": {
     "ng": "ng",
     "start": "ng serve --aot",

src/app/app.component.ts

@@ -539,6 +539,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
     }
 
 
+
     containsNumber(str: string): boolean {
         return /\d/.test(str);
     }
@@ -1220,7 +1221,8 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     (this.route.indexOf('/desktop-access') !== -1) ||
                     (this.route.indexOf('/desktop--access') !== -1) ||
                     (this.route.indexOf('/projects') !== -1) ||
-                    (this.route.indexOf('/pricing') !== -1)
+                    (this.route.indexOf('/pricing') !== -1) ||
+                    (this.route.indexOf('/get-chatbot') !== -1) 
                 ) {
                     elemFooter.setAttribute('style', 'display:none;');
                     // this.logger.log('DETECT LOGIN PAGE')

src/app/bots/bots-list/bots-list.component.html

@@ -79,8 +79,7 @@
               style="margin-right: 20px">
               Create from scratch
             </button>
-            <button class="btn btn-outlined pull-right" (click)="goToBotAllTemplates()"
-              style="margin-right: 16px">
+            <button class="btn btn-outlined pull-right" (click)="goToBotAllTemplates()" style="margin-right: 16px">
               Add from template
             </button>
           </div>
@@ -157,16 +156,17 @@
                     <span style="display: block;">
                       <!-- <span class="btn---link" (click)="createBlankTilebot()"> create a new one from scratch
                         </span> -->
-                        <!-- btn-new btn-size-m btn--primary -->
+                      <!-- btn-new btn-size-m btn--primary -->
                       <button class="btn btn-tdblu-no-boxshadow center" (click)="createBlankTilebot()"
                         style="margin-right: 20px; box-shadow: unset;">
                         Create from scratch
                       </button>
                     </span>
                   </p>
-
                 </div>
 
+
+
                 <div class="card-list" *ngFor="let faqkb of faqkbList; let i = index">
 
                   <div class="cl-card" (click)='goToBotDtls(faqkb)'>
@@ -243,7 +243,20 @@
                         </div>
                       </div>
 
+                      <!-- ---------------------------------------------- -->
+                      <!-- Icon human in the loop -->
+                      <!-- (mouseenter)="openPopover()"  -->
+                      <!-- scheduleClosePopover() -->
+                      <!-- ---------------------------------------------- -->
                       <div class="cl-card-second-column">
+                        <div *ngIf="faqkb.agents_available === true || faqkb.agents_available === undefined" class="cl-availble-for-agent"
+                          style="position: relative; top: 1px;height: 24px;" 
+
+                          [satPopoverAnchor]="botAvailableForAgents"
+                          (mouseenter)="botAvailableForAgents.open()"
+                          (mouseleave)="botAvailableForAgents.close()">
+                          <span class="material-icons">boy</span>
+                        </div>
                         <div class="cl-card-stats-wpr">
 
                           <div *ngIf="faqkb.type === 'tilebot'" class="cl-card-item-stats">
@@ -353,9 +366,34 @@
 
                           </div>
                         </div>
-
                       </div>
+
                     </div>
+
+
+                         <!-- ---------------------------------------------- -->
+                          <!-- Popover for the icon human in the loop -->
+                          <!-- (mouseenter)="cancelClosePopover()"  -->
+                          <!-- (mouseleave)="scheduleClosePopover()"  -->
+                          <!-- ---------------------------------------------- -->
+                          <sat-popover #botAvailableForAgents horizontalAlign="center" verticalAlign="above"
+                          panelClass="custom-panel-sat-popover" 
+                          closeTransition="1ms ease-in"
+
+                          forceAlignment="true">
+
+                          <div class="custom-panel-sat-popover-content-wpr" style="padding: 12px;">
+
+                            <div class="custom-panel-sat-popover-title">
+                              Available to agents
+                            </div>
+
+                            <div class="custom-panel-sat-popover-description">
+                              Chatbot visible to agents for the purpose to be put back in the conversation
+                            </div>
+
+                          </div>
+                        </sat-popover>
                   </div>
                 </div>
               </div>
@@ -393,7 +431,7 @@
         </button>
         <h4 class="modal-title warning">
           <!-- <i class="material-icons" style="vertical-align: middle"> report_problem </i> -->
-          <span class="modal-header-icon-wpr"> 
+          <span class="modal-header-icon-wpr">
             <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 -960 960 960" width="20px" fill="none">
               <path
                 d="m40-120 440-760 440 760H40Zm115.33-66.67h649.34L480-746.67l-324.67 560ZM482.78-238q14.22 0 23.72-9.62 9.5-9.61 9.5-23.83 0-14.22-9.62-23.72-9.61-9.5-23.83-9.5-14.22 0-23.72 9.62-9.5 9.62-9.5 23.83 0 14.22 9.62 23.72 9.62 9.5 23.83 9.5Zm-33.45-114H516v-216h-66.67v216ZM480-466.67Z" />
@@ -420,8 +458,8 @@ <h4 class="modal-title warning">
 
         <label class="col-sm-10 modal-body--content">
           {{ "BotsPage.ToDeleteTheBotType" | translate }}
-            <strong> {{id_toDelete}}</strong>
-         
+          <strong> {{id_toDelete}}</strong>
+
         </label>
         <div class="col-sm-10">
           <input [(ngModel)]="bot_id_typed" (input)="checkIdBotTyped()" class="" type="text" placeholder="ID bot">

src/app/bots/bots-list/bots-list.component.scss

@@ -389,6 +389,28 @@ input[type="checkbox"]:disabled {
   color: #fff !important;
 }
 
+::ng-deep .custom-panel-sat-popover {
+  box-shadow: 0 0 20px 4px rgb(154 161 177 / 15%), 0 4px 80px -8px rgb(36 40 47 / 25%),
+    0 4px 4px -2px rgb(91 94 105 / 15%);
+  background: #1c2333;
+  border-radius: 6px;
+  min-height: 48px;
+  max-width: 300px !important;
+}
+
+.custom-panel-sat-popover-content-wpr > .custom-panel-sat-popover-title {
+  color: #fff;
+  font-size: 14px;
+  text-align: center;
+}
+
+.custom-panel-sat-popover-content-wpr > .custom-panel-sat-popover-description {
+  color: #fff;
+  font-size: 12px;
+  line-height: 16px;
+  text-align: center;
+}
+
 /* New chatbot table
 /* ************************************* */
 // .page-title--wrapper {

src/app/bots/bots-list/bots-list.component.ts

@@ -1,4 +1,4 @@
-import { Component, isDevMode, OnInit, OnDestroy } from '@angular/core';
+import { Component, isDevMode, OnInit, OnDestroy, ViewChild } from '@angular/core';
 import { FaqKbService } from '../../services/faq-kb.service';
 import { Chatbot, FaqKb } from '../../models/faq_kb-model';
 import { Router } from '@angular/router';
@@ -27,6 +27,7 @@ import { Clipboard } from '@angular/cdk/clipboard';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import { MessagesStatsModalComponent } from 'app/components/modals/messages-stats-modal/messages-stats-modal.component';
 import { KnowledgeBaseService } from 'app/services/knowledge-base.service';
+import { SatPopover } from '@ncstate/sat-popover';
 
 const swal = require('sweetalert');
 const Swal = require('sweetalert2')
@@ -37,6 +38,9 @@ const Swal = require('sweetalert2')
 })
 
 export class BotListComponent extends PricingBaseComponent implements OnInit, OnDestroy {
+  // @ViewChild('botAvailableForAgents') botAvailableForAgents!: SatPopover;
+  closeTimeout: any;
+  popoverCloseTimeout: any;
   PLAN_NAME = PLAN_NAME;
   CHATBOT_MAX_NUM = CHATBOT_MAX_NUM;
   private unsubscribe$: Subject<any> = new Subject<any>();
@@ -173,6 +177,22 @@ export class BotListComponent extends PricingBaseComponent implements OnInit, On
     this.salesEmail = brand['CONTACT_SALES_EMAIL'];
   }
 
+  // openPopover() {
+  //   this.botAvailableForAgents.open();
+  // }
+
+  // scheduleClosePopover() {
+  //   console.log('scheduleClosePopover botAvailableForAgents ', this.botAvailableForAgents )
+  //   this.closeTimeout = setTimeout(() => {
+  //     this.botAvailableForAgents.close();
+  //   }, 100); // Delay before closing (adjust as needed)
+  // }
+
+  // cancelClosePopover() {
+  //   clearTimeout(this.closeTimeout); // Cancel close if mouse re-enters
+  // }
+
+
   ngOnInit() {
     this.getBrowserVersion();
 
@@ -592,7 +612,7 @@ export class BotListComponent extends PricingBaseComponent implements OnInit, On
     this.showSpinner = true
     // this.faqKbService.getAllBotByProjectId().subscribe((faqKb: any) => {
     this.faqKbService.getFaqKbByProjectId().subscribe((faqKb: any) => {
-      this.logger.log('[BOTS-LIST] - GET BOTS BY PROJECT ID', faqKb);
+      // console.log('[BOTS-LIST] - GET BOTS BY PROJECT ID', faqKb);
       if (faqKb) {
 
         this.faqkbList = faqKb;

src/app/bots/bots-list/bots-list.module.ts

@@ -13,6 +13,7 @@ import { MatMenuModule } from '@angular/material/menu';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { ChatbotAlertComponent } from './chatbot-alert/chatbot-alert.component';
 import { ChatbotAlertModule } from './chatbot-alert/chatbot-alert.module';
+import { SatPopoverModule } from '@ncstate/sat-popover';
 
 const routes: Routes = [
   { path: "", component: BotListComponent},
@@ -34,7 +35,8 @@ const routes: Routes = [
     MatButtonModule,
     MatMenuModule,
     FormsModule,
-    MatTooltipModule
+    MatTooltipModule,
+    SatPopoverModule
   ]
 })
 export class BotsListModule { }

src/app/create-project-wizard/get-start-chatbot-fork/get-start-chatbot-fork.component.html

@@ -77,14 +77,20 @@ <h4  style="font-weight: 400;"> Choose which project you want to install the cha
             <div class="row">
                 <div class="col-sm-12">
 
-                    <button *ngIf="projects && projects?.length > 1" class="btn btn-lg btn-primary" (click)="importTemplate()" [disabled]="!selectedProject && !getChatBotCompleted">
+                    <button *ngIf="projects && projects?.length > 1" class="btn btn-tdblu-no-boxshadow" 
+                        (click)="importTemplate()" [disabled]="!selectedProject && !getChatBotCompleted"
+                        style="height: 48px !important;">
                         {{ "ProjectsPage.Continue" | translate }}
                     </button>
-                    <button *ngIf="projects && projects?.length === 1" class="btn btn-lg btn-primary" (click)="importTemplate()" [disabled]="!getChatBotCompleted">
+                    <button *ngIf="projects && projects?.length === 1" class="btn btn-tdblu-no-boxshadow" 
+                        (click)="importTemplate()" [disabled]="!getChatBotCompleted"
+                        style="height: 48px !important;">
                         {{ "ProjectsPage.Continue" | translate }}
                     </button>
 
-                    <button *ngIf="projects && projects?.length === 0" class="btn btn-lg btn-primary" (click)="goToCreateProject()">
+                    <button *ngIf="projects && projects?.length === 0" class="btn btn-tdblu-no-boxshadow" 
+                        (click)="goToCreateProject()"
+                        style="height: 48px !important;">
                         {{ "ProjectsPage.Continue" | translate }}
                     </button>
                 </div>