Merge branch 'master' into 4650-unsaved-changes-dialog

open-learning-exchange · Jan 16, 2025 · 903bedb · 903bedb
2 parents e831812 + df8e748
commit 903bedb
Show file tree

Hide file tree

Showing 146 changed files with 1,999 additions and 771 deletions.
diff --git a/package.json b/package.json
@@ -3,8 +3,8 @@
   "license": "AGPL-3.0",
   "version": "0.16.64",
   "myplanet": {
-    "latest": "v0.20.97",
-    "min": "v0.19.97"
+    "latest": "v0.22.13",
+    "min": "v0.21.13"
   },
   "scripts": {
     "ng": "ng",

diff --git a/src/app/chat/chat-sidebar/chat-sidebar.component.html b/src/app/chat/chat-sidebar/chat-sidebar.component.html
@@ -13,8 +13,8 @@
       <button mat-icon-button color="primary" (click)="resetFilter()" [disabled]="!titleSearch && !searchType" matTooltip="Clear search" i18n-matTooltip [matTooltipDisabled]="!titleSearch && !searchType">
         <mat-icon>delete</mat-icon>
       </button><br>
-      <span style="font-size: small; font-style: italic;" i18n>Full Conversation Search </span>
       <mat-checkbox [checked]="fullTextSearch" (change)="toggleSearchType()"></mat-checkbox>
+      <span style="font-size: small; font-style: italic;" i18n>Full Conversation Search </span>
       <button style="text-align: end;" mat-icon-button (mouseenter)="toggleOverlay()" (mouseleave)="toggleOverlay()" cdkOverlayOrigin #trigger="cdkOverlayOrigin">
         <mat-icon>help_outline</mat-icon>
       </button>
@@ -69,7 +69,7 @@
       </ul>
     </ng-container>
     <ng-template #noChats>
-      <div i18n>No previous conversations.</div>
+      <div class="no-chats-message" i18n>No previous conversations.</div>
     </ng-template>
   </mat-drawer>
 

diff --git a/src/app/chat/chat-sidebar/chat-sidebar.component.ts b/src/app/chat/chat-sidebar/chat-sidebar.component.ts
@@ -4,7 +4,7 @@ import { MatDialog } from '@angular/material/dialog';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 
-import { Conversation } from '../chat.model';
+import { Conversation, AIProvider } from '../chat.model';
 import { ChatService } from '../../shared/chat.service';
 import { CouchService } from '../../shared/couchdb.service';
 import { DeviceInfoService, DeviceType } from '../../shared/device-info.service';
@@ -33,6 +33,7 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
   selectedConversation: Conversation;
   lastRenderedConversation: number;
   isEditing: boolean;
+  provider: AIProvider;
   fullTextSearch = false;
   searchType: 'questions' | 'responses';
   overlayOpen = false;
@@ -56,6 +57,7 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
     this.titleSearch = '';
     this.getChatHistory();
     this.subscribeToNewChats();
+    this.subscribeToAIService();
   }
 
   ngOnDestroy() {
@@ -71,14 +73,39 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
   subscribeToNewChats() {
     this.chatService.newChatAdded$
       .pipe(takeUntil(this.onDestroy$))
-      .subscribe(() => this.getChatHistory());
+      .subscribe(() => this.getChatHistory(true));
+  }
+
+  subscribeToAIService() {
+    this.chatService.toggleAIService$
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((aiService => {
+        this.provider = {
+          name: aiService
+        };
+        this.hasProviderChanged();
+      }));
   }
 
   newChat() {
     this.chatService.sendNewChatSelectedSignal();
+    this.chatService.setChatAIProvider(undefined);
     this.selectedConversation = null;
   }
 
+  hasProviderChanged() {
+    const currentProvider = this.chatService.getChatAIProvider();
+    if (!currentProvider) {
+      // That means it's a brand-new chat
+      return;
+    }
+    if (currentProvider.name === this.provider.name) {
+      // That means the same model is still being used
+      return;
+    }
+    this.newChat();
+  }
+
   toggleEditTitle() {
     this.isEditing = !this.isEditing;
   }
@@ -94,7 +121,7 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
         title: title !== undefined && title !== null ? title : conversation.title,
         shared: shared,
         updatedDate: this.couchService.datePlaceholder
-     }
+      }
     ).subscribe((data) => {
       this.getChatHistory();
       return data;
@@ -119,7 +146,7 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
     });
   }
 
