release updates (#130)

* Change version number

* Prevent links on sidebar from opening in another tab

* Fixed link for gates in settings page opening in new tab

* Removes unnecessary config handler local storage logic

* Asume Export fix, adds delete for crowd & annotator race condition fix

* Added icon for hiding admin messages

* Switch color on text and subtext on users page

* Project redirection fix

* Tooltip for input attribute next to dropdown

* Scroll x on zero-shot removed

* Button see installed libraries now fully visible

* Added column for zero-shot on downloaded models page

* Added auto next record if selected

* Adds config check

* Added notification for zero-shot on heuristics page

* fixes tooltip on min confidence, zero shot run 10

---------

Co-authored-by: Lina <lina.lumburovska@kern.ai>
Co-authored-by: FelixKirschKern <felix.kirsch@kern.ai>

Author: 3 people

src/app/app.component.html

@@ -83,8 +83,8 @@
     [ngClass]="isOnLabelingPage ? 'bottom-8' : 'bottom-0'">
     <div *ngFor="let activeMessage of activeAdminMessages"
         class="pointer-events-auto items-center justify-between gap-x-6 py-2.5 mt-2 border px-6 sm:rounded-xl sm:py-3 sm:pr-3.5 sm:pl-4 max-width-message"
-        [ngClass]="[activeMessage.borderColor, activeMessage.backgroundColor]">
-        <p class="text-sm leading-6 flex items-center" [ngClass]="activeMessage.textColor">
+        [ngClass]="[activeMessage.borderColor, activeMessage.backgroundColor, activeMessage.visible ? 'flex': 'hidden']">
+        <p class="text-sm leading-6 flex flex-row items-center" [ngClass]="activeMessage.textColor">
             <svg *ngIf="activeMessage.level == AdminMessageLevel.INFO" xmlns="http://www.w3.org/2000/svg"
                 class="icon icon-tabler icon-tabler-info-square text-blue-700 inline-block" width="20" height="20"
                 viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
@@ -111,6 +111,15 @@
                 class="mx-2 inline h-0.5 w-0.5 fill-current" aria-hidden="true">
                 <circle cx="1" cy="1" r="1" />
             </svg>Scheduled for {{activeMessage.displayDate}}
+            <button type="button" class="-m-1.5 flex-none p-1.5" (click)="closeMessage(activeMessage.id)">
+                <svg xmlns="http://www.w3.org/2000/svg" [ngClass]="activeMessage.textColor"
+                    class="icon icon-tabler icon-tabler-x" width="20" height="20" viewBox="0 0 24 24" stroke-width="1.5"
+                    stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+                    <line x1="18" y1="6" x2="6" y2="18" />
+                    <line x1="6" y1="6" x2="18" y2="18" />
+                </svg>
+            </button>
         </p>
     </div>
 </div>

src/app/app.component.ts

@@ -77,6 +77,7 @@ export class AppComponent implements OnDestroy, OnInit, AfterViewInit {
         message.textColor = 'text-' + color + '-700';
         message.backgroundColor = 'bg-' + color + '-100';
         message.borderColor = 'border-' + color + '-400';
+        message.visible = true;
         return message;
       });
     }));
