Release updates (#87)

* Version number to 1.5.1 * fixes different button sizes on data browser page * adds cursor pointer to case-sensitive checkbox on data browser page * Adds cancel option to zero shot run * New attributes reset name fixed * Removes fixed width from settings modals for task & embedding creation * Adds info for proejct without knowledge bases * Removes cancel project creation form issue * Adds restriction for to_names without equivalent * Removes checkbox for prioritizeExisting in Label Studio import if it is project creation * Added notice to take a look into restrictions * Filter text preserved on change fix * Removes duplicated tooltip for record ide run button * Remove websocket logs from console * Scrollable only part with labeling tasks on heuristics overview * Max height fixed for dropdown with names on models downloaded page * Changes link to sales ocntact * Adds save & load buttons for record ide * Change tooltip of crowd labeling icon on heuristic * Prevents capitalized kexcodes for hotkeys * Build optimizer set to true * Modal when resizing screen * Padding bottom for filter block * Version number changed from 1.5.1 to 1.6.0 * Notifications are not truncated anymore * Adds route highlight logic to route manager * Should solve redirect issue * Compilation for production reverted * Set fullrecord to null to prevent flickering * Fix issue flickering * Modal resizing * Readds fix for cursor repositionng in ac * label renaming findings * Finalch changes for test finidngs Co-authored-by: felix0496 <felix.kirsch@kern.ai> Co-authored-by: JWittmeyer <jens.wittmeyer@onetask.ai> Co-authored-by: SirDeGraf <simon.degraf@icloud.com> Co-authored-by: root <root@LAPTOP-Q0DKKSQ0.localdomain>
code-kern-ai · Nov 21, 2022 · bd81771 · bd81771
1 parent 65bf36d
commit bd81771
Show file tree

Hide file tree

Showing 30 changed files with 406 additions and 181 deletions.
diff --git a/angular.json b/angular.json
@@ -61,17 +61,12 @@
                 }
               ],
               "optimization": true,
-              "outputHashing": "none",
-              "sourceMap": true,
+              "outputHashing": "all",
+              "sourceMap": false,
               "namedChunks": false,
-              "showCircularDependencies": false,
-              "aot": true,
-              "extractLicenses": false,
-              "statsJson": false,
-              "progress": false,
+              "extractLicenses": true,
               "vendorChunk": false,
-              "buildOptimizer": false,
-              "subresourceIntegrity": false,
+              "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",

diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -1,8 +1,9 @@
-<div class="h-screen bg-gray-50 flex flex-col overflow-hidden">
+<div class="h-screen bg-gray-50 flex flex-col overflow-hidden"
+    [ngStyle]="{'width':windowWidth < minWidth ?minWidth+'px':'100%', 'overflow-x':windowWidth < minWidth? 'auto': 'hidden'}">
     <router-outlet></router-outlet>
 </div>
 
-<div class="absolute flex flex-col z-50 bottom-0 lg:left-24 left-2 mb-7 content-start">
+<div class="absolute flex flex-col z-50 bottom-0 left-24 mb-7 content-start">
     <div *ngFor="let notification of notificationList">
 
         <div *ngIf="notification.level === 'INFO'">
@@ -76,4 +77,16 @@
             </div>
         </div>
     </div>
-</div>
+</div>
+<kern-modal [isOpen]="sizeWarningOpen" [acceptButton]="{
+    buttonCaption:'Continue'}" [modalBoxStyle]="{'width':'600px'}">
+    <div class="flex flex-row justify-center text-lg leading-6 text-gray-900 font-medium mb-2">
+        Information </div>
+
+    <div class="mt-3 flex flex-row justify-between">
+        <div class="flex flex-row-reverse justify-start text-sm">
+            The application is designed for certain screen sizes (> {{minWidth}}px width). If you continue, the
+            application is provided with a global scrollbar.
+        </div>
+    </div>
+</kern-modal>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnDestroy, OnInit } from '@angular/core';
+import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { Subscription, timer } from 'rxjs';
 import { NotificationApolloService } from './base/services/notification/notification-apollo.service';
 import { interval } from 'rxjs';
