http-request-manager 18.7.21 → 18.7.27

package/src/lib/http-request-services-demo/request-manager-ws-demo/components/ws-messaging/ws-messaging.component.ts

@@ -1,229 +0,0 @@
-import { Component, inject, Input, OnInit, OnDestroy } from '@angular/core';
-import { MessageServiceDemo } from '../../services/message-service-demo.service';
-import { StateServiceDemo } from '../../services/state-service-demo.service';
-import { FormBuilder, FormControl, Validators } from '@angular/forms';
-import { WSUser } from '../../../..';
-import { Observable, combineLatest, map, EMPTY, Subject, takeUntil, filter, take, startWith, distinctUntilChanged } from 'rxjs';
-
-import { ChannelMessage } from '../../../../services/ws-manager-service/models/channel-message.model';
-import { ToastMessageDisplayService, ToastDisplay, ToastColors } from 'toast-message-display';
-
-@Component({
-    selector: 'app-ws-messaging',
-    templateUrl: './ws-messaging.component.html',
-    styleUrls: ['./ws-messaging.component.css'],
-    standalone: false
-})
-export class WsMessagingComponent implements OnInit, OnDestroy {
-
-  @Input() server!: string;
-  @Input() wsServer!: string;
-  @Input() jwtToken!: string;
-  @Input() user!: any;
-
-  private destroy$ = new Subject<void>();
-
-  fb = inject(FormBuilder);
-  messageService = inject(MessageServiceDemo);
-  stateService = inject(StateServiceDemo);
-  toastService = inject(ToastMessageDisplayService);
-
-  // Only show public channels (starting with "PUB-"), strip prefix for display
-  // SYS- channels are private/internal and hidden from users
-  channels$ = this.messageService.channels$.pipe(
-    map(channels => channels
-      ?.filter(channel => channel.startsWith('PUB-'))
-      .map(channel => channel.replace('PUB-', '')) || []
-    ),
-    startWith([] as string[]),
-    distinctUntilChanged((prev, curr) => prev.length === curr.length && prev.every((v, i) => v === curr[i]))
-  );
-
-  // Track subscribed public channels only, strip prefix for display
-  subscribedChannels$ = this.messageService.subscribedChannels$.pipe(
-    map(set => Array.from(set)
-      .filter(channel => channel.startsWith('PUB-'))
-      .map(channel => channel.replace('PUB-', ''))
-    ),
-    startWith([] as string[]),
-    distinctUntilChanged((prev, curr) => prev.length === curr.length && prev.every((v, i) => v === curr[i]))
-  );
-
-  user$ = this.stateService.user$;
-
-  data$ = this.stateService.data$;
-
-  connectionStatus$ = this.stateService.connectionStatus$;
-
-  // Form for creating new channels
-  newChannelName = this.fb.control<string>('', [Validators.required, Validators.minLength(2)])
-
-  // Form for selecting channels to send to and message content
-  messages = this.fb.group({
-    selectedChannels: this.fb.control<string[]>([], Validators.required),
-    content: this.fb.control<string|null>(null, Validators.required),
-  })
-
-  get selectedChannels() {
-    return this.messages.get('selectedChannels') as FormControl
-  }
-
-  get content() {
-    return this.messages.get('content') as FormControl
-  }
-
-  communicationMessages$ = this.messageService.communicationMessages$;
-  latestCommunicationMessages$ = this.messageService.latestCommunicationMessages$;
-
-  chat$: Observable<{ user: any, messages: any[]}|any> = combineLatest([this.user$, this.communicationMessages$])
-  .pipe(
-    map(([user, messages]: any) => ({ user, messages })),
-    map(obj => {
-
-      if(!obj.user) return EMPTY
-
-      const mainUser = ''
-
-      const messages = obj.messages.map((item: any) => {
-        // Message transformation logic
-      })
-
-      return { user: mainUser, messages }
-
-    })
-  );
-
-  ngOnInit() {
-
-    this.stateService.updateConnection(this.server, this.wsServer, this.jwtToken, this.user);
-
-    // Only trigger once when connection becomes true
-    this.connectionStatus$.pipe(
-      filter(status => status === true),
-      take(1),
-      takeUntil(this.destroy$)
-    ).subscribe(() => {
-      // Fetch existing channels when connected (user will create channels in demo)
-      this.messageService.getAllChannels();
-    });
-
-    // Subscribe to latest messages and show toast notification
-    this.latestCommunicationMessages$.pipe(
-      filter(message => !!message),
-      takeUntil(this.destroy$)
-    ).subscribe((message: any) => {
-      const messageContent = message.content?.message || '';
-
-      this.toastService.toastMessage(
-        ToastDisplay.adapt({
-          message: messageContent,
-          color: ToastColors.INFO,
-          icon: 'chat',
-          action: 'DONE'
-        }),
-        -1  // Stay until dismissed
-      );
-    });
-
-  }
-
-  ngOnDestroy() {
-    this.destroy$.next();
-    this.destroy$.complete();
-  }
-
-  /**
-   * Create a new public channel without auto-subscribing
-   * NOTE: PUB- prefix is added by messageService.createChannel
-   */
-  onCreateChannel() {
-    if (this.newChannelName.invalid) return;
-
-    const channelName = this.newChannelName.value?.trim();
-    if (channelName) {
-      // Pass base channel name - service adds PUB- prefix
-      this.messageService.createChannel(channelName);
-      this.newChannelName.reset();
-      // Server will broadcast updated channel list to all clients automatically
-    }
-  }
-
-  /**
-   * Subscribe to a channel to receive messages
-   * NOTE: PUB- prefix is added by messageService.subscribeToChannel
-   */
-  onSubscribeToChannel(channel: string) {
-    // Pass base channel name - service adds PUB- prefix
-    this.messageService.subscribeToChannel(channel);
-    // Reset channel selection when subscriptions change
-    this.selectedChannels.reset([]);
-  }
-
-  /**
-   * Unsubscribe from a channel
-   * NOTE: PUB- prefix is added by messageService.unsubscribeFromChannel
-   */
-  onUnsubscribeFromChannel(channel: string) {
-    // Pass base channel name - service adds PUB- prefix
-    this.messageService.unsubscribeFromChannel(channel);
-    // Reset channel selection when subscriptions change
-    this.selectedChannels.reset([]);
-  }
-
-  /**
-   * Handle chip toggle for subscribe/unsubscribe
-   */
-  onChipToggle(channel: string, event: any) {
-    if (event.selected) {
-      this.onSubscribeToChannel(channel);
-    } else {
-      this.onUnsubscribeFromChannel(channel);
-    }
-  }
-
-  /**
-   * Check if currently subscribed to a channel
-   * Compares display names (without PUB- prefix)
-   */
-  isSubscribed(channel: string, subscribedChannels: string[]): boolean {
-    return subscribedChannels.includes(channel);
-  }
-
-  /**
-   * Handle chip click - toggle subscription state
-   */
-  onChipClick(channel: string, subscribedChannels: string[]) {
-    const isCurrentlySubscribed = this.isSubscribed(channel, subscribedChannels);
-    if (isCurrentlySubscribed) {
-      this.onUnsubscribeFromChannel(channel);
-    } else {
-      this.onSubscribeToChannel(channel);
-    }
-  }
-
-  onSendMessage(user: WSUser) {
-
-    this.messages.markAllAsTouched()
-
-    if (this.messages.invalid) return
-
-    const channelsToSend = this.selectedChannels.value as string[]
-    if (channelsToSend.length === 0) return
-
-    // Pass base channel names - service adds PUB- prefix
-    const message = ChannelMessage.adapt({
-      sessionId: {  // user object with 'id' as the ID field
-        id: user.id,
-        ldap: user.ldap,
-        name: user.name,
-        email: user.email,
-      },
-      content: { message: this.messages.value.content },
-    })
-
-    this.messageService.sendMessage(message, channelsToSend);
-    this.content.reset();
-
-  }
-
-}