-  getChatHistory() {
+  getChatHistory(newChat: boolean = false) {
     this.chatService
       .findConversations([], [ this.userService.get().name ])
       .subscribe(
@@ -133,6 +160,9 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
               return dateB - dateA;
             });
           this.filteredConversations = [ ...this.conversations ];
+          if (newChat) {
+            this.selectConversation(this.filteredConversations[0], 0);
+          }
           this.initializeFormGroups();
         },
         (error) => console.log(error)
@@ -141,6 +171,11 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
 
   selectConversation(conversation, index: number) {
     this.selectedConversation = conversation;
+    const aiProvider: AIProvider = {
+      name: this.selectedConversation['aiProvider'],
+    };
+    this.chatService.setChatAIProvider(aiProvider);
+    const currentProvider = this.chatService.getChatAIProvider();
     this.chatService.setSelectedConversationId({
       '_id': conversation?._id,
       '_rev': conversation?._rev
@@ -211,14 +246,18 @@ export class ChatSidebarComponent implements OnInit, OnDestroy {
   }
 
   openShareDialog(conversation) {
-    this.dialog.open(DialogsChatShareComponent, {
+    const dialogRef = this.dialog.open(DialogsChatShareComponent, {
       width: '50vw',
       maxHeight: '90vh',
       data: {
         news: conversation,
       }
     });
-    this.updateConversation(conversation, null, true);
-  }
 
+    dialogRef.afterClosed().subscribe((result) => {
+      if (result) {
+        this.updateConversation(conversation, null, true);
+      }
+    });
+  }
 }
diff --git a/src/app/chat/chat-sidebar/chat-sidebar.scss b/src/app/chat/chat-sidebar/chat-sidebar.scss
@@ -77,6 +77,14 @@ li:hover {
   margin: 0;
 }
 
+.no-chats-message {
+  margin-left: 4px;
+}
+
+.mat-checkbox {
+  margin-right: 4px;
+}
+
 @media only screen and (max-width: $screen-md) {
   .expand-button {
     top: 10px;

diff --git a/src/app/chat/chat-window/chat-window.component.html b/src/app/chat/chat-window/chat-window.component.html
@@ -11,7 +11,7 @@
       <mat-form-field class="full-width mat-form-field-type-no-underline">
         <mat-label i18n>Chat</mat-label>
         <div class="textarea-container">
-          <textarea matInput [formControl]="promptForm.controls.prompt" rows="5" placeholder="Send a message" i18n-placeholder></textarea>
+          <textarea #chatInput matInput [formControl]="promptForm.controls.prompt" rows="5" placeholder="Send a message" i18n-placeholder></textarea>
           <button
             mat-icon-button
             [planetSubmit]="promptForm.valid && spinnerOn"

diff --git a/src/app/chat/chat-window/chat-window.component.ts b/src/app/chat/chat-window/chat-window.component.ts
@@ -1,7 +1,7 @@
-import { Component, OnInit, OnDestroy, ViewChild, ElementRef, ChangeDetectorRef, Input } from '@angular/core';
+import { Component, OnInit, OnDestroy, ViewChild, ElementRef, ChangeDetectorRef, Input, AfterViewInit } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
+import { filter, takeUntil } from 'rxjs/operators';
 
 import { CustomValidators } from '../../validators/custom-validators';
 import { ConversationForm, AIProvider } from '../chat.model';
@@ -15,11 +15,12 @@ import { StateService } from '../../shared/state.service';
   templateUrl: './chat-window.component.html',
   styleUrls: [ './chat-window.scss' ],
 })
-export class ChatWindowComponent implements OnInit, OnDestroy {
+export class ChatWindowComponent implements OnInit, OnDestroy, AfterViewInit {
   private onDestroy$ = new Subject<void>();
   spinnerOn = true;
   streaming: boolean;
   disabled = false;
+  clearChat = true;
   provider: AIProvider;
   conversations: any[] = [];
   selectedConversationId: any;
@@ -34,8 +35,8 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
     context: '',
   };
   providers: AIProvider[] = [];
-
   @Input() context: any;
+  @ViewChild('chatInput') chatInput: ElementRef;
   @ViewChild('chat') chatContainer: ElementRef;
 
   constructor(
@@ -57,6 +58,10 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
     });
   }
 
+  ngAfterViewInit() {
+    this.focusInput();
+  }
+
   ngOnDestroy() {
     this.onDestroy$.next();
     this.onDestroy$.complete();
@@ -67,19 +72,29 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
     this.chatService.newChatSelected$
       .pipe(takeUntil(this.onDestroy$))
       .subscribe(() => {
-        this.selectedConversationId = null;
-        this.conversations = [];
+        this.resetConversation();
+        this.focusInput();
       }, error => {
         console.error('Error subscribing to newChatSelected$', error);
       });
   }
 
   subscribeToSelectedConversation() {
     this.chatService.selectedConversationId$
-      .pipe(takeUntil(this.onDestroy$))
+      .pipe(
+        takeUntil(this.onDestroy$),
+        filter(() => {
+          if (this.clearChat) {
+            this.clearChat = false;
+            return false;
+          }
+          return true;
+        })
+      )
       .subscribe((conversationId) => {
         this.selectedConversationId = conversationId;
         this.fetchConversation(this.selectedConversationId?._id);
+        this.focusInput();
       }, error => {
         console.error('Error subscribing to selectedConversationId$', error);
       });
@@ -92,9 +107,15 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
         this.provider = {
           name: aiService
         };
+        this.focusInput();
       }));
   }
 
