ui improved

Tiledesk · Oct 7, 2023 · 89e0c0c · 89e0c0c
1 parent 31c987f
commit 89e0c0c
Show file tree

Hide file tree

Showing 45 changed files with 914 additions and 147 deletions.
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
@@ -3,6 +3,8 @@ import { RouterModule, Routes } from '@angular/router';
 import { CdsDashboardComponent } from './chatbot-design-studio/cds-dashboard/cds-dashboard.component';
 import { AuthGuard } from './guards/auth.guard';
 import { AppComponent } from './app.component';
+import { RoleGuard } from './guards/role.guard';
+import { UnauthorizedComponent } from './components/unauthorized/unauthorized.component';
 
 const routes: Routes = [
   // -----------------------------------------
@@ -13,9 +15,11 @@ const routes: Routes = [
   // { path: 'project/', component: CdsDashboardComponent, canActivate:[AuthGuard] },
   { path: 'home', component: AppComponent },
 
-  { path: 'project/:projectid/cds/:faqkbid', component: CdsDashboardComponent, canActivate:[AuthGuard] },
-  { path: 'project/:projectid/cds/:faqkbid/intent/:intent_id', component: CdsDashboardComponent, canActivate:[AuthGuard] },
+  { path: 'project/:projectid/cds/:faqkbid', component: CdsDashboardComponent, canActivate:[AuthGuard, RoleGuard] },
+  { path: 'project/:projectid/cds/:faqkbid/intent/:intent_id', component: CdsDashboardComponent, canActivate:[AuthGuard, RoleGuard] },
 
+  { path: 'project/:projectid/unauthorized', component: UnauthorizedComponent },
+
 ];
 
 @NgModule({

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -36,8 +36,6 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
   IS_ONLINE: boolean;
   initFinished:boolean = false;
 
-  private project: Project;
-  private selectedChatbot: Chatbot
 
   constructor(
     private appConfigService: AppConfigService,
@@ -109,7 +107,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
     // const getUrlParams = await this.dashboardService.getUrlParams();
     // this.logger.log('[CDS DSHBRD] Risultato 2:', getUrlParams);
 
-    this.initAuthentication();
+    await this.initAuthentication();
     this.setLanguage(null);
 
   }
@@ -250,7 +248,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
 
   /***************************************************+*/
   /**------- AUTHENTICATION FUNCTIONS --> START <--- +*/
-  private initAuthentication() {
+  initAuthentication() {
     const tiledeskToken = this.appStorageService.getItem('tiledeskToken')
 
     this.logger.log('[APP-COMP] >>> INIT-AUTHENTICATION !!! ')
@@ -263,14 +261,14 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.logger.log('[APP-COMP] >>> initAuthentication user ', user)
 
         this.updateStoredCurrentUser()
-
+        this.IS_ONLINE = true;
       }).catch(error => {
         this.logger.error('[APP-COMP] initAuthentication SIGNINWITHCUSTOMTOKEN error::', error)
       })
     } else {
       this.logger.warn('[APP-COMP] >>> I AM NOT LOGGED IN <<<')
       this.IS_ONLINE = false;
-      this.goToDashboardLogin()
+      // this.goToDashboardLogin()
     }
   }
 

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -56,6 +56,10 @@ import { MatExpansionModule } from '@angular/material/expansion';
 import { MatInputModule } from '@angular/material/input';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatTabsModule } from '@angular/material/tabs';
+import { FirebaseInitService } from 'src/chat21-core/providers/firebase/firebase-init-service';
+import { NativeImageRepoService } from 'src/chat21-core/providers/native/native-image-repo';
+import { FirebaseImageRepoService } from 'src/chat21-core/providers/firebase/firebase-image-repo';
+import { UnauthorizedComponent } from './components/unauthorized/unauthorized.component';
 
 // FACTORIES
 export function createTranslateLoader(http: HttpClient) {
@@ -73,6 +77,20 @@ const appInitializerFn = (appConfig: AppConfigService, logger: NGXLogger) => {
   };
 };
 