package/src/lib/http-request-services-demo/request-manager-ws-demo/components/ws-notifications/ws-notifications.component.css

@@ -1,30 +0,0 @@
-/* Style for colored notification messages */
-.colored-message {
-  font-weight: 500;
-  padding: 4px 8px;
-  border-radius: 4px;
-  display: inline-block;
-  max-width: 100%;
-  word-wrap: break-word;
-}
-
-/* Ensure good contrast for colored text */
-.colored-message.black-text {
-  color: #000000 !important;
-}
-
-.colored-message.white-text {
-  color: #ffffff !important;
-  text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
-}
-
-/* Table cell styling */
-td.mat-mdc-cell {
-  padding: 8px 12px;
-}
-
-.pill {
-  border-radius: 1rem;
-  padding: .5rem 1rem;
-  color: #ffffff;
-}

package/src/lib/http-request-services-demo/request-manager-ws-demo/components/ws-notifications/ws-notifications.component.html

@@ -1,172 +0,0 @@
-<div style="display: flex; gap: 1rem; flex-direction: column; margin-top: 1rem;">
-
-  <!-- Channel Creation Section -->
-  <div style="padding: 1rem; background: #e8f5e9; border-radius: 4px;">
-    <strong>Create Notification Channel</strong>
-    <div style="display: flex; flex-direction: column; margin-top: 0.5rem;">
-      <mat-form-field appearance="outline" style="width: 100%;">
-        <mat-label>Channel Name</mat-label>
-        <input
-          matInput
-          [formControl]="newChannelName"
-          placeholder="Enter notification channel name"
-          (keydown.enter)="onCreateChannel()"
-        >
-      </mat-form-field>
-      <div style="display: flex; justify-content: flex-end; gap: 0.5rem;">
-        <button mat-raised-button color="accent" (click)="onDefinePreviousChannels()">
-          Define Previous Channels
-        </button>
-        <button mat-raised-button color="primary" (click)="onCreateChannel()"
-                [disabled]="newChannelName.invalid">
-          Create Channel
-        </button>
-      </div>
-    </div>
-  </div>
-
-  <!-- Channel Connection Section - Only shown when NOT connected -->
-  @if ((subscribedNotificationChannels$ | async); as subscribedChannels) {
-    @if (!isChannelConnected(subscribedChannels)) {
-      <div style="padding: 1rem; background: #e3f2fd; border-radius: 4px;">
-        <strong>Connect to Channel</strong>
-        <div style="display: flex; gap: 1rem; margin-top: 0.5rem; flex-wrap: wrap; align-items: flex-start;">
-          <!-- Channel Selection (from today's DB data) -->
-          <mat-form-field appearance="outline" style="flex: 1; min-width: 200px;">
-            <mat-label>Select Channel</mat-label>
-            <mat-select [formControl]="selectedConnectionChannel" placeholder="Select a notification channel">
-              @for (channel of (todaysNotificationChannels$ | async) || []; track channel) {
-                <mat-option [value]="channel">{{ channel }}</mat-option>
-              }
-              @empty {
-                <mat-option disabled>No channels with data for today</mat-option>
-              }
-            </mat-select>
-          </mat-form-field>
-
-          <!-- Date Filter -->
-          <mat-form-field appearance="outline" style="flex: 1; min-width: 200px;" [formGroup]="dateFilter">
-            <mat-label>Start Date</mat-label>
-            <input matInput [matDatepicker]="startPicker" formControlName="startDate">
-            <mat-datepicker-toggle matIconSuffix [for]="startPicker"></mat-datepicker-toggle>
-            <mat-datepicker #startPicker></mat-datepicker>
-          </mat-form-field>
-
-          <mat-form-field appearance="outline" style="flex: 1; min-width: 200px;" [formGroup]="dateFilter">
-            <mat-label>End Date</mat-label>
-            <input matInput [matDatepicker]="endPicker" formControlName="endDate">
-            <mat-datepicker-toggle matIconSuffix [for]="endPicker"></mat-datepicker-toggle>
-            <mat-datepicker #endPicker></mat-datepicker>
-          </mat-form-field>
-        </div>
-
-        <div style="display: flex; gap: 0.5rem;">
-          <span style="flex:1"></span>
-          <button
-            mat-raised-button color="primary"
-            (click)="onConnectToChannel()"
-            [disabled]="!selectedConnectionChannel.value"
-          >
-            Connect
-          </button>
-        </div>
-      </div>
-    }
-  }
-
-  <!-- Send Notification Section -->
-  @if ((subscribedNotificationChannels$ | async); as subscribedChannels) {
-    @if (subscribedChannels.length > 0) {
-      <div
-        style="padding: 1rem; background: #fff8e1; border-radius: 4px;"
-        [formGroup]="notificationForm"
-      >
-        <strong>Send Notification</strong>
-
-        <!-- Notification Content -->
-        <div style="display: flex; flex-direction: column; margin-top: 0.5rem;">
-          <mat-form-field style="width: 100%;" appearance="outline">
-            <mat-label>Notification Message</mat-label>
-            <textarea
-              matInput placeholder="Type your notification..."
-              formControlName="content"
-              rows="2"
-              (keydown.enter)="onSendNotification(); $event.preventDefault()"
-            ></textarea>
-          </mat-form-field>
-          <div style="display: flex; justify-content: flex-end; margin-top: -0.5rem;">
-            <button
-              mat-raised-button color="accent"
-              (click)="onSendNotification()"
-              [disabled]="notificationForm.invalid"
-            >
-              Send Notification
-            </button>
-          </div>
-        </div>
-      </div>
-    }
-  }
-
-  <!-- Notifications Table - Only shown when connected -->
-  @if ((subscribedNotificationChannels$ | async); as subscribedChannels) {
-    @if (isChannelConnected(subscribedChannels)) {
-      @if ((notificationMessages$ | async); as notifications) {
-        <div>
-          <div style="display: flex; justify-content: space-between; align-items: center;">
-            <strong>Notifications ({{ notifications.length }})</strong>
-          </div>
-
-          @if (notifications.length > 0) {
-            <div style="margin-top: 0.5rem; height: 400px; overflow: auto; border: 1px solid #888; border-radius: 4px;">
-              <table mat-table [dataSource]="notifications" style="width: 100%;">
-
-                <!-- Date Column -->
-                <ng-container matColumnDef="date">
-                  <th mat-header-cell *matHeaderCellDef style="width: 180px;">Date</th>
-                  <td mat-cell *matCellDef="let notification">
-                    {{ formatTimestamp(notification.created) | date }}
-                  </td>
-                </ng-container>
-
-                <!-- User Column -->
-                <ng-container matColumnDef="user">
-                  <th mat-header-cell *matHeaderCellDef style="width: 150px;">User</th>
-                  <td mat-cell *matCellDef="let notification">
-                    <strong>{{ notification.user_name }}</strong>
-                  </td>
-                </ng-container>
-
-                <!-- Message Column -->
-                <ng-container matColumnDef="message">
-                  <th mat-header-cell *matHeaderCellDef>Message</th>
-                  <td mat-cell *matCellDef="let notification">
-                  <div class="pill" [style.background-color]="notification.content.sessionId.color || '#000000'">
-                    {{ notification.content?.message || notification.content }}
-                  </div>
-                  </td>
-                </ng-container>
-
-                <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
-                <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-              </table>
-            </div>
-          } @else {
-            <div style="text-align: center; color: #666; padding: 2rem;">
-              <mat-icon style="font-size: 48px; height: 48px; width: 48px; opacity: 0.5;">notifications_none</mat-icon>
-              <p>No notifications yet. Waiting for notifications on this channel...</p>
-            </div>
-          }
-        </div>
-
-        <!-- Disconnect Button - Below the table -->
-        <div style="display: flex; justify-content: right; padding: 1rem;">
-          <button mat-raised-button color="warn" (click)="onDisconnectFromChannel()">
-            Disconnect from Channel
-          </button>
-        </div>
-      }
-    }
-  }
-
-</div>

package/src/lib/http-request-services-demo/request-manager-ws-demo/components/ws-notifications/ws-notifications.component.spec.ts

@@ -1,31 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
-import { HttpClientTestingModule } from '@angular/common/http/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
-
-import { WsNotificationsComponent } from './ws-notifications.component';
-
-describe('WsNotificationsComponent', () => {
-  let component: WsNotificationsComponent;
-  let fixture: ComponentFixture<WsNotificationsComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [ HttpClientTestingModule ],
-      declarations: [ WsNotificationsComponent ],
-      schemas: [ NO_ERRORS_SCHEMA ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(WsNotificationsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});