+  resetConversation() {
+    this.conversations = [];
+    this.selectedConversationId = null;
+  }
+
   createForm() {
     this.promptForm = this.formBuilder.group({
       prompt: [ '', CustomValidators.required ],
@@ -205,6 +226,7 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
     const content = this.promptForm.get('prompt').value;
     this.data = { ...this.data, content, aiProvider: this.provider };
 
+    this.chatService.setChatAIProvider(this.data.aiProvider);
     this.setSelectedConversation();
 
     if (this.context) {
@@ -233,4 +255,8 @@ export class ChatWindowComponent implements OnInit, OnDestroy {
       );
     }
   }
+
+  focusInput() {
+    this.chatInput?.nativeElement.focus();
+  }
 }
diff --git a/src/app/chat/chat-window/chat-window.scss b/src/app/chat/chat-window/chat-window.scss
@@ -27,9 +27,14 @@
   border-radius: 5px;
 }
 
+.textarea-container textarea {
+  resize: none;
+  height: 100px;
+}
+
 .textarea-container button {
   position: absolute;
-  top: 50%;
+  top: 70%;
   right: 8px;
   transform: translateY(-50%);
 }

diff --git a/src/app/chat/chat.component.ts b/src/app/chat/chat.component.ts
@@ -27,6 +27,17 @@ export class ChatComponent implements OnInit {
       this.displayToggle = this.aiServices.length > 0;
       this.chatService.toggleAIServiceSignal(this.activeService);
     });
+    this.subscribeToAIService();
+  }
+
+  subscribeToAIService() {
+    this.chatService.currentChatAIProvider$
+      .subscribe((aiService => {
+        if (aiService) {
+          this.activeService = aiService.name;
+          this.toggleAIService();
+        }
+      }));
   }
 
   goBack(): void {

diff --git a/src/app/community/community.component.html b/src/app/community/community.component.html
@@ -72,7 +72,7 @@ <h3 style="text-align: right; margin-right: 0.5rem;">
           <planet-teams-reports [reports]="reports" [editable]="isCommunityLeader && !planetCode" [team]="team" (reportsChanged)="dataChanged()"></planet-teams-reports>
         </mat-tab>
         <mat-tab i18n-label label="Calendar" *ngIf="deviceType !== deviceTypes.DESKTOP">
-          <planet-calendar [resizeCalendar]="resizeCalendar" [link]="{ teams: teamId }" [sync]="{ type: 'sync', planetCode: planetCode || configuration.code }"></planet-calendar>
+          <planet-calendar [resizeCalendar]="resizeCalendar" [type]="'community'" [link]="{ teams: teamId }" [sync]="{ type: 'sync', planetCode: planetCode || configuration.code }"></planet-calendar>
         </mat-tab>
       </mat-tab-group>
     </div>