@aakash58/chatbot 1.1.21 → 1.1.22

package/projects/doohbot/src/lib/core/services/theme.service.ts

@@ -1,305 +0,0 @@
-import { effect, Injectable, OnDestroy, Renderer2, RendererFactory2, signal } from '@angular/core';
-import { OverlayContainer } from '@angular/cdk/overlay';
-import { DoohbotThemeConfig } from '../models/theme-config.model';
-import { PersonalizationService } from '../../app/personalization/personalization.service';
-
-export type ThemeMode = 'light' | 'dark' | 'auto';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class ThemeService implements OnDestroy {
-  private renderer: Renderer2;
-  private _theme = signal<ThemeMode>('auto');
-  public theme = this._theme.asReadonly();
-
-  private _activeTheme = signal<'light-theme' | 'dark-theme'>('light-theme');
-  public activeTheme = this._activeTheme.asReadonly();
-
-  private observer: MutationObserver | null = null;
-  // private mediaQueryListener: ((e: MediaQueryListEvent) => void) | null = null;
-
-  constructor(
-    rendererFactory: RendererFactory2,
-    private overlay: OverlayContainer,
-    private personalization: PersonalizationService,
-  ) {
-    this.renderer = rendererFactory.createRenderer(null, null);
-
-    // Sync theme and primary color with PersonalizationService
-    effect(
-      () => {
-        const settings = this.personalization.settings();
-        const mode = settings.appearance.theme;
-        const primaryColor = settings.appearance.primaryColor;
-
-        // Update theme
-        this._theme.set(mode);
-        this.updateActiveTheme(mode);
-
-        // Update primary color globally
-        this.applyPrimaryColorToGlobal(primaryColor);
-      },
-      { allowSignalWrites: true },
-    );
-
-    // Separate effect to handle re-application of config when activeTheme changes
-    effect(() => {
-      // const currentTheme = this._activeTheme();
-      const config = this._currentConfig();
-      if (this.rootElement && config) {
-        this.applyCssVariables(this.rootElement, config);
-      }
-    });
-  }
-
-  private _currentConfig = signal<DoohbotThemeConfig | undefined>(undefined);
-  private rootElement: HTMLElement | null = null;
-
-  public setThemeConfig(config: DoohbotThemeConfig, rootElement: HTMLElement) {
-    this._currentConfig.set(config);
-    this.rootElement = rootElement;
-    // Initial apply
-    this.applyCssVariables(rootElement, config);
-  }
-
-  public applyPrimaryColorToGlobal(colorInput: string) {
-    if (!colorInput) return;
-
-    let color = colorInput;
-
-    // Resolve 'default' magic string to developer default
-    if (colorInput === 'default') {
-      const defaults = this.personalization.developerDefaults();
-      color = defaults.primaryColor || 'default';
-    }
-
-    if (color.includes(',')) {
-      const parts = color.split(',').map((p) => p.trim());
-      const isDark = this._activeTheme() === 'dark-theme';
-      color = parts.length >= 2 ? (isDark ? parts[1] : parts[0]) : parts[0];
-    }
-
-    const root = document.documentElement;
-    const overlayContainer = this.overlay.getContainerElement();
-    const onPrimary = this.getContrastColor(color);
-
-    // Standard Material 3 tokens
-    root.style.setProperty('--mat-sys-primary', color);
-    root.style.setProperty('--mat-sys-on-primary', onPrimary);
-
-    // Primary Container (using semi-transparent primary as a fallback if no specific logic)
-    const primaryContainer = `${color}33`; // 20% opacity
-    root.style.setProperty('--mat-sys-primary-container', primaryContainer);
-    root.style.setProperty('--mat-sys-on-primary-container', color);
-
-    overlayContainer.style.setProperty('--mat-sys-primary', color);
-    overlayContainer.style.setProperty('--mat-sys-on-primary', onPrimary);
-    overlayContainer.style.setProperty('--mat-sys-primary-container', primaryContainer);
-
-    // Update internal legacy/utility variables
-    root.style.setProperty('--primary-color', color);
-    root.style.setProperty('--user-message-color', color);
-    root.style.setProperty('--user-text-color', onPrimary);
-
-    overlayContainer.style.setProperty('--primary-color', color);
-  }
-
-  /**
-   * Simple luminance-based contrast calculation
-   * Returns #ffffff for dark colors and #000000 for light colors
-   */
-  private getContrastColor(hex: string): string {
-    if (!hex || hex.length < 6) return '#ffffff';
-
-    // Remove # if present
-    const cleanHex = hex.replace('#', '');
-    const r = parseInt(cleanHex.substring(0, 2), 16);
-    const g = parseInt(cleanHex.substring(2, 4), 16);
-    const b = parseInt(cleanHex.substring(4, 6), 16);
-
-    // Calculate luminance (standard formula)
-    const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
-
-    return luminance > 0.6 ? '#000000' : '#ffffff';
-  }
-
-  setTheme(mode: ThemeMode): void {
-    this.personalization.updateAppearance({ theme: mode });
-  }
-
-  private updateActiveTheme(mode: ThemeMode) {
-    this.cleanupObservers();
-
-    if (mode === 'auto') {
-      this.handleAutoTheme();
-    } else {
-      const themeToApply = mode === 'dark' ? 'dark-theme' : 'light-theme';
-      this._activeTheme.set(themeToApply);
-      this.applyThemeToGlobal(themeToApply);
-    }
-  }
-
-  private handleAutoTheme() {
-    // Initial detection
-    this.detectAndApplyParentTheme();
-
-    // Watch for changes in parent
-    this.observer = new MutationObserver(() => {
-      this.detectAndApplyParentTheme();
-    });
-
-    this.observer.observe(document.documentElement, {
-      attributes: true,
-      attributeFilter: ['class', 'data-theme'],
-    });
-    this.observer.observe(document.body, {
-      attributes: true,
-      attributeFilter: ['class', 'data-theme'],
-    });
-  }
-
-  private detectAndApplyParentTheme() {
-    const isDark = this.isParentDark();
-    const newTheme = isDark ? 'dark-theme' : 'light-theme';
-
-    // Only update if changed to avoid unnecessary DOM updates
-    if (this._activeTheme() !== newTheme) {
-      this._activeTheme.set(newTheme);
-      this.applyThemeToGlobal(newTheme);
-    }
-  }
-
-  private isParentDark(): boolean {
-    const body = document.body;
-    const html = document.documentElement;
-
-    // Check for common class names
-    const darkClasses = ['dark', 'dark-theme', 'dark-mode', 'night-mode'];
-    const hasDarkClass = (el: HTMLElement) => darkClasses.some((c) => el.classList.contains(c));
-
-    if (hasDarkClass(body) || hasDarkClass(html)) return true;
-
-    // Check for data-theme attribute
-    if (body.getAttribute('data-theme') === 'dark' || html.getAttribute('data-theme') === 'dark')
-      return true;
-
-    //  Check for Bootstrap 5.3+ data-bs-theme
-    if (
-      body.getAttribute('data-bs-theme') === 'dark' ||
-      html.getAttribute('data-bs-theme') === 'dark'
-    ) {
-      return true;
-    }
-
-    // Fallback to system preference
-    // return window.matchMedia('(prefers-color-scheme: dark)').matches;
-    return false;
-  }
-
-  private applyThemeToGlobal(theme: 'light-theme' | 'dark-theme') {
-    const overlayContainer = this.overlay.getContainerElement();
-    const root = document.documentElement;
-
-    // Apply to root for global CSS variables (light-dark() support)
-    this.renderer.removeClass(root, 'light-theme');
-    this.renderer.removeClass(root, 'dark-theme');
-    this.renderer.addClass(root, theme);
-
-    // Also apply to overlay container (for menus/dialogs)
-    this.renderer.removeClass(overlayContainer, 'light-theme');
-    this.renderer.removeClass(overlayContainer, 'dark-theme');
-    this.renderer.addClass(overlayContainer, theme);
-  }
-
-  private cleanupObservers() {
-    if (this.observer) {
-      this.observer.disconnect();
-      this.observer = null;
-    }
-  }
-
-  ngOnDestroy() {
-    this.cleanupObservers();
-  }
-
-  /**
-   * @deprecated Manual CSS variable application is now handled via theme.css tokens
-   */
-  public applyCssVariables(element: HTMLElement, config: DoohbotThemeConfig | undefined) {
-    if (!config) return;
-
-    const isDark = this._activeTheme() === 'dark-theme';
-
-    const applyColor = (input: string | undefined, variableName: string) => {
-      if (input) {
-        const parts = input.split(',').map((p) => p.trim());
-        const colorToUse = parts.length >= 2 ? (isDark ? parts[1] : parts[0]) : parts[0];
-        // Apply to Component Host
-        element.style.setProperty(`--${variableName}`, colorToUse);
-
-        // Apply to Overlay Container (for Dialogs/Menus which exist outside host)
-        this.overlay.getContainerElement().style.setProperty(`--${variableName}`, colorToUse);
-
-        // Secondary mapping for specific variables that have derived states
-        // if (variableName === 'primary-color') {
-        //   element.style.setProperty('--user-message-color', colorToUse);
-        //   element.style.setProperty('--mat-sys-primary', colorToUse);
-        //   const onPrimary = this.getContrastColor(colorToUse);
-        //   element.style.setProperty('--user-text-color', onPrimary);
-        //   element.style.setProperty('--mat-sys-on-primary', onPrimary);
-        // }
-      }
-    };
-
-    // Font
-    if (config.fontFamily) element.style.setProperty('--font-family', config.fontFamily);
-
-    // Primary & Secondary
-    // Handled globally via PersonalizationService/applyPrimaryColorToGlobal to allow user overrides
-    // applyColor(config.primaryColor, 'primary-color');
-    applyColor(config.secondaryColor, 'secondary-color');
-
-    // Backgrounds
-    applyColor(config.backgroundColor, 'background-color');
-
-    // Ensure chat input also follows dual mode if provided, or defaults?
-    // User only asked for background color "of the entire app".
-    applyColor(config.chatInputColor, 'chat-input-color');
-
-    // Text Colors
-    applyColor(config.textAltColor, 'text-alt-color');
-    applyColor(config.textColor, 'text-color');
-    applyColor(config.secondaryTextColor, 'secondary-text-color');
-    applyColor(config.hintTextColor, 'hint-text-color');
-
-    // Button Colors
-    applyColor(config.buttonColor, 'button-color');
-
-    // Message Colors
-    applyColor(config.userMessageColor, 'user-message-color');
-    applyColor(config.botMessageColor, 'bot-message-color');
-
-    // Message Text Colors
-    applyColor(config.userTextColor, 'user-text-color');
-    applyColor(config.botTextColor, 'bot-text-color');
-
-    // Borders
-    applyColor(config.borderColor, 'border-color');
-    applyColor(config.borderShadowColor, 'border-shadow-color');
-    applyColor(config.borderTopColor, 'border-top-color');
-
-    // Indicators
-    applyColor(config.typingIndicatorColor, 'typing-indicator-color');
-
-    // Utility Colors
-    applyColor(config.white, 'white');
-    applyColor(config.black, 'black');
-    applyColor(config.grey, 'grey');
-    applyColor(config.red, 'red');
-    applyColor(config.yellow, 'yellow');
-    applyColor(config.orange, 'orange');
-    applyColor(config.green, 'green');
-    applyColor(config.blue, 'blue');
-  }
-}

