Skip to content

Commit

Permalink
Merge branch 'features/logs'
Browse files Browse the repository at this point in the history
# Conflicts:
#	src/app/components/settings-sidebar/settings-sidebar.component.ts
  • Loading branch information
Giovanni Troisi committed Dec 19, 2023
2 parents c8d63b9 + 48d3da4 commit b2cfd7a
Show file tree
Hide file tree
Showing 10 changed files with 848 additions and 2 deletions.
6 changes: 5 additions & 1 deletion src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -361,6 +361,8 @@ import { KnowledgeBasesComponent } from './knowledge-bases/knowledge-bases.compo
import { CnpTemplatesComponent } from './create-new-project/cnp-templates/cnp-templates.component';
import { OnboardingWelcomeComponent } from './create-new-project/onboarding-welcome/onboarding-welcome.component';
import { HomeNewsFeedModalComponent } from './home-components/home-news-feed/home-news-feed-modal/home-news-feed-modal.component';
import { AutomationsComponent } from './automations/automations.component';
import { MatAutocompleteModule } from '@angular/material/autocomplete';



Expand Down Expand Up @@ -638,7 +640,8 @@ const appInitializerFn = (appConfig: AppConfigService, brandService: BrandServic
HomeGoToChatComponent,
CnpTemplatesComponent,
OnboardingWelcomeComponent,
HomeNewsFeedModalComponent
HomeNewsFeedModalComponent,
AutomationsComponent
],
imports: [
TooltipModule.forRoot(CutomTooltipOptions as TooltipOptions),
Expand All @@ -664,6 +667,7 @@ const appInitializerFn = (appConfig: AppConfigService, brandService: BrandServic
MatExpansionModule,
MatDialogModule,
MatCheckboxModule,
MatAutocompleteModule,
/* PRIVATE */
PricingModule,
ChatbotDesignStudioModule,
Expand Down
4 changes: 4 additions & 0 deletions src/app/app.routing.ts
Original file line number Diff line number Diff line change
Expand Up @@ -146,6 +146,7 @@ import { KnowledgeBasesComponent } from './knowledge-bases/knowledge-bases.compo
import { CnpIsMobileComponent } from './create-new-project/cnp-is-mobile/cnp-is-mobile.component';
import { CnpTemplatesComponent } from './create-new-project/cnp-templates/cnp-templates.component';
import { OnboardingWelcomeComponent } from './create-new-project/onboarding-welcome/onboarding-welcome.component';
import { AutomationsComponent } from './automations/automations.component';



Expand Down Expand Up @@ -456,6 +457,9 @@ const routes: Routes = [
{ path: 'project/:projectid/hours', component: HoursComponent, canActivate: [AuthGuard, ProjectProfileGuard] },
{ path: 'project/:projectid/hours-demo', component: HoursStaticComponent, canActivate: [AuthGuard] },

// AUTOMATIONS
{ path: 'project/:projectid/automations', component: AutomationsComponent, canActivate: [AuthGuard]},

// KNOWLEDGE BASES
{ path: 'project/:projectid/knowledge-bases', component: KnowledgeBasesComponent, canActivate: [AuthGuard]},
{ path: 'project/:projectid/knowledge-bases/:calledby', component: KnowledgeBasesComponent, canActivate: [AuthGuard]}, // when called from home
Expand Down
156 changes: 156 additions & 0 deletions src/app/automations/automations.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,156 @@
<span class="navbar-brand navbar-brand-sidebar-settings"
[ngStyle]="{'margin-top':isChromeVerGreaterThan100 === true ? '-64px' : '6px' }"
[ngClass]="{'is_opened':IS_OPEN_SETTINGS_SIDEBAR, 'is_closed':!IS_OPEN_SETTINGS_SIDEBAR }">

<i class="material-icons">settings</i>

<span *ngIf="IS_OPEN_SETTINGS_SIDEBAR">{{ 'Settings' | translate }} </span>
</span>


<div class="main-content" style="padding-top:0px; padding-left: 5px;padding-right: 5px;">
<div class="container-fluid" style="padding-left: 5px;padding-right: 5px;">

<div class="content-wpr" style="display: flex;">
<appdashboard-settings-sidebar style="border-right:1px solid #e5effe !important">
</appdashboard-settings-sidebar>
<div class="teplate-content" style="flex: 1 1 auto; margin: 0 20px;">

<loading-spinner *ngIf="showSpinner"></loading-spinner>

<div class="card-content" *ngIf="!showSpinner && showAutomationsList" style="padding-top: 10px;">

<div class="filters">
<!-- // to do -->
</div>

<div class="header">
<p style="font-family: 'Poppins';">Last Automations</p>
<button class="custom-button" (click)="reload('automations')">
<span class="material-icons-round button-icon">sync</span>
Reload</button>
</div>

<div class="automation-list">

<div class="automation" *ngFor="let transaction of transactions"
(click)="onAutomationSelect(transaction.transaction_id)">
<div class="automation-title-id">
<p class="automation-title">{{ transaction.template_name }}</p>
<p class="automation-id">{{ transaction.transaction_id }}</p>
<div *ngIf="transaction.status === 'pending'" class="automation-status">
<span class="material-icons circle pending-circle">circle</span>
<p>Pending</p>
</div>

<div *ngIf="transaction.status === 'completed'" class="automation-status">
<span class="material-icons circle completed-circle">circle</span>
<p>Completed</p>
</div>

<div *ngIf="transaction.status === 'aborted'" class="automation-status">
<span class="material-icons circle aborted-circle">circle</span>
<p>Aborted</p>
</div>
</div>

<div *ngIf="transaction.channel === 'whatsapp'" class="channel-chip">
<img src="assets/img/whatsapp-small.png" width="22" height="auto">
WhatsApp
</div>

<div class="automation-date">
{{ transaction.createdAt | date:'E, d MMM, HH:mm:ss'}}
</div>

<div class="automation-option">
<div class="vertical-separator"></div>
<span class="material-icons-round option-icon">navigate_next</span>
</div>


</div>

</div>



</div>

<div class="card-content" *ngIf="!showSpinner && showAutomationDetail" style="padding-top: 10px;">
<button class="custom-button" (click)="backToAutomations()">
<span class="material-icons-round button-icon">navigate_before</span>
Back to Automations</button>

<div class="automation-stats">
<p class="subtitle">Automation Stats</p>

<div class="stats">
<span class="stat">
<span class="material-icons-round counter-icon complete">done_all</span>
<label>Read:</label> <span>{{ read_count }}</span>
</span>
<span class="stat">
<span class="material-icons-round counter-icon pending">done_all</span>
<label>Delivered:</label> {{ delivered_count }}
</span>
<span class="stat">
<span class="material-icons-round counter-icon pending">done</span>
<label>Sent:</label> {{ sent_count }}
</span>
<span class="stat">
<span class="material-icons-round counter-icon pending">schedule</span>
<label>Accepted:</label> {{ accepted_count }}
</span>
<span class="stat">
<span class="material-icons-round counter-icon error">error_outline</span>
<label>Rejected:</label> {{ failed_count }}
</span>
<span class="stat">
<span class="material-icons-round counter-icon error">error_outline</span>
<label>Failed:</label> {{ rejected_count }}
</span>
</div>

</div>

<div style="display: flex; justify-content: space-between; align-items: center;">
<h4>{{ logs.length }} Messages</h4>
<button class="custom-button" (click)="reload('logs')">
<span class="material-icons-round button-icon">sync</span>
Reload</button>
</div>

<div class="logs-list">

<mat-expansion-panel *ngFor="let log of logs" style="border-radius: 0px;">
<mat-expansion-panel-header>
<mat-panel-title>
<label>To:</label> {{log.json_message.to}}
</mat-panel-title>
<mat-panel-description>
<div class="status-chip">
<span *ngIf="log.error" class="material-icons-round warning-icon">warning</span>
{{ log.status }}
</div>
</mat-panel-description>
</mat-expansion-panel-header>
<label>Sending date:</label> {{ log.timestamp | date:'E, d MMM, HH:mm:ss'}}
<div class="error-box" *ngIf="log.error">
<p class="error-label">Error</p>
{{ log.error }}
</div>
</mat-expansion-panel>
<div class="end-list">End of list</div>


</div>
</div>


</div>


</div>
</div>
</div>
Loading

0 comments on commit b2cfd7a

Please sign in to comment.