@aakash58/chatbot 1.1.21 → 1.1.22

package/projects/doohbot/src/lib/app/chat/components/chat-button/chat-button.component.ts

@@ -1,35 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatIconModule } from '@angular/material/icon';
-
-@Component({
-  selector: 'app-chat-button',
-  standalone: true,
-  imports: [CommonModule, MatIconModule],
-  templateUrl: './chat-button.component.html',
-  styleUrls: ['./chat-button.component.scss'],
-})
-export class ChatButtonComponent {
-  @Input() buttonStyle: 'fab' | 'sidebar' | 'sidebar-top' | 'sidebar-bottom' = 'fab';
-  @Input() isChatOpen: boolean = false;
-  @Input() unreadCount: number = 0;
-  @Input() appTitle: string = 'Chat';
-  @Input() appLogoUrl: string = '';
-  @Input() appTextLogoUrl: string = '';
-
-  @Output() toggle = new EventEmitter<void>();
-
-  get isSidebar(): boolean {
-    return this.buttonStyle.startsWith('sidebar');
-  }
-
-  get sidebarPosition(): 'top' | 'center' | 'bottom' {
-    if (!this.isSidebar) return 'center';
-    if (this.buttonStyle === 'sidebar') return 'center';
-    return this.buttonStyle.split('-')[1] as 'top' | 'center' | 'bottom';
-  }
-
-  onToggle() {
-    this.toggle.emit();
-  }
-}

package/projects/doohbot/src/lib/app/chat/components/chat-footer/chat-footer.component.html

@@ -1,3 +0,0 @@
-<div class="terms-conditions">
-    <!-- Terms and conditions relocated to Personalization Hub -->
-</div>

package/projects/doohbot/src/lib/app/chat/components/chat-footer/chat-footer.component.scss

@@ -1,20 +0,0 @@
-.terms-conditions {
-  padding: 10px 15px;
-  text-align: center;
-  font-size: 0.8rem;
-  background-color: var(--background-color);
-  border-top: 1px solid var(--background-color);
-  border-bottom-left-radius: inherit;
-  border-bottom-right-radius: inherit;
-
-  a {
-    color: var(--secondary-text-color);
-    text-decoration: none;
-    transition: color 0.2s ease;
-
-    &:hover {
-      color: var(--primary-color);
-      text-decoration: underline;
-    }
-  }
-}

package/projects/doohbot/src/lib/app/chat/components/chat-footer/chat-footer.component.ts