package/projects/doohbot/src/lib/core/utils/error-handler.util.ts

@@ -1,31 +0,0 @@
-import { HttpErrorResponse } from '@angular/common/http';
-
-export class ErrorHandlerUtil {
-  /**
-   * Maps an error to a user-friendly message
-   */
-  public static handleError(error: any): string {
-    if (error instanceof HttpErrorResponse) {
-      switch (error.status) {
-        case 401:
-          return 'Unauthorized. Please check your credentials.';
-        case 403:
-          return 'Forbidden. You do not have permission to perform this action.';
-        case 404:
-          return 'The requested resource was not found.';
-        case 429:
-          return 'Too many requests. Please try again later.';
-        case 500:
-          return 'Internal server error. Please try again later.';
-        default:
-          return error.error?.message || 'An unexpected error occurred.';
-      }
-    }
-
-    if (error instanceof Error) {
-      return error.message;
-    }
-
-    return 'An unexpected error occurred.';
-  }
-}

package/projects/doohbot/src/lib/core/utils/logger.service.ts

@@ -1,45 +0,0 @@
-import { isDevMode } from '@angular/core';
-
-class Logger {
-  private static prefix = '[Doohbot]';
-
-  // 🎨 Color styles
-  private static styles = {
-    log: 'color:#2196f3; font-weight:500',
-    info: 'color:#4caf50; font-weight:500',
-    warn: 'color:#ff9800; font-weight:600',
-    error: 'color:#f44336; font-weight:700',
-    debug: 'color:#9c27b0; font-weight:500',
-  };
-
-  private static canLog(): boolean {
-    return isDevMode();
-  }
-
-  static log(message: string, ...args: any[]): void {
-    if (!this.canLog()) return;
-    console.log(`%c${this.prefix} ${message}`, this.styles.log, ...args);
-  }
-
-  static info(message: string, ...args: any[]): void {
-    if (!this.canLog()) return;
-    console.info(`%c${this.prefix} ${message}`, this.styles.info, ...args);
-  }
-
-  static warn(message: string, ...args: any[]): void {
-    if (!this.canLog()) return;
-    console.warn(`%c${this.prefix} ${message}`, this.styles.warn, ...args);
-  }
-
-  static error(message: string, ...args: any[]): void {
-    if (!this.canLog()) return;
-    console.error(`%c${this.prefix} ${message}`, this.styles.error, ...args);
-  }
-
-  static debug(message: string, ...args: any[]): void {
-    if (!this.canLog()) return;
-    console.debug(`%c${this.prefix} ${message}`, this.styles.debug, ...args);
-  }
-}
-
-export default Logger;