@@ -18,8 +18,9 @@ import { RouteManager } from './util/route-manager';
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AppComponent implements OnDestroy, OnInit {
+export class AppComponent implements OnDestroy, OnInit, AfterViewInit {
   test = false;
   title = 'kern-frontspine';
   notificationList: any = [];
@@ -30,6 +31,9 @@ export class AppComponent implements OnDestroy, OnInit {
   notificationsSub$: any;
   notificationsQuery$: any;
   refetchTimer: any;
+  windowWidth: number;
+  sizeWarningOpen: boolean = false;
+  minWidth: number = 1250;
 
   constructor(
     private notificationApolloService: NotificationApolloService,
@@ -38,6 +42,7 @@ export class AppComponent implements OnDestroy, OnInit {
     private configService: ConfigApolloService,
     private router: Router,
     private http: HttpClient,
+    private cfRef: ChangeDetectorRef
   ) { }
 
   ngOnInit(): void {
@@ -51,6 +56,14 @@ export class AppComponent implements OnDestroy, OnInit {
     this.checkBrowser();
   }
 
+  ngAfterViewInit() {
+    this.onResize();
+  }
+
+  ngAfterViewChecked() {
+    this.cfRef.detectChanges();
+  }
+
   initialRequests() {
     CommentDataManager.initManager(this.organizationService);
     RouteManager.initRouteManager(this.router, this.organizationService);
@@ -177,5 +190,15 @@ export class AppComponent implements OnDestroy, OnInit {
     }
   }
 
+  @HostListener('window:resize', ['$event'])
+  onResize() {
+    this.windowWidth = window.innerWidth;
+    if (window.innerWidth < this.minWidth) {
+      this.sizeWarningOpen = true;
+    } else {
+      this.sizeWarningOpen = false;
+    }
+  }
+
 
 }
diff --git a/src/app/base/components/sidebar-pm/sidebar-pm.component.html b/src/app/base/components/sidebar-pm/sidebar-pm.component.html
@@ -215,7 +215,7 @@
                 </div>
                 <div class="flex-shrink-0 flex py-6 justify-center">
                     <label data-tip="Version overview" for="version-overview" (click)="requestVersionOverview()"
-                        class="z-50 tooltip tooltip-right cursor-pointer select-none text-white flex items-center">v1.5.0
+                        class="z-50 tooltip tooltip-right cursor-pointer select-none text-white flex items-center">v1.6.0
                         <svg *ngIf="hasUpdates" xmlns="http://www.w3.org/2000/svg" data-tip="Newer version available"
                             class="icon icon-tabler icon-tabler-alert-circle inline-block text-yellow-700 tooltip tooltip-right align-top ml-1"
                             width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"

diff --git a/src/app/base/components/sidebar-pm/sidebar-pm.component.ts b/src/app/base/components/sidebar-pm/sidebar-pm.component.ts
@@ -16,6 +16,7 @@ import { ProjectApolloService } from '../../services/project/project-apollo.serv
 import { ConfigApolloService } from '../../services/config/config-apollo.service';
 import { dateAsUTCDate } from 'src/app/util/helper-functions';
 import { ConfigManager } from '../../services/config-service';
+import { RouteManager } from 'src/app/util/route-manager';
 
 
 @Component({
@@ -68,22 +69,12 @@ export class SidebarPmComponent implements OnInit, OnDestroy {
   hasUpdates: boolean;
   private static initialConfigRequest: boolean = false;
 
-  // model-download isn't checked for since the page is accessed from different routes
-  // e.g. lastPage=settings => settings is checked for so settings is highlighted
-  routeColor = {
-    overview: { active: false, checkFor: ['overview'] },
-    data: { active: false, checkFor: ['data'] },
-    labeling: { active: false, checkFor: ['labeling', 'record-ide'] },
-    heuristics: { active: false, checkFor: ['heuristics', 'lookup-lists', 'model-callbacks', 'zero-shot', 'crowd-labeler'] },
-    settings: { active: false, checkFor: ['settings', 'attributes', 'add'] },
-  }
-
+  routeColor: any;
 
   constructor(
     private organizationService: OrganizationApolloService,
     private activatedRoute: ActivatedRoute,
     private auth: AuthApiService,
-    private router: Router,
     private projectApolloService: ProjectApolloService,
     private configService: ConfigApolloService,
     @Inject(DOCUMENT) private document: any
@@ -100,7 +91,6 @@ export class SidebarPmComponent implements OnInit, OnDestroy {
     }
 
     this.firstName.emit(this.user$);
-    this.checkRouteHighlight(this.router.url);
     this.logoutUrl$ = this.auth.getLogoutOut();
     this.subscriptions$.push(this.organizationService
       .getUserOrganization()
@@ -116,26 +106,8 @@ export class SidebarPmComponent implements OnInit, OnDestroy {
       SidebarPmComponent.initialConfigRequest = true;
     }
     this.checkIfManagedVersion();
-    this.initRouterListener();
-
-  }
+    this.routeColor = RouteManager.routeColor;
 
-  initRouterListener() {
-    this.subscriptions$.push(this.router.events.subscribe((val) => {
-      if (val instanceof RoutesRecognized) {
-        const values = { old: this.router.url, new: val.url };
-        if (values.old != values.new) {
-          this.checkRouteHighlight(val.url);
-        }
-      }
-    }));
-
-  }
-
-  checkRouteHighlight(url: string) {
-    for (const key in this.routeColor) {
-      this.routeColor[key].active = this.routeColor[key].checkFor.some(s => url.includes(s));
-    }
   }
 
   requestVersionOverview() {

diff --git a/src/app/base/components/upload-assistant/label-studio/label-studio-assistant.component.html b/src/app/base/components/upload-assistant/label-studio/label-studio-assistant.component.html
@@ -21,6 +21,11 @@
         <label
             class="bg-gray-100 text-gray-800 rounded-lg text-xs px-2.5 py-0.5 cursor-default border border-gray-300">Beta</label>
     </div>
+    <div class="flex flex-row items-center justify-center gap-x-2">
+        <span class="text-sm leading-6 text-gray-900 font-medium">
+            Please take a look into the restrictions
+        </span>
+    </div>
 
 
     <div class="flex justify-center">
@@ -64,7 +69,8 @@
                     <div class="whitespace-nowrap">External User: {{annotations.key}}</div>
                     <div class="whitespace-nowrap">Annotations: {{annotations.value}}</div>
                 </div>
-                <div *ngIf="info.errors.length==0" class="flex items-center col-span-full cursor-pointer tooltip"
+                <div *ngIf="info.errors.length==0 && isProjectAdd"
+                    class="flex items-center col-span-full cursor-pointer tooltip"
                     [attr.data-tip]="'If a record already has a user annotation it will be ' + (mappings.prioritizeExisting? 'preserved':'removed')"
                     (click)="states.preparation == PreparationStepType.MAPPING_TRANSFERRED?null:mappings.prioritizeExisting=!mappings.prioritizeExisting">
                     <input type="checkbox"
@@ -330,6 +336,19 @@ <h3 class="text-sm font-semibold text-gray-800">
                     </p>
                 </div>
             </li>
+            <li class="py-5">
+                <div class="relative">
+                    <h3 class="text-sm font-semibold text-gray-800">
+                        Attribute specific tasks - name equivalent
+                    </h3>
+                    <p class="mt-1 text-sm text-gray-600">If you want to create attribute specific labeling tasks, the
+                        "to_name"
+                        in the annotations of your file needs to be set to the attributes equivalent in records data. If
+                        for an "to_name" no
+                        equivalent attribute name is found, the labeling task gets created as a full record task.
+                    </p>
+                </div>
+            </li>
         </ul>
 
     </div>

diff --git a/src/app/base/services/notification.service.ts b/src/app/base/services/notification.service.ts
@@ -20,7 +20,7 @@ export class NotificationService {
   private notifications = new Subject<UserNotification[]>();
   private ws_subject;
 
-  private static registedNotificationListeners: Map<string, Map<Object, NotificationSubscription>> = new Map<string, Map<Object, NotificationSubscription>>();
+  private static registeredNotificationListeners: Map<string, Map<Object, NotificationSubscription>> = new Map<string, Map<Object, NotificationSubscription>>();
 
   private timeOutIteration: number = 0;
 
@@ -63,8 +63,6 @@ export class NotificationService {
         closeObserver: {
           next: (closeEvent) => {
             const timeout = this.getTimeout(this.timeOutIteration);
-            console.log("Websocket closed", closeEvent);
-            console.log("Trying to reconnect in " + timeout + " ms");
             timer(timeout).subscribe(() => { this.timeOutIteration++; this.initWsNotifications(); })
           }
         }
@@ -92,7 +90,7 @@ export class NotificationService {
   }
 
   private handleWebsocketNotificationMessage(msg: string) {
-    if (NotificationService.registedNotificationListeners.size == 0) return;
+    if (NotificationService.registeredNotificationListeners.size == 0) return;
     if (msg.includes("\n")) {
       msg.split("\n").forEach(element => this.handleWebsocketNotificationMessage(element));
       return;
@@ -101,9 +99,9 @@ export class NotificationService {
 
     const msgParts = msg.split(":");
     const projectId = msgParts[0];
-    if (!NotificationService.registedNotificationListeners.has(projectId)) return;
+    if (!NotificationService.registeredNotificationListeners.has(projectId)) return;
 
-    NotificationService.registedNotificationListeners.get(projectId).forEach((params, key) => {
+    NotificationService.registeredNotificationListeners.get(projectId).forEach((params, key) => {
       if (!params.whitelist || params.whitelist.includes(msgParts[1])) {
         params.func.call(key, msgParts);
       }
@@ -113,17 +111,17 @@ export class NotificationService {
 
   public static subscribeToNotification(key: Object, params: NotificationSubscription) {
     if (!params.projectId) params.projectId = "GLOBAL";
-    if (!NotificationService.registedNotificationListeners.has(params.projectId)) {
-      NotificationService.registedNotificationListeners.set(params.projectId, new Map<Object, NotificationSubscription>());
+    if (!NotificationService.registeredNotificationListeners.has(params.projectId)) {
+      NotificationService.registeredNotificationListeners.set(params.projectId, new Map<Object, NotificationSubscription>());
     }
-    const innerMap = NotificationService.registedNotificationListeners.get(params.projectId);
+    const innerMap = NotificationService.registeredNotificationListeners.get(params.projectId);
     innerMap.set(key, params);
   }
 
   public static unsubscribeFromNotification(key: Object, projectId: string = null) {
     if (!projectId) projectId = "GLOBAL"
-    if (NotificationService.registedNotificationListeners.has(projectId)) {
-      NotificationService.registedNotificationListeners.get(projectId).delete(key);
+    if (NotificationService.registeredNotificationListeners.has(projectId)) {
+      NotificationService.registeredNotificationListeners.get(projectId).delete(key);
     }
   }
 

diff --git a/src/app/base/services/weak-source/weak-source-apollo.service.ts b/src/app/base/services/weak-source/weak-source-apollo.service.ts
@@ -155,6 +155,18 @@ export class WeakSourceApolloService {
       }
     });
   }
+  cancelZeroShotRun(projectId: string, informationSourceId: string, payloadId: string) {
+    return this.apollo.mutate({
+      mutation: mutations.CANCEL_ZERO_SHOT_RUN,
+      variables: {
+        projectId: projectId,
+        informationSourceId: informationSourceId,
+        payloadId: payloadId,
+      }
+    });
+  }
+
+
 
   getInformationSourcesOverviewData(projectId: string) {
     const query = this.apollo

diff --git a/src/app/base/services/weak-source/weak-source-mutations.ts b/src/app/base/services/weak-source/weak-source-mutations.ts
@@ -89,6 +89,13 @@ export const mutations = {
     }
   }
   
+  `,
+  CANCEL_ZERO_SHOT_RUN: gql`
+  mutation ($projectId: ID!, $informationSourceId: ID!, $payloadId: ID!) {
+    cancelZeroShotRun(projectId: $projectId, informationSourceId: $informationSourceId, payloadId: $payloadId) {
+      ok
+    }
+  }
   `,
 
   SET_ALL_INFORMATION_SOURCES: gql`

diff --git a/src/app/data/components/data-browser/data-browser.component.html b/src/app/data/components/data-browser/data-browser.component.html
@@ -282,10 +282,11 @@
                                                                 </div>
 
                                                                 <label
-                                                                    class="text-xs text-gray-500 cursor-pointer flex items-center"
+                                                                    class="text-xs text-gray-500 cursor-pointer flex items-center pb-2"
                                                                     *ngIf="groupItem.get('operator').value == 'BEGINS WITH' || groupItem.get('operator').value == 'ENDS WITH' || groupItem.get('operator').value == 'CONTAINS' || groupItem.get('operator').value == 'IN WC'">
                                                                     <input type="checkbox"
-                                                                        formControlName="caseSensitive" class="mr-1">
+                                                                        formControlName="caseSensitive"
+                                                                        class="mr-1 cursor-pointer">
                                                                     Case sensitive
                                                                 </label>
                                                             </div>
@@ -863,10 +864,10 @@
                 </ng-template>
                 <div class="flex items-center">
                     <button *ngIf="activeSlice || activeSearchParams.length > 0 || similarSearchHelper.recordsInDisplay"
-                        class="mr-1 inline-flex items-center px-2.5 py-1.5 border border-gray-200 shadow-sm text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 cursor-pointer"
+                        class="mr-1 inline-flex items-center px-2.5 py-2 border border-gray-300 shadow-sm text-xs font-semibold rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none cursor-pointer"
                         (click)="clearFilters()">
                         <svg xmlns="http://www.w3.org/2000/svg" class="mr-2 icon icon-tabler icon-tabler-filter-off"
-                            width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
+                            width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
                             fill="none" stroke-linecap="round" stroke-linejoin="round">
                             <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                             <line x1="3" y1="3" x2="21" y2="21"></line>
@@ -881,9 +882,9 @@
                 <div data-tip="Change the data browser configurations"
                     class="tooltip tooltip-left relative flex items-center">
                     <label for="config-modal"
-                        class=" opacity-100 cursor-pointer mr-1 inline-flex items-center px-2.5 py-1.5 border border-gray-200 shadow-sm text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 cursor-pointer">
+                        class="cursor-pointer mr-1 inline-flex items-center px-2.5 py-2 border border-gray-300 shadow-sm text-xs font-semibold rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none">
                         <svg xmlns="http://www.w3.org/2000/svg"
-                            class="mr-2 icon icon-tabler icon-tabler-adjustments inline-block" width="20" height="20"
+                            class="mr-2 icon icon-tabler icon-tabler-adjustments inline-block" width="16" height="16"
                             viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
                             stroke-linecap="round" stroke-linejoin="round">
                             <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>

diff --git a/src/app/data/components/data-browser/data-browser.component.ts b/src/app/data/components/data-browser/data-browser.component.ts
@@ -2044,13 +2044,18 @@ export class DataBrowserComponent implements OnInit, OnDestroy {
 
   selectValueDropdown(value: string, i: number, field: string, key: any) {
     const formControlsIdx = this.getSearchFormArray(key).controls[i];
-    const prevOperator = formControlsIdx.get('operator').value;
     formControlsIdx.get(field).setValue(value);
-    if (field == 'name' || prevOperator == SearchOperator.IN || prevOperator == "IN WC") {
+    if (field == 'name') {
+      const attributeType = getAttributeType(this.attributesSortOrder, value);
       this.saveDropdonwAttribute = value;
-      if (formControlsIdx.get("searchValue").value != "") {
+      if (attributeType == "BOOLEAN" && formControlsIdx.get("searchValue").value != "") {
         formControlsIdx.get("searchValue").setValue("");
         formControlsIdx.get("searchValueBetween").setValue("");
+      } else if (attributeType == 'INTEGER' || attributeType == 'FLOAT') {
+        if (isNaN(parseInt(formControlsIdx.get('searchValue').value))) {
+          formControlsIdx.get("searchValue").setValue("");
+          formControlsIdx.get("searchValueBetween").setValue("");
+        }
       }
     }
     this.searchOperatorDropdownArray = [];