@@ -1,12 +0,0 @@
-import { Component, ChangeDetectionStrategy } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-@Component({
-  selector: 'app-chat-footer',
-  standalone: true,
-  imports: [CommonModule],
-  templateUrl: './chat-footer.component.html',
-  styleUrls: ['./chat-footer.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class ChatFooterComponent {}

package/projects/doohbot/src/lib/app/chat/components/chat-header/chat-header.component.html

@@ -1,34 +0,0 @@
-<div class="chat-header">
-  <div class="chat-title">
-    <img class="chat-logo" style="width: 150px; height: 50px; margin-left: 0px" [src]="appHeaderLogoUrl"
-      alt="Text-Logo" />
-  </div>
-
-  <div class="chat-header-buttons">
-    <!-- History Button -->
-
-    <!-- add chat Button -->
-    @if (isAuthenticated) {
-    <button class="header-button" (click)="onStartNewConversation()" title="Start new conversation">
-      <mat-icon>add</mat-icon>
-    </button>
-    }
-
-    <!-- history Button -->
-    @if (isAuthenticated) {
-    <button class="header-button" (click)="onToggleHistorySidebar()" title="Chat History">
-      <mat-icon>history</mat-icon>
-    </button>
-    }
-
-    <!-- more Button -->
-    <button class="header-button" [matMenuTriggerFor]="settingsMenu">
-      <mat-icon>more_vert</mat-icon>
-    </button>
-
-    <!-- minimize Button -->
-    <button class="header-button" (click)="onToggleChat()">
-      <mat-icon>minimize</mat-icon>
-    </button>
-  </div>
-</div>

package/projects/doohbot/src/lib/app/chat/components/chat-header/chat-header.component.scss

@@ -1,78 +0,0 @@
-@use '@angular/material' as mat;
-
-.chat-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 10px 20px;
-  background-color: var(--background-color);
-  color: var(--text-alt-color);
-  // cursor: move;
-  user-select: none;
-}
-s
-// .chat-header:active {
-//   cursor: grabbing;
-// }
-
-.chat-title {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-family: var(--font-family);
-}
-
-.chat-logo {
-  width: 45px;
-  height: 45px;
-  object-fit: contain;
-}
-
-.chat-header h2 {
-  margin: 0;
-  font-size: 1.2rem;
-  color: var(--mat-sys-on-primary);
-  font-family: var(--font-family);
-  font-weight: bold;
-}
-
-.chat-header-buttons {
-  display: flex;
-  flex-wrap: nowrap;
-  gap: 1px;
-}
-
-/* Header buttons: fullscreen + close (directly in header) */
-.header-button {
-  background: var(--background-color);
-  border: 1px solid var(--background-color);
-  border-radius: 50%;
-  width: 32px;
-  height: 32px;
-  padding: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  color: var(--text-color);
-  transition: all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
-  outline: none;
-
-  mat-icon {
-    font-size: 18px;
-    width: 18px;
-    height: 18px;
-  }
-
-  &:hover {
-    // background-color: var(--primary-color);
-    // border-color: var(--primary-color);
-    // color: var(--white);
-    transform: translateY(-1px);
-    box-shadow: 0 4px 12px rgba(var(--black-rgb), 0.15);
-  }
-
-  &:active {
-    transform: translateY(0);
-  }
-}

package/projects/doohbot/src/lib/app/chat/components/chat-header/chat-header.component.ts

@@ -1,52 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatIconModule } from '@angular/material/icon';
-import { MatMenuModule } from '@angular/material/menu';
-import { ThemeService } from '../../../../core/services/theme.service';
-import { inject } from '@angular/core';
-import { ChatService } from '../../chat.service';
-import Logger from '../../../../core/utils/logger.service';
-import { ChatUIStateService } from '../../chat-ui-state.service';
-import { SnackbarUtils } from '../../../../shared/snackbar/snackbar.utils';
-
-@Component({
-  selector: 'app-chat-header',
-  standalone: true,
-  imports: [CommonModule, MatIconModule, MatMenuModule],
-  templateUrl: './chat-header.component.html',
-  styleUrls: ['./chat-header.component.scss'],
-})
-export class ChatHeaderComponent {
-  @Input() appHeaderLogoUrl: string = '';
-  @Input() isAuthenticated: boolean = false;
-  @Input() isFullScreen: boolean = false;
-  @Input() settingsMenu: any;
-  @Input() isNewChatDisabled: boolean = false;
-
-  @Output() toggleChat = new EventEmitter<void>();
-  @Output() toggleFullScreen = new EventEmitter<void>();
-  @Output() toggleHistorySidebar = new EventEmitter<void>();
-  @Output() clearChat = new EventEmitter<void>();
-
-  public themeService = inject(ThemeService);
-  public chatService = inject(ChatService);
-  private uiState = inject(ChatUIStateService);
-
-  onToggleChat() {
-    this.toggleChat.emit();
-  }
-
-  onToggleHistorySidebar() {
-    this.toggleHistorySidebar.emit();
-  }
-
-  onToggleFullScreen() {
-    this.toggleFullScreen.emit();
-  }
-
-  onStartNewConversation() {
-    Logger.warn('Starting new conversation...');
-    this.chatService.startNewSession();
-    this.uiState.closeHistorySidebar();
-  }
-}

package/projects/doohbot/src/lib/app/chat/components/chat-history-sidebar/chat-history-sidebar.component.html

@@ -1,77 +0,0 @@
-<div class="history-sidebar" [class.open]="isOpen">
-  <div class="sidebar-header">
-    <div class="marquee-container" style="flex: 1; margin-right: 10px">
-      <h3 class="marquee-text">{{ userName }}'s Chat History</h3>
-    </div>
-    <button class="refresh-btn" (click)="onRefresh()" title="Refresh history">
-      <mat-icon>refresh</mat-icon>
-    </button>
-
-    <button class="close-btn" (click)="onClose()">
-      <mat-icon>close</mat-icon>
-    </button>
-  </div>
-
-  <div class="sidebar-content" (scroll)="onScroll($event)">
-    @if (isLoading) {
-    <div class="loader-container">
-      <div class="loader"></div>
-      <p>Loading history...</p>
-    </div>
-    }
-
-    @if (!isLoading && sessions.length === 0) {
-    <div class="empty-state">
-      <mat-icon>history</mat-icon>
-      <p>No chat history yet</p>
-      <span>Start a conversation to see it here</span>
-    </div>
-    }
-
-    @if (!isLoading) {
-    @for (group of chatHistory; track group.label) {
-    <div class="session-group">
-      <div class="group-label">{{ group.label }}</div>
-      <div class="session-list">
-        @for (session of group.sessions; track session.id) {
-        <div class="session-item" (click)="onSessionClick(session)">
-          <div class="session-content">
-            <div class="session-title">{{ session.title }}</div>
-            <div class="session-time">
-              {{ formatTime(session.timestamp) }} · {{ formatDate(session.timestamp) }}
-            </div>
-          </div>
-          <div class="session-actions">
-            <button class="edit-btn" [disabled]="processingSessionId === session.id"
-              (click)="onEditClick($event, session)" title="Edit title">
-              @if (processingSessionId !== session.id) {
-              <mat-icon>edit</mat-icon>
-              } @else {
-              <div class="loader-tiny"></div>
-              }
-            </button>
-            <button class="delete-btn" [disabled]="processingSessionId === session.id"
-              (click)="onDeleteClick($event, session.id)" title="Delete conversation">
-              @if (processingSessionId !== session.id) {
-              <mat-icon>delete</mat-icon>
-              } @else {
-              <div class="loader-tiny"></div>
-              }
-            </button>
-          </div>
-        </div>
-        }
-      </div>
-    </div>
-    }
-    }
-
-    <!-- Loading more indicator -->
-    @if (isLoadingMore) {
-    <div class="loading-more">
-      <div class="loader-small"></div>
-      <p>Loading more...</p>
-    </div>
-    }
-  </div>
-</div>

package/projects/doohbot/src/lib/app/chat/components/chat-history-sidebar/chat-history-sidebar.component.scss

@@ -1,346 +0,0 @@
-:host {
-  display: block;
-  height: 100%;
-  width: 100%;
-}
-
-.history-sidebar {
-  top: 0;
-  right: 0;
-  display: none;
-  height: 100%;
-  width: 100%;
-  background: var(--background-color);
-  flex-direction: column;
-}
-
-.history-sidebar.open {
-  display: flex;
-}
-
-.sidebar-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 20px;
-  border-bottom: 1px solid var(--border-color);
-}
-
-.sidebar-header h3 {
-  margin: 0;
-  font-size: 16px;
-  font-weight: 600;
-  color: var(--text-color);
-  font-family: var(--font-family);
-  display: inline-block;
-}
-
-.sidebar-content {
-  flex: 1 1 auto;
-  /* take remaining space */
-  overflow-y: auto;
-  /* enable vertical scroll */
-  padding: 10px 0;
-  scroll-behavior: smooth;
-}
-
-.close-btn {
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  transition: background 0.2s;
-}
-
-.close-btn:hover {
-  background: var(--bot-message-color);
-}
-
-.close-btn mat-icon {
-  color: var(--text-color);
-  font-size: 20px;
-  width: 20px;
-  height: 20px;
-}
-
-.refresh-btn {
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  transition: background 0.2s;
-  margin-right: 8px;
-}
-
-.refresh-btn:hover {
-  background: var(--bot-message-color);
-}
-
-.refresh-btn mat-icon {
-  color: var(--text-color);
-  font-size: 20px;
-  width: 20px;
-  height: 20px;
-}
-
-.clear-all-btn {
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  transition: background 0.2s;
-  margin-right: 8px;
-}
-
-.clear-all-btn:hover {
-  background: var(--bot-message-color);
-}
-
-.clear-all-btn mat-icon {
-  color: var(--text-color);
-  font-size: 20px;
-  width: 20px;
-  height: 20px;
-}
-
-.empty-state {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 60px 20px;
-  text-align: center;
-}
-
-.empty-state mat-icon {
-  font-size: 64px;
-  width: 64px;
-  height: 64px;
-  color: var(--secondary-text-color);
-  margin-bottom: 16px;
-}
-
-.empty-state p {
-  margin: 0 0 8px 0;
-  font-size: 16px;
-  font-weight: 500;
-  color: var(--text-color);
-  font-family: var(--font-family);
-}
-
-.empty-state span {
-  font-size: 14px;
-  color: var(--secondary-text-color);
-  font-family: var(--font-family);
-}
-
-.session-group {
-  margin-bottom: 24px;
-}
-
-.group-label {
-  padding: 8px 20px;
-  font-size: 12px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  color: var(--secondary-text-color);
-  font-family: var(--font-family);
-}
-
-.session-list {
-  display: flex;
-  flex-direction: column;
-}
-
-.session-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 12px 20px;
-  cursor: pointer;
-  transition: background 0.2s;
-  gap: 8px;
-}
-
-.session-item:hover {
-  background: var(--bot-message-color);
-}
-
-.session-content {
-  flex: 1;
-  min-width: 0;
-}
-
-.session-title {
-  font-size: 14px;
-  font-weight: 500;
-  color: var(--text-color);
-  font-family: var(--font-family);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  margin-bottom: 4px;
-}
-
-.session-time {
-  font-size: 12px;
-  color: var(--secondary-text-color);
-  font-family: var(--font-family);
-}
-
-.session-actions {
-  display: flex;
-  gap: 4px;
-  opacity: 0;
-  transition: opacity 0.2s;
-}
-
-.session-item:hover .session-actions {
-  opacity: 1;
-}
-
-.edit-btn,
-.delete-btn {
-  background: none;
-  border: none;
-  cursor: pointer;
-  padding: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  transition: all 0.2s;
-}
-
-.edit-btn:hover {
-  background: var(--bot-message-color);
-}
-
-.delete-btn:hover {
-  background: var(--light-red);
-}
-
-.edit-btn mat-icon,
-.delete-btn mat-icon {
-  color: var(--secondary-text-color);
-  font-size: 18px;
-  width: 18px;
-  height: 18px;
-}
-
-.edit-btn:hover mat-icon {
-  color: var(--primary-color);
-}
-
-.delete-btn:hover mat-icon {
-  color: var(--red);
-}
-
-/* Scrollbar */
-/* Webkit browsers (Chrome, Edge, Safari) */
-
-.sidebar-content::-webkit-scrollbar {
-  width: 6px;
-}
-
-.sidebar-content::-webkit-scrollbar-track {
-  background: transparent;
-}
-
-.sidebar-content::-webkit-scrollbar-thumb {
-  background: rgba(var(--black-rgb), 0.1);
-  border-radius: 10px;
-}
-
-.sidebar-content::-webkit-scrollbar-thumb:hover {
-  background: rgba(var(--black-rgb), 0.1);
-  border-radius: 10px;
-}
-
-/* Firefox */
-// .sidebar-content {
-//   scrollbar-width: thin;
-//   scrollbar-color: var(--primary-color) var(--background-color);
-// }
-
-.loader-container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 40px 20px;
-  color: var(--secondary-text-color);
-
-  p {
-    margin-top: 15px;
-    font-size: 14px;
-    font-weight: 500;
-  }
-}
-
-.loader {
-  width: 32px;
-  height: 32px;
-  border: 3px solid rgba(var(--border-color-rgb), 0.1);
-  border-radius: 50%;
-  border-top-color: var(--primary-color);
-  animation: spin 1s ease-in-out infinite;
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.loading-more {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 20px;
-  color: var(--secondary-text-color);
-
-  p {
-    margin-top: 10px;
-    font-size: 13px;
-    font-weight: 500;
-  }
-}
-
-.loader-small {
-  width: 24px;
-  height: 24px;
-  border: 3px solid rgba(var(--border-color-rgb), 0.1);
-  border-radius: 50%;
-  border-top-color: var(--primary-color);
-  animation: spin 1s ease-in-out infinite;
-}
-
-.loader-tiny {
-  width: 14px;
-  height: 14px;
-  border: 2px solid rgba(var(--border-color-rgb), 0.1);
-  border-radius: 50%;
-  border-top-color: var(--primary-color);
-  animation: spin 1s ease-in-out infinite;
-}
-
-.edit-btn:disabled,
-.delete-btn:disabled {
-  cursor: not-allowed;
-  opacity: 0.6;
-}