package/projects/doohbot/src/lib/doohbot-input.ts

@@ -1,19 +0,0 @@
-export class DoohbotInput {
-  username = '';
-  password = '';
-  rememberMe?: boolean = false;
-  authToken?: string;
-  license?: string = '';
-  licenseCode?: string = '';
-  licenseKey?: string = '';
-  licenseFilePath?: string = '';
-  apiBaseUrl?: string = '';
-  apiSegment?: string = '';
-  tenancyName?: string = '';
-  storageKey?: string = '';
-  secretKey?: string = '';
-  companyCode?: string = '';
-  buttonStyle?: 'fab' | 'sidebar' | 'sidebar-top' | 'sidebar-bottom';
-  primaryColor?: string = '';
-  accentColor?: string = '';
-}

package/projects/doohbot/src/lib/doohbot.component.html

@@ -1,34 +0,0 @@
-<app-chat-button [buttonStyle]="activeButtonStyle()" [isChatOpen]="isChatOpen()" [unreadCount]="unreadCount()"
-  [appTitle]="DoohbotConst.appTitle" [appLogoUrl]="DoohbotConst.appLogo" [appTextLogoUrl]="DoohbotConst.appTextLogo"
-  (toggle)="toggleChat()"></app-chat-button>
-
-@if (isChatOpen()) {
-<app-chat-window appFullscreen [isChatOpen]="isChatOpen()" [enableDrag]="enableDrag" [enableResize]="enableResize"
-  [isFullScreen]="isFullScreen()" [appTitle]="DoohbotConst.appTitle" [appLogoUrl]="DoohbotConst.appLogo"
-  [appTextLogoUrl]="DoohbotConst.appTextLogo" [appHeaderLogoUrl]="DoohbotConst.appHeaderLogo" [messages]="messages()"
-  [isBotTyping]="isBotTyping()" [isStreaming]="isStreaming()" [appSubtitle]="DoohbotConst.appSubtitle"
-  [welcomeDesc]="DoohbotConst.welcomeDescription" [predefinedMessages]="predefinedMessages"
-  [suggestedMessages]="suggestedMessages" [botAvatarUrl]="DoohbotConst.botAvatar"
-  [userAvatarUrl]="DoohbotConst.userAvatar" [userName]="userName" [trackByMessageId]="trackByMessageId"
-  [hintText]="DoohbotConst.hintText" [messageError]="messageError()" [showSuggestionChips]="showSuggestionChips()"
-  [buttonStyle]="activeButtonStyle()" [isHistorySidebarOpen]="isHistorySidebarOpen()" [chatSessions]="chatSessions()"
-  [isLoadingSessions]="isLoadingSessions()" [processingSessionId]="processingSessionId()"
-  [hasMoreSessions]="hasMoreHistory()" [isLoadingMoreSessions]="isLoadingMore()" [chatHistoryUserName]="userName"
-  [isLoggingIn]="isLoggingIn()" [isAuthenticated]="isAuthenticated()" [authError]="authError()"
-  [authSuccess]="authSuccess()" (toggleChat)="toggleChat()" (loginSubmit)="onNormalLogin($event)"
-  (toggleFullScreen)="toggleFullScreen()" (toggleHistorySidebar)="toggleHistorySidebar()"
-  (sessionSelected)="loadChatSession($event)" (sessionDeleted)="deleteSession($event)"
-  (sessionRenamed)="renameSession($event)" (loadMoreSessions)="loadMoreHistory()" (refreshSessions)="refreshHistory()"
-  (suggestionClick)="sendMessage($event)" (send)="sendMessage($event)" (stop)="onStopRequest()"
-  (clearMessageError)="clearMessageError()" (clearChat)="clearChat()" (deleteAllSessions)="deleteAllSessions()"
-  (logout)="performLogout()"></app-chat-window>
-}
-
-<!-- Skeleton Loader while auth is unknown or refreshing -->
-<!-- @if (isChatOpen() && (authStatus() === 'expired')) {
-<div class="auth-loading-skeleton">
-  <div class="skeleton-header"></div>
-  <div class="skeleton-messages"></div>
-  <div class="skeleton-input"></div>
-</div>
-} -->