@@ -93,7 +94,7 @@ export class AppComponent implements OnDestroy, OnInit, AfterViewInit {
   initialRequests() {
     CommentDataManager.initManager(this.organizationService);
     RouteManager.initRouteManager(this.router, this.organizationService);
-    this.configService.isManaged().pipe(first()).subscribe((v) => ConfigManager.initConfigManager(this.http, this.configService, v));
+    this.configService.isManaged().pipe(first()).subscribe((v) => ConfigManager.initConfigManager(this.http, v));
     this.configService.isDemo().pipe(first()).subscribe((v) => ConfigManager.setIsDemo(v));
     this.configService.isAdmin().pipe(first()).subscribe((v) => ConfigManager.setIsAdmin(v));
     this.configService.getBlackWhiteDemo().pipe(first()).subscribe((v) => ConfigManager.setBlackWhiteListDemo(v));
@@ -207,4 +208,8 @@ export class AppComponent implements OnDestroy, OnInit, AfterViewInit {
   onNotificationClick(notification) {
     NotificationCenterComponent.outlineSelectedNotification(notification.id);
   }
+
+  closeMessage(id) {
+    this.activeAdminMessages.find((message) => message.id == id).visible = false;
+  }
 }

src/app/base/components/header/header.component.ts

@@ -1,7 +1,7 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
-import { Project } from 'aws-sdk/clients/codebuild';
 import { Subscription, timer } from 'rxjs';
+import { Project } from '../../entities/project';
 import { AuthApiService } from '../../services/auth-api.service';
 import { ConfigManager } from '../../services/config-service';
 import { createDefaultHeaderModals, HeaderModals } from './header-helper';

src/app/base/components/notification-center/notification-center.component.ts

@@ -144,10 +144,15 @@ export class NotificationCenterComponent implements OnInit, OnDestroy {
   }
 
   navigateToProjectPage(notification): void {
-    this.router.navigate(['projects', notification.projectId, notification.page]);
+    this.redirectTo('projects/' + notification.projectId + '/' + notification.page);
     this.linkClicked.emit(false);
   }
 
+  redirectTo(uri: string) {
+    this.router.navigateByUrl('/', { skipLocationChange: true }).then(() =>
+      this.router.navigate([uri]));
+  }
+
   switchExpandedState(notification) {
     if (this.expandedNotifications.has(notification.id)) {
       this.expandedNotifications.delete(notification.id)

src/app/base/components/sidebar-pm/sidebar-pm.component.html

@@ -225,7 +225,7 @@
                     <label data-tip="Version overview"
                         (click)="requestVersionOverview(); sideBarPmModals.versionOverview.open = true;"
                         class="z-50 tooltip tooltip-right cursor-pointer select-none text-white flex items-center"
-                        id="refineryVersion">v1.8.0
+                        id="refineryVersion">v1.9.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"
@@ -243,20 +243,19 @@
     </div>
     <div class="fixed left-20 font-dmMono rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 py-2"
         style="bottom:60px;z-index:100" id="KernNav" [ngClass]="navHidden?'hidden':null">
-        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" target="_blank" href="/welcome" rel="noopener noreferrer">
+        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" href="/welcome">
             <div class="flex flex-row flex-nowrap">
                 <img class="h-6 w-6 tooltip tooltip-right" data-tip="Kern AI" src="assets/platform/kern-icon.png">
                 <span class="ml-2">cockpit</span>
             </div>
         </a>
-        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" target="_blank" href="/gates" rel="noopener noreferrer">
+        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" href="/gates">
             <div class="flex flex-row flex-nowrap">
                 <img class="h-6 w-6 tooltip tooltip-right" data-tip="Kern AI" src="assets/platform/gates-icon.png">
                 <span class="ml-2">gates</span>
             </div>
         </a>
-        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" target="_blank" href="/workflow/workflows"
-            rel="noopener noreferrer">
+        <a class="flex flex-col px-4 py-2 hover:bg-gray-100" href="/workflow/workflows">
             <div class="flex flex-row flex-nowrap">
                 <img class="h-6 w-6 tooltip tooltip-right" data-tip="Kern AI" src="assets/platform/workflow-icon.png">
                 <span class="ml-2">workflow</span>

src/app/base/services/config-service.ts

@@ -8,59 +8,26 @@ export class ConfigManager {
 
     private static config = null;
     private static http: HttpClient;
-    private static configApolloService: ConfigApolloService;
-    private static isManaged: boolean = true;//differentation between propriatary or not
+    private static isManaged: boolean = true;
     private static isAdmin: boolean = false;
     private static isDemo: boolean = false;
     private static blackWhiteListDemo: any;
     private static registeredUpdateListeners: Map<Object, () => void> = new Map<Object, () => void>();
-    private static justUpdated = false;
 
     //needs to be called once from app (because of the http injection)
-    public static initConfigManager(httpClient: HttpClient, configApolloService: ConfigApolloService, isManaged: boolean) {
+    public static initConfigManager(httpClient: HttpClient, isManaged: boolean) {
         ConfigManager.isManaged = isManaged;
         ConfigManager.http = httpClient;
-        ConfigManager.configApolloService = configApolloService;
         ConfigManager.refreshConfig();
     }
 
     public static refreshConfig() {
         ConfigManager.http.get('/config/base_config').pipe(first()).subscribe((c: string) => {
             ConfigManager.config = jsonCopy(c);
-            ConfigManager.checkAndUpdateLocalStorage(c);
             ConfigManager.registeredUpdateListeners.forEach((func, key) => func.call(key));
         });
     }
 
-    private static checkAndUpdateLocalStorage(currentConfig: string) {
-        //only open source / local can update these values
-        if (ConfigManager.isManaged) return;
-        let parsed = currentConfig;
-        delete parsed["KERN_S3_ENDPOINT"]
-        currentConfig = JSON.stringify(parsed)
-        let localStorageConfig = localStorage.getItem("base_config");
-        if (localStorageConfig) {
-            parsed = JSON.parse(localStorageConfig);
-            delete parsed["KERN_S3_ENDPOINT"]
-            localStorageConfig = JSON.stringify(parsed)
-        }
-        let newConfig = true;
-        if (localStorageConfig && localStorageConfig != currentConfig && !ConfigManager.justUpdated) {
-            const update = window.confirm("Your local storage has a different set of config values.\nThis can happen if the config service was reinitialized\n\nDo you want to update to the previous version?\n\nNew keys won't be affected.");
-            if (update) {
-                ConfigManager.configApolloService.updateConfig(localStorageConfig).pipe(first()).subscribe(o => {
-                    if (!o?.data?.updateConfig) window.alert('something went wrong with the update');
-                    else ConfigManager.justUpdated = true;
-                });
-                newConfig = false;
-            }
-        }
-        if (newConfig) {
-            localStorage.setItem('base_config', currentConfig);
-            ConfigManager.justUpdated = false;
-        }
-    }
-
     public static getConfigValue(key: string, subkey: string = null): string | any {
         if (!ConfigManager.config) ConfigManager.refreshConfig();
         const value = ConfigManager.config[key];

src/app/config/components/config.component.html

@@ -14,39 +14,40 @@ <h3 class="text-lg leading-6 font-medium text-gray-900">Configuration</h3>
                 style="grid-template-columns: max-content min-content;">
 
                 <div class="text-sm">
-                    <label for="candidates" class="font-medium text-gray-700">Allow data tracking</label>
+                    <label class="font-medium text-gray-700">Allow data tracking</label>
                     <p class="text-gray-500">We collect few usage statistics to improve the user experience and product.
                     </p>
                 </div>
-                <input #allowTracking class="h-5 w-5" type="checkbox" [checked]='localConfigCopy.allowDataTracking'
+                <input #allowTracking class="h-5 w-5 cursor-pointer" type="checkbox"
+                    [checked]='localConfigCopy.allowDataTracking'
                     (click)="checkAndSaveValue(allowTracking.checked,'allow_data_tracking')">
                 <div class="text-sm">
-                    <label for="candidates" class="font-medium text-gray-700">Max rows</label>
+                    <label class="font-medium text-gray-700">Max rows</label>
                     <p class="text-gray-500">Maximum number of records per project.</p>
                 </div>
                 <input #maxRows tabindex="0" type="number"
                     class="bg-white text-gray-700 text-xs font-semibold mr-3 px-4 py-2 rounded-md border border-gray-300 w-20 input input-sm"
-                    [value]="organization.maxRows" (focus)="$event.target.select()"
+                    [value]="organization? organization.maxRows:-1" (focus)="$event.target.select()"
                     (keydown.enter)="checkAndSaveValue(maxRows.value,'limit_checks','max_rows')"
                     (blur)="checkAndSaveValue(maxRows.value,'limit_checks','max_rows')">
 
                 <div class="text-sm">
-                    <label for="candidates" class="font-medium text-gray-700">Max attributes</label>
+                    <label class="font-medium text-gray-700">Max attributes</label>
                     <p class="text-gray-500">Maximum number of attributes per project.</p>
                 </div>
                 <input #maxCols tabindex="0" type="number"
                     class="bg-white text-gray-700 text-xs font-semibold mr-3 px-4 py-2 rounded-md border border-gray-300 w-20 input input-sm"
-                    [value]="organization.maxCols" (focus)="$event.target.select()"
+                    [value]="organization?organization.maxCols:-1" (focus)="$event.target.select()"
                     (keydown.enter)="checkAndSaveValue(maxRows.value,'limit_checks','max_cols')"
                     (blur)="checkAndSaveValue(maxCols.value,'limit_checks','max_cols')">
 
                 <div class="text-sm">
-                    <label for="candidates" class="font-medium text-gray-700">Max characters</label>
+                    <label class="font-medium text-gray-700">Max characters</label>
                     <p class="text-gray-500">Maximum number of characters per record.</p>
                 </div>
                 <input #maxChar tabindex="0" type="number"
                     class="bg-white text-gray-700 text-xs font-semibold mr-3 px-4 py-2 rounded-md border border-gray-300 w-20 input input-sm"
-                    [value]="organization.maxCharCount" (focus)="$event.target.select()"
+                    [value]="organization?organization.maxCharCount:-1" (focus)="$event.target.select()"
                     (keydown.enter)="checkAndSaveValue(maxRows.value,'limit_checks','max_char_count')"
                     (blur)="checkAndSaveValue(maxChar.value,'limit_checks','max_char_count')">
                 <div class="h-full text-sm">

src/app/config/components/config.component.ts

@@ -8,7 +8,7 @@ import { first } from 'rxjs/operators';
 import { OrganizationApolloService } from 'src/app/base/services/organization/organization-apollo.service';
 import { ProjectApolloService } from 'src/app/base/services/project/project-apollo.service';
 import { UserManager } from 'src/app/util/user-manager';
-import { getUserAvatarUri } from 'src/app/util/helper-functions';
+import { getUserAvatarUri, snakeCaseToCamelCase } from 'src/app/util/helper-functions';
 
 @Component({
   selector: 'kern-config',
@@ -75,7 +75,9 @@ export class ConfigComponent implements OnInit, OnDestroy {
     }
   }
   checkAndSaveValue(value: any, key: string, subkey: string = null) {
-    if (ConfigManager.getConfigValue(key, subkey) == value) return;
+    if (key == "limit_checks") {
+      if(Number(value) == this.organization[snakeCaseToCamelCase(subkey)]) return;
+    } else if (ConfigManager.getConfigValue(key, subkey) == value) return;
 
     const updateDict: any = {};
     if (subkey) {

src/app/labeling-suite/helper/manager/task.ts

@@ -1,3 +1,4 @@
+import { timer } from "rxjs";
 import { first } from "rxjs/operators";
 import { UserRole } from "src/app/base/enum/graphql-enums";
 import { NotificationService } from "src/app/base/services/notification.service";
@@ -52,12 +53,22 @@ export class LabelingSuiteTaskManager implements DoBeforeDestroy {
     private fetchLabelingTasks() {
         let q, vc;
         [q, vc] = this.projectApolloService.getLabelingTasksByProjectId(this.projectId);
-        vc.pipe(first()).subscribe(lt => {
-            this.labelingTasks = this.prepareTasksForRole(jsonCopy(lt));
-            this.filterTasksForAttributeVisibility(false);
-            this.rebuildLabelButtonAmount();
-            this.baseManager.runUpdateListeners(UpdateType.LABELING_TASKS);
-        });
+        vc.pipe(first()).subscribe(lt => this.prepareTaskData(jsonCopy(lt)));
+    }
+
+    private prepareTaskData(taskData: any[], i = 0) {
+        this.labelingTasks = this.prepareTasksForRole(taskData);
+        if (this.labelingTasks == null) {
+            if (i > 50) {
+                console.log("error: could not load labeling tasks");
+                return;
+            }
+            timer(100).subscribe(() => this.prepareTaskData(taskData, ++i));
+            return;
+        }
+        this.filterTasksForAttributeVisibility(false);
+        this.rebuildLabelButtonAmount();
+        this.baseManager.runUpdateListeners(UpdateType.LABELING_TASKS);
     }
 
     public filterTasksForAttributeVisibility(runListener: boolean = true) {
@@ -84,7 +95,7 @@ export class LabelingSuiteTaskManager implements DoBeforeDestroy {
         if (this.baseManager.userManager.currentRole != UserRole.ANNOTATOR) return taskData;
 
         const taskId = this.baseManager.sessionManager.getAllowedTaskId();
-        if (!taskId) return [];
+        if (!taskId) return null;
         else return taskData.filter(t => t.id == taskId);
     }
 

src/app/labeling-suite/sub-components/labeling/labeling.component.html

@@ -124,7 +124,8 @@
                         <!-- Classification labels -->
                         <ng-template [ngIf]="task.task.taskType == 'MULTICLASS_CLASSIFICATION'">
                             <!--show label buttons-->
-                            <ng-template [ngIf]="canEditLabels || lsm.userManager.currentRole == 'ANNOTATOR'">
+                            <ng-template
+                                [ngIf]="canEditLabels || lsm.userManager.currentRole == 'ANNOTATOR' || lsm.userManager.currentRole == 'EXPERT'">
                                 <div class="flex flex-row flex-wrap gap-2">
                                     <div #labelDiv *ngFor="let label of task.task.displayLabels; let i = index"
                                         class="text-sm font-medium px-2 py-0.5 rounded-md border focus:outline-none cursor-pointer"

src/app/labeling-suite/sub-components/labeling/labeling.component.ts

@@ -563,6 +563,9 @@ export class LabelingSuiteLabelingComponent implements OnInit, OnChanges, OnDest
     if (existingLabels.length == 1) return;
     const sourceId = this.lsm.sessionManager.getSourceId();
     this.lsm.recordManager.addClassificationLabelToRecord(labelingTaskId, labelId, sourceId);
+    if (this.lsm.settingManager.settings.main.autoNextRecord) {
+      this.lsm.nextRecord();
+    }
   }
 
   public deleteRecordLabelAssociation(rlaLabel: any) {