Release v1.2.0

src/app/app-routing.module.ts

@@ -16,6 +16,7 @@ import { ProjectNewComponent } from './projects/components/project-new/project-n
 import { ProjectAddComponent } from './projects/components/project-add/project-add.component';
 import { RecordIDEComponent } from './record-ide/components/record-ide.component';
 import { ConfigComponent } from './config/components/config.component';
+import { ModelDownloadComponent } from './model-download/pages/model-download/model-download.component';
 
 const routes: Routes = [
   {
@@ -27,6 +28,7 @@ const routes: Routes = [
   { path: 'notification-center', component: NotificationCenterComponent, data: { name: 'NotificationCenterComponent' } },
   { path: 'projects/new', component: ProjectNewComponent, data: { name: 'ProjectNewComponent' } },
   { path: 'config', component: ConfigComponent, data: { name: 'ConfigComponent' } },
+
   {
     path: 'projects/:projectId',
     component: ProjectComponent,
@@ -54,6 +56,7 @@ const routes: Routes = [
         path: 'knowledge-base/:knowledgeBaseId',
         component: KnowledgeBaseDetailsComponent, data: { name: 'KnowledgeBaseDetailsComponent' }
       },
+      { path: 'model-download', component: ModelDownloadComponent, data: { name: 'ModelDownloadComponent' } },
       { path: '**', component: ProjectOverviewComponent, data: { name: 'ProjectOverviewComponent' } },
       //TODO: redirecting to projects overview page and errors
     ],

src/app/app.module.ts

@@ -22,6 +22,7 @@ import { ConfigModule } from './config/config.module'
 import { IntercomModule } from 'ng-intercom';
 import { NotificationCenterModule } from './notification-center/notification-center.module';
 import { RecordIDEModule } from './record-ide/record-ide.module';
+import { ModelDownloadModule } from './model-download/model-download.module';
 
 @NgModule({
   declarations: [AppComponent],
@@ -40,6 +41,7 @@ import { RecordIDEModule } from './record-ide/record-ide.module';
     ZeroShotModule,
     LabelingModule,
     RecordIDEModule,
+    ModelDownloadModule,
     NotificationCenterModule,
     MonacoEditorModule.forRoot(),
     KnowledgeBasesModule,

src/app/base/components/dropdown/dropdown-helper.ts

@@ -23,6 +23,7 @@ import { FormArray } from "@angular/forms";
  * @textHoverColor {string, optional} - text color on hover for the dropdown options
  * @textSize {string, optional} - text size for the dropdown options
  * @isButtonSampleProjects {boolean, optional} - checks if the button is the specific one for sample project
+ * @isModelDownloaded {boolean[], optional} - checks if the model is downloaded and if so the color of the text is green
  */
 export type DropdownOptions = {
     optionArray: string[] | FormArray[] | any[];
@@ -46,5 +47,6 @@ export type DropdownOptions = {
     textHoverColor?: string;
     textSize?: string;
     isButtonSampleProjects?: boolean;
+    isModelDownloaded: boolean[];
 };
 

src/app/base/components/dropdown/dropdown.component.html

@@ -1,5 +1,6 @@
 <div class="relative" [ngClass]="dropdownOptions.buttonVersion == 'default' ? ' w-max' : '' ">
-    <button #dropdownOpenButton type="button" [attr.data-tip]="dropdownOptions.buttonTooltip" *ngIf="dropdownOptions.buttonVersion == 'default'"
+    <button #dropdownOpenButton type="button" [attr.data-tip]="dropdownOptions.buttonTooltip"
+        *ngIf="dropdownOptions.buttonVersion == 'default'"
         class="inline-flex rounded-md border shadow-sm px-4 items-center text-xs font-semibold cursor-pointer focus:ring-offset-2 focus:ring-offset-gray-400"
         id="menu-button" aria-expanded="true" aria-haspopup="true" [disabled]="dropdownOptions.isDisabled"
         [ngClass]="buttonClassList" (isMenuOpen)="toggleVisible($event, dropdownOptionsDiv)" appDropdown>
@@ -18,29 +19,28 @@
         </svg>
     </button>
 
-    <svg *ngIf="dropdownOptions.buttonVersion== '...'" (isMenuOpen)="toggleVisible($event, dropdownOptionsDiv)" appDropdown
-        xmlns="http://www.w3.org/2000/svg"
-        class="h-5 w-5 float-right cursor-pointer text-gray-500" viewBox="0 0 20 20"
-        fill="currentColor">
-        <path
-            d="M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z" />
+    <svg *ngIf="dropdownOptions.buttonVersion== '...'" (isMenuOpen)="toggleVisible($event, dropdownOptionsDiv)"
+        appDropdown xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 float-right cursor-pointer text-gray-500"
+        viewBox="0 0 20 20" fill="currentColor">
+        <path d="M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z" />
     </svg>
     <a *ngIf="dropdownOptions.buttonVersion== 'userIcon'" tabindex="0" class="w-full cursor-pointer">
-        <div data-intercom-target="User Avatar Button" (isMenuOpen)="toggleVisible($event, dropdownOptionsDiv)" appDropdown>
+        <div data-intercom-target="User Avatar Button" (isMenuOpen)="toggleVisible($event, dropdownOptionsDiv)"
+            appDropdown>
             <img class="h-8 w-8" [src]="dropdownOptions.avatarUri">
         </div>
     </a>
 
     <div #dropdownOptionsDiv
         class="origin-top-right absolute mt-2 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none hidden"
-        [ngClass]="[dropdownClassList, dropdownOptions.isButtonSampleProjects ? 'width-sample-projects' : '', dropdownOptions.buttonVersion != '...' ? 'min-w-full': '']" 
+        [ngClass]="[dropdownClassList, dropdownOptions.isButtonSampleProjects ? 'width-sample-projects' : '', dropdownOptions.buttonVersion != '...' ? 'min-w-full': '']"
         role="menu" aria-orientation="vertical" aria-labelledby="menu-button" tabindex="-1">
         <div class="py-1 cursor-pointer" role="none">
             <div *ngFor="let caption of dropdownOptionCaptions;let i = index" (click)="performActionOnOption($event,i)"
-                [ngClass]="[dropdownOptions.textSize,dropdownOptions.textColor,dropdownOptions.optionDescriptions ? '' : 'flex' ,dropdownOptions.isOptionDisabled?.length && dropdownOptions.isOptionDisabled[i]?'opacity-50 cursor-not-allowed':'',!dropdownOptions.hasCheckboxes ? dropdownOptions.hoverColor + ' ' +dropdownOptions.textHoverColor:'']"
+                [ngClass]="[dropdownOptions.textSize,dropdownOptions.textColor,dropdownOptions.optionDescriptions ? '' : 'flex' ,dropdownOptions.isOptionDisabled?.length && dropdownOptions.isOptionDisabled[i]?'opacity-50 cursor-not-allowed':'',!dropdownOptions.hasCheckboxes ? dropdownOptions.hoverColor + ' ' +dropdownOptions.textHoverColor:'', dropdownOptions.isModelDownloaded?.length && dropdownOptions.isModelDownloaded[i] ? 'text-green-700 hover:text-lime-300': '']"
                 [ngStyle]="{'border-bottom': dropdownOptions.isButtonSampleProjects && i%2 == 0 && i!=dropdownOptionCaptions.length-1 ? '1px dashed #e2e8f0' : (dropdownOptions.isButtonSampleProjects && i%2 != 0 && i!=dropdownOptionCaptions.length-1 ? '1px solid #e2e8f0' : null) }"
-                class="block px-2 py-1.5 flex-row flex-nowrap items-center gap-x-2 w-max min-w-full"
-                role="menuitem" tabindex="-1" id="menu-item-0">
+                class="block px-2 py-1.5 flex-row flex-nowrap items-center gap-x-2 w-max min-w-full" role="menuitem"
+                tabindex="-1" id="menu-item-0">
                 <ng-template [ngIf]="dropdownOptions.hasCheckboxes">
                     <div class="h-4 w-4 border-gray-300 border rounded hover:bg-gray-200"
                         [ngStyle]="{'background-color':getActiveNegateGroupColor(dropdownOptions.optionArray[i]), 'border-color':getActiveNegateGroupColor(dropdownOptions.optionArray[i])}">
@@ -53,7 +53,8 @@
                 </ng-template>
                 {{ caption }}
 
-                <p *ngIf="dropdownOptions.optionDescriptions && dropdownOptions.optionDescriptions[i] != ''" class="mt-2">
+                <p *ngIf="dropdownOptions.optionDescriptions && dropdownOptions.optionDescriptions[i] != ''"
+                    class="mt-2">
                     {{dropdownOptions.optionDescriptions[i]}}
                 </p>
             </div>
@@ -67,8 +68,8 @@
         <ng-template ngSwitchDefault>
         </ng-template>
         <ng-template ngSwitchCase="clickbait">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-fish-hook inline-block" width="20"
-                height="20" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-fish-hook inline-block"
+                width="20" height="20" 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>
                 <path d="M16 9v6a5 5 0 0 1 -10 0v-4l3 3"></path>
@@ -77,8 +78,8 @@
             </svg>
         </ng-template>
         <ng-template ngSwitchCase="conversational-ai">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message-circle inline-block" width="20"
-                height="20" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message-circle inline-block"
+                width="20" height="20" 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>
                 <path d="M3 20l1.3 -3.9a9 8 0 1 1 3.4 2.9l-4.7 1"></path>
@@ -88,9 +89,9 @@
             </svg>
         </ng-template>
         <ng-template ngSwitchCase="ag-news">
-            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-news inline-block" width="20" height="20"
-                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
-                stroke-linejoin="round">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-news inline-block" width="20"
+                height="20" 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>
                 <path
                     d="M16 6h3a1 1 0 0 1 1 1v11a2 2 0 0 1 -4 0v-13a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1v12a3 3 0 0 0 3 3h11">
@@ -159,33 +160,33 @@
             </svg>
         </ng-template>
         <ng-template ngSwitchCase="delete-selected">
-            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block" fill="none"
-                viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block" fill="none" viewBox="0 0 24 24"
+                stroke="currentColor" stroke-width="2">
                 <path stroke-linecap="round" stroke-linejoin="round"
                     d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
             </svg>
         </ng-template>
         <ng-template ngSwitchCase="labeling-function">
-            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block"
-                viewBox="0 0 20 20" fill="currentColor">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block" viewBox="0 0 20 20"
+                fill="currentColor">
                 <path fill-rule="evenodd"
                     d="M12.316 3.051a1 1 0 01.633 1.265l-4 12a1 1 0 11-1.898-.632l4-12a1 1 0 011.265-.633zM5.707 6.293a1 1 0 010 1.414L3.414 10l2.293 2.293a1 1 0 11-1.414 1.414l-3-3a1 1 0 010-1.414l3-3a1 1 0 011.414 0zm8.586 0a1 1 0 011.414 0l3 3a1 1 0 010 1.414l-3 3a1 1 0 11-1.414-1.414L16.586 10l-2.293-2.293a1 1 0 010-1.414z"
                     clip-rule="evenodd" />
             </svg>
         </ng-template>
 
         <ng-template ngSwitchCase="active-learning">
-            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block"
-                viewBox="0 0 20 20" fill="currentColor">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block" viewBox="0 0 20 20"
+                fill="currentColor">
                 <path fill-rule="evenodd"
                     d="M11.3 1.046A1 1 0 0112 2v5h4a1 1 0 01.82 1.573l-7 10A1 1 0 018 18v-5H4a1 1 0 01-.82-1.573l7-10a1 1 0 011.12-.38z"
                     clip-rule="evenodd" />
             </svg>
         </ng-template>
 
         <ng-template ngSwitchCase="zero-shot">
-            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block"
-                viewBox="0 0 20 20" fill="currentColor">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block" viewBox="0 0 20 20"
+                fill="currentColor">
                 <path fill-rule="evenodd"
                     d="M5 2a1 1 0 011 1v1h1a1 1 0 010 2H6v1a1 1 0 01-2 0V6H3a1 1 0 010-2h1V3a1 1 0 011-1zm0 10a1 1 0 011 1v1h1a1 1 0 110 2H6v1a1 1 0 11-2 0v-1H3a1 1 0 110-2h1v-1a1 1 0 011-1zM12 2a1 1 0 01.967.744L14.146 7.2 17.5 9.134a1 1 0 010 1.732l-3.354 1.935-1.18 4.455a1 1 0 01-1.933 0L9.854 12.8 6.5 10.866a1 1 0 010-1.732l3.354-1.935 1.18-4.455A1 1 0 0112 2z"
                     clip-rule="evenodd" />

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

@@ -79,6 +79,7 @@ export class DropdownComponent implements OnChanges {
     if (this.dropdownOptions.optionDescriptions && this.dropdownOptions.optionArray.length != this.dropdownOptions.optionDescriptions.length) this.hasInputErrors = "array options != optionDescriptions length\n";
     if (this.dropdownOptions.optionIcons && this.dropdownOptions.optionIcons.length != this.dropdownOptions.optionIcons.length) this.hasInputErrors = "array options != optionIcons length\n";
     if (!this.dropdownOptions.buttonVersion) this.dropdownOptions.buttonVersion = "default";
+    if (this.dropdownOptions.isModelDownloaded && this.dropdownOptions.isModelDownloaded.length != this.dropdownOptions.optionArray.length) this.hasInputErrors = "array options != isModelDownloaded length\n";
 
     this.buttonClassList = "";
     if (!this.dropdownOptions.buttonBgColor) this.dropdownOptions.buttonBgColor = "bg-white ";

src/app/base/services/base/apollo-checker.ts

@@ -29,8 +29,8 @@ export class ApolloChecker {
     }
 
     private static checkBlackWhiteList(type: string, queryText: string) {
-        if (!ConfigManager.getIsDemo()) return;
-        if (ConfigManager.getIsAdmin()) return;
+        if (!ConfigManager.getIsDemo(true)) return;
+        if (ConfigManager.getIsAdmin(true)) return;
         if (!queryText) throw new Error("Can't find query text");
         if (!ConfigManager.checkBlackWhiteList(type, queryText)) throw new DemoError(type, queryText);
     }

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

@@ -68,7 +68,8 @@ export class ConfigManager {
         return ConfigManager.config[key][subkey]
     }
 
-    public static getIsManaged(): boolean {
+    public static getIsManaged(ignoreCheck: boolean = false): boolean {
+        if (!ignoreCheck && !ConfigManager.isInit()) console.log("ConfigManager not initialized");
         return ConfigManager.isManaged;
     }
 
@@ -86,14 +87,16 @@ export class ConfigManager {
     public static setIsAdmin(value: boolean) {
         ConfigManager.isAdmin = value;
     }
-    public static getIsAdmin() {
+    public static getIsAdmin(ignoreCheck: boolean = false): boolean {
+        if (!ignoreCheck && !ConfigManager.isInit()) console.log("ConfigManager not initialized");
         return ConfigManager.isAdmin;
     }
 
     public static setIsDemo(value: boolean) {
         ConfigManager.isDemo = value;
     }
-    public static getIsDemo() {
+    public static getIsDemo(ignoreCheck: boolean = false): boolean {
+        if (!ignoreCheck && !ConfigManager.isInit()) console.log("ConfigManager not initialized");
         return ConfigManager.isDemo;
     }
 

src/app/base/services/weak-source/weak-source-apollo.service.ts

@@ -428,4 +428,40 @@ export class WeakSourceApolloService {
     });
   }
 
+  getModelProviderInfo() {
+    const query = this.apollo
+      .watchQuery({
+        query: queries.GET_MODEL_PROVIDER_INFO,
+        fetchPolicy: 'network-only', // Used for first execution
+        nextFetchPolicy: 'cache-first', // Used for subsequent executions (refetch query updates the cache != triggers the function)
+      });
+    const vc = query.valueChanges.pipe(
+      map((result) => result['data']['modelProviderInfo'])
+    );
+    return [query, vc]
+  }
+
+  downloadModel(name: string) {
+    return this.apollo.mutate({
+      mutation: mutations.MODEL_PROVIDER_DOWNLOAD_MODEL,
+      variables: {
+        modelName: name
+      }
+    });
+  }
+
+  deleteModel(name: string) {
+    return this.apollo.mutate({
+      mutation: mutations.MODEL_PROVIDER_DELETE_MODEL,
+      variables: {
+        modelName: name
+      },
+      refetchQueries: [
+        {
+          query: queries.GET_MODEL_PROVIDER_INFO
+        },
+      ],
+    });
+  }
+
 }

src/app/base/services/weak-source/weak-source-mutations.ts

@@ -98,5 +98,21 @@ export const mutations = {
     }
   }
 
-  `
+  `,
+
+  MODEL_PROVIDER_DELETE_MODEL: gql`
+    mutation($modelName: String!) {
+      modelProviderDeleteModel(modelName: $modelName) {
+        ok
+      }
+    }
+`,
+
+  MODEL_PROVIDER_DOWNLOAD_MODEL: gql`
+  mutation($modelName: String!) {
+    modelProviderDownloadModel(modelName: $modelName) {
+      ok
+    }
+}
+`,
 };

src/app/base/services/weak-source/weak-source-queries.ts

@@ -98,4 +98,17 @@ export const queries = {
   }
   `,
 
+  GET_MODEL_PROVIDER_INFO: gql`
+  query{
+    modelProviderInfo {
+      name
+      revision
+      link
+      date
+      size
+      status
+      zeroShotPipeline
+    }
+  }
+  `,
 };