+export function imageRepoFactory(appConfig: AppConfigService, http: HttpClient) {
+  const config = appConfig.getConfig()
+  if (config.uploadEngine === UPLOAD_ENGINE_NATIVE) {
+    const imageService = new NativeImageRepoService(http)
+    imageService.setImageBaseUrl(config.baseImageUrl)
+    return imageService
+  } else {
+    const imageService = new FirebaseImageRepoService(http);
+    FirebaseInitService.initFirebase(config.firebaseConfig)
+    imageService.setImageBaseUrl(config.baseImageUrl)
+    return imageService
+  }
+}
+
 export function uploadFactory(http: HttpClient, appConfig: AppConfigService, appStorage: AppStorageService) {
 
   const config = appConfig.getConfig()
@@ -81,14 +99,16 @@ export function uploadFactory(http: HttpClient, appConfig: AppConfigService, app
     nativeUploadService.setBaseUrl(config.baseImageUrl)
     return nativeUploadService
   } else {
+    FirebaseInitService.initFirebase(config.firebaseConfig)
     return new FirebaseUploadService();
   }
 }
 
 @NgModule({
   declarations: [
     AppComponent,
-    BotsBaseComponent
+    BotsBaseComponent,
+    UnauthorizedComponent,
   ],
   imports: [
     // TooltipModule.forRoot(CutomTooltipOptions as TooltipOptions),

diff --git a/src/app/chatbot-design-studio/cds-chatbot-details/detail/detail.component.scss b/src/app/chatbot-design-studio/cds-chatbot-details/detail/detail.component.scss
@@ -115,13 +115,13 @@ input[type="file"] {
     color: #000;
     border-radius: 4px;
     font-weight: 500;
-    margin-top: 14px;
+    // margin-top: 14px;
     // width: 145px;
 }
 
 #cds-delete-bot-img-btn {
     padding: 9px 15px;
-    margin-top: 21px;
+    // margin-top: 21px;
     color: #fff;
     background: #f44336 !important;
     box-shadow: none !important;

diff --git a/src/app/chatbot-design-studio/cds-chatbot-details/import-export/import-export.component.html b/src/app/chatbot-design-studio/cds-chatbot-details/import-export/import-export.component.html
@@ -151,16 +151,18 @@ <h3 class="card_title__underlined" style="margin-top: 30px; color:#e8eaed">
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header" style="padding: 8px 15px;">
-        <!-- class="close" -->
-        <button type="button" class="close-modal-window" aria-label="Close" (click)="onCloseModal()">
-          <span aria-hidden="true" style="color: rgb(6, 6, 6) !important;position: relative;">&times;</span>
-        </button>
 
         <h4 class="modal-title" style="line-height: 2!important;">
 
           <!-- {{ 'FaqPage.ImportCsvFile' | translate }} -->
           Import CSV File
         </h4>
+        <!-- class="close" -->
+        <button type="button" class="close-modal-window" aria-label="Close" (click)="onCloseModal()">
+          <span aria-hidden="true" style="color: rgb(6, 6, 6) !important;position: relative;">&times;</span>
+        </button>
+
+
       </div>
 
       <div class="modal-body" style="padding-bottom: 20px !important; padding-top: 20px;">
@@ -335,14 +337,15 @@ <h4 class="modal-title" style="line-height: 2!important;">
   <div class="modal-dialog modal-sm" role="document">
     <div class="modal-content">
       <div class="modal-header">
-        <button type="button" class="close" aria-label="Close" (click)="onCloseModal()">
-          <span aria-hidden="true">&times;</span>
-        </button>
 
         <h4 class="modal-title">
           Upload CSV
           <!-- {{ 'FaqPage.UploadCsv' | translate }} -->
         </h4>
+        <button type="button" class="close" aria-label="Close" (click)="onCloseModal()">
+          <span aria-hidden="true">&times;</span>
+        </button>
+
       </div>
 
       <div class="modal-body">
@@ -435,14 +438,14 @@ <h4 class="modal-title">
     <div class="modal-content">
       <div class="modal-header" style="padding: 8px 15px;">
 
-        <button type="button" class="close-modal-window" aria-label="Close" (click)="onCloseImportJSONModal()">
-          <span aria-hidden="true" style="color: rgb(6, 6, 6) !important;position: relative;">&times;</span>
-        </button>
-
         <h4 class="modal-title" style="line-height: 2!important; font-size: 20px; font-weight: 400;">
           <!-- {{'ImportFromJSON' | translate}} -->
           Import from JSON
         </h4>
+        <button type="button" class="close-modal-window" aria-label="Close" (click)="onCloseImportJSONModal()">
+          <span aria-hidden="true" style="color: rgb(6, 6, 6) !important;position: relative;">&times;</span>
+        </button>
+
       </div>
 
       <div class="modal-body import-json-modal-body">

diff --git a/...s/actions/list/cds-action-capture-user-reply/cds-action-capture-user-reply.component.html b/...s/actions/list/cds-action-capture-user-reply/cds-action-capture-user-reply.component.html
@@ -0,0 +1,90 @@
+<div *ngIf="previewMode" class="cds-action-preview" style="position: relative;">
+
+    <!-- <div class="action-row">
+        <div class="action-row-left">
+            <svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="none">
+                <path d="M0 0h24v24H0V0z" fill="none" />
+                <path d="M14 17H4v2h10v-2zm6-8H4v2h16V9zM4 15h16v-2H4v2zM4 5v2h16V5H4z" />
+            </svg>
+        </div>
+
+        <div class="action-row-right"> -->
+            <!-- <div *ngIf="action?.question" class="action-row-right">
+                {{action?.question}}
+            </div>
+            <div *ngIf="!action?.question" class="action-row-right empty">
+                Enter the question
+            </div> -->
+            <!-- Preview something
+        </div>
+
+    </div> -->
+
+    <div id="capture-user-reply" class="previewContent">
+
+        <label class="title-preview-label">Capture user reply
+            <span *ngIf="action?.assignResultTo">to </span>
+            <span *ngIf="action?.assignResultTo" style="font-weight: 600;">{{ action?.assignResultTo }}</span>
+
+        </label>
+
+        <cds-connector class="connector"
+            [idConnector] = "idConnector"
+            [isConnected] = "isConnected">
+        </cds-connector>
+    </div>
+
+</div>
+
+
+<div id="content" *ngIf="!previewMode" class="content">
+
+
+    <div class="text-editor-wrapper">
+        <div class="field-box">
+            <label class="title-label">Assign user reply to</label>
+            <div class="value-wrp">
+                <cds-textarea 
+                    id="assignTo" 
+                    [textLimitBtn]="false" 
+                    [emojiPikerBtn]="false" 
+                    [setAttributeBtn]="true"
+                    [minRow]="1" 
+                    [maxRow]="1" 
+                    [readonly]="true" 
+                    [text]="action.assignResultTo"
+                    [placeholder]="'(Optional)'"
+                    (selectedAttribute)="onSelectedAttribute($event, 'assignResultTo')"
+                    (clearSelectedAttribute)="onSelectedAttribute($event, 'assignResultTo')">
+                </cds-textarea>
+            </div>
+        </div>
+    </div>
+
+    <div style="margin-top: 40px;">
+        <div class="condition-container">
+            <div class="icon-action">
+                <img src="assets/cds/images/actions/connect_intent.svg">
+            </div>
+            <span class="condition-text">Then go to block</span>
+        </div>
+
+        <div class="select-box" id="intentSelect">
+            <cds-select 
+                id="text-condition" 
+                [items]="listOfIntents" 
+                [bindLabelSelect]="'name'"
+                [bindValueSelect]="'value'" 
+                [itemSelected]="action?.goToIntent" 
+                [placeholder]="'Select a block'"
+                [clearable]="true" 
+                (onSelected)="onChangeBlockSelect($event, 'goToIntent')"
+                (onReset)="onResetBlockSelect($event, 'goToIntent')">
+            </cds-select>
+        </div>
+    </div>
+
+
+
+
+</div>