package/projects/doohbot/src/lib/doohbot.component.scss

@@ -1,17 +0,0 @@
-@use '@angular/material' as mat;
-@use './styles/material-override' as *;
-@use './styles/theme' as *;
-
-// Global base styles (since encapsulation is None, these apply globally)
-html,
-body {
-  height: 100%;
-  margin: 0;
-  color-scheme: light dark;
-}
-
-body {
-  font-family: Roboto, 'Helvetica Neue', sans-serif;
-  color: var(--mat-sys-on-background);
-  background-color: var(--mat-sys-background);
-}

package/projects/doohbot/src/lib/doohbot.component.spec.ts

@@ -1,31 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { Doohbot } from './doohbot.component';
-import { ThemeService } from './core/services/theme.service';
-import { signal } from '@angular/core';
-
-describe('Doohbot', () => {
-  let component: Doohbot;
-  let fixture: ComponentFixture<Doohbot>;
-  let themeServiceMock: any;
-
-  beforeEach(async () => {
-    themeServiceMock = {
-      activeTheme: signal('light-theme'),
-      setTheme: jasmine.createSpy('setTheme'),
-      theme: signal('system'),
-    };
-
-    await TestBed.configureTestingModule({
-      imports: [Doohbot],
-      providers: [{ provide: ThemeService, useValue: themeServiceMock }],
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(Doohbot);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});