Ticket #38 : Support Kubernetes function

Author: habarthierry-hue

src/FaasNet.Gateway.Core/Exceptions/FunctionAlreadyPublishedException.cs

@@ -0,0 +1,16 @@
+using System;
+
+namespace FaasNet.Gateway.Core.Exceptions
+{
+    public class FunctionAlreadyPublishedException : Exception
+    {
+        public FunctionAlreadyPublishedException(string code, string message, string functionId) : base(message)
+        {
+            Code = code;
+            FunctionId = functionId;
+        }
+
+        public string Code { get; set; }
+        public string FunctionId { get; set; }
+    }
+}

src/FaasNet.Gateway.Core/Functions/Commands/Handlers/PublishFunctionCommandHandler.cs

@@ -24,9 +24,10 @@ public PublishFunctionCommandHandler(IFunctionRepository functionRepository, IFu
         public async Task<string> Handle(PublishFunctionCommand command, CancellationToken cancellationToken)
         {
             var function = FunctionAggregate.Create(command.Name, command.Description, command.Image, command.Version, command.Command);
-            if (_functionRepository.Query().FirstOrDefault(f => f.Id == function.Id) != null)
+            var existingFunction = _functionRepository.Query().FirstOrDefault(f => f.Image == function.Image && f.Version == function.Version);
+            if (existingFunction != null)
             {
-                throw new BadRequestException(ErrorCodes.FunctionExists, string.Format(Global.FunctionExists, function.Id));
+                throw new FunctionAlreadyPublishedException(ErrorCodes.FunctionExists, string.Format(Global.FunctionExists, $"{function.Image}:{function.Version}"), existingFunction.Id);
             }
 
             await _functionInvoker.Publish(function.Id, function.Image, function.Version, function.Command, cancellationToken);

src/FaasNet.Gateway.Core/StateMachines/Commands/Handlers/UpdateStateMachineCommandHandler.cs

@@ -40,8 +40,15 @@ public async Task<AddStateMachineResult> Handle(UpdateStateMachineCommand reques
                 {
                     var image = customFunction.Metadata.SelectToken("image").ToString();
                     var version = customFunction.Metadata.SelectToken("version").ToString();
-                    var id = await _functionService.Publish(customFunction.Name, image, version, cancellationToken);
-                    customFunction.FunctionId = id;
+                    try
+                    {
+                        var id = await _functionService.Publish(customFunction.Name, image, version, cancellationToken);
+                        customFunction.FunctionId = id;
+                    }
+                    catch (FunctionAlreadyPublishedException ex)
+                    {
+                        customFunction.FunctionId = ex.FunctionId;
+                    }
                 }
 
                 workflowDefinition.IsLast = false;

src/FaasNet.Gateway.SqlServer.Startup/ServerlessWorkflows/TransformJson.yml

@@ -9,7 +9,7 @@ states:
   actions:
   - name: transformJson
     functionRef:
-      referenceName: transform
+      refName: transform
   end: true
   id: 9c8eeb08-3826-4a26-b11f-1e57a9dd6f97
   type: operation
@@ -18,8 +18,8 @@ functions:
 - name: transform
   type: custom
   metadata:
-    provider: kubernetes
     image: localhost:5000/faastransform
+    version: latest
     configuration:
      mappings:
      - input: firstName

src/FaasNet.Website/src/components/statediagram/components/functionseditor/functionseditor.component.html

@@ -4,25 +4,58 @@ <h1 mat-dialog-title>Functions Editor</h1>
     <div fxFlex="50%" class="firstColumn column">
       <form [formGroup]="editFunctionFormGroup" (ngSubmit)="addFunction()">
         <!-- Name -->
-        <mat-form-field class="full-width" appearance="outline">
-          <mat-label>{{ 'functions.name' | translate }}</mat-label>
-          <input type="text" matInput formControlName="name" />
-          <mat-error *ngIf="editFunctionFormGroup.get('name')?.errors?.required">{{ 'functions.nameRequired' | translate }}</mat-error>
-        </mat-form-field>
+        <div class="form-control">
+          <div class="title">Name</div>
+          <p class="description">Name of the function</p>
+          <input type="text" formControlName="name" class="full-width" />
+          <mat-error *ngIf="editFunctionFormGroup.get('name')?.errors?.required">Name is required</mat-error>
+        </div>
+        <mat-divider></mat-divider>
         <!-- Type -->
-        <mat-form-field class="full-width" appearance="outline">
-          <mat-label>{{ 'functions.type' | translate }}</mat-label>
-          <mat-select formControlName="type">
-            <mat-option value="rest">RESTful service invocation</mat-option>
-          </mat-select>
+        <div class="form-control">
+          <div class="title">Type</div>
+          <p class="description">Select the type of function</p>
+          <select formControlName="type" class="full-width">
+            <option value="rest">RESTful service invocation</option>
+            <option value="kubernetes">Serverless function invocation</option>
+          </select>
           <mat-error *ngIf="editFunctionFormGroup.get('type')?.errors?.required">{{ 'functions.typeRequired' | translate }}</mat-error>
-        </mat-form-field>
-        <!-- Operation -->
-        <mat-form-field class="full-width" appearance="outline" *ngIf="editFunctionFormGroup.get('type')?.value">
-          <mat-label>{{ getOperationTranslationKey() | translate }}</mat-label>
-          <input type="text" matInput formControlName="operation" />
-        </mat-form-field>
-        <button mat-raised-button color="primary" [disabled]="!editFunctionFormGroup.valid">Add</button>
+        </div>
+        <div *ngIf="editFunctionFormGroup.get('type')?.value == 'rest'">
+          <mat-divider></mat-divider>
+          <!-- Operation -->
+          <div class="form-control">
+            <div class="title">Operation</div>
+            <p class="description">{{ getOperationTranslationKey() }}</p>
+            <input type="text" formControlName="operation" class="full-width" />
+          </div>
+        </div>
+        <div *ngIf="editFunctionFormGroup.get('type')?.value == 'kubernetes'" [formGroup]="editKubernetesFormGroup">
+          <mat-divider></mat-divider>
+          <!-- Image -->
+          <div class="form-control">
+            <div class="title">Image</div>
+            <p class="description">Docker image</p>
+            <input type="text" formControlName="image" class="full-width" />
+            <mat-error *ngIf="editKubernetesFormGroup.get('image')?.errors?.required">Image is required</mat-error>
+          </div>
+          <!-- Version -->
+          <div class="form-control">
+            <div class="title">Version</div>
+            <p class="description">Docker version</p>
+            <input type="text" formControlName="version" class="full-width" />
+            <mat-error *ngIf="editKubernetesFormGroup.get('version')?.errors?.required">Version is required</mat-error>
+          </div>
+          <mat-divider></mat-divider>
+          <!-- Configuration -->
+          <div class="form-control">
+            <div class="title">Configuration</div>
+            <p class="description">Configuration passed to the serverless function</p>
+            <input type="text" formControlName="configuration" class="full-width" />
+          </div>
+        </div>
+        <mat-divider></mat-divider>
+        <button mat-raised-button color="primary" [disabled]="!editFunctionFormGroup.valid" class="mt-10">Add</button>
       </form>
     </div>
     <div fxFlex="50%" class="secondColumn">
@@ -47,18 +80,11 @@ <h1 mat-dialog-title>Functions Editor</h1>
         </ng-container>
         <!-- Type -->
         <ng-container matColumnDef="type">
-          <mat-header-cell *matHeaderCellDef>{{ "functions.description" | translate }}</mat-header-cell>
+          <mat-header-cell *matHeaderCellDef>Type</mat-header-cell>
           <mat-cell *matCellDef="let function">
             {{ function.type }}
           </mat-cell>
         </ng-container>
-        <!-- Operation -->
-        <ng-container matColumnDef="operation">
-          <mat-header-cell *matHeaderCellDef>{{ "functions.operation" | translate }}</mat-header-cell>
-          <mat-cell *matCellDef="let function">
-            {{ function.operation }}
-          </mat-cell>
-        </ng-container>
         <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
         <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
       </mat-table>

src/FaasNet.Website/src/components/statediagram/components/functionseditor/functionseditor.component.ts

@@ -23,7 +23,12 @@ export class FunctionsEditorComponent {
     type: new FormControl('', [Validators.required]),
     operation: new FormControl(),
   });
-  displayedColumns: string[] = ['actions', 'name', 'type', 'operation'];
+  editKubernetesFormGroup: FormGroup = new FormGroup({
+    image: new FormControl('', [Validators.required]),
+    version: new FormControl('', [Validators.required]),
+    configuration: new FormControl()
+  });
+  displayedColumns: string[] = ['actions', 'name', 'type' ];
 
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: FunctionsEditorData,
@@ -37,10 +42,30 @@ export class FunctionsEditorComponent {
   }
 
   addFunction() {
+    if (this.isDisabled()) {
+      return;
+    }
+
     let record = new StateMachineFunction();
     record.name = this.editFunctionFormGroup.get('name')?.value;
     record.operation = this.editFunctionFormGroup.get('operation')?.value;
-    record.type = this.editFunctionFormGroup.get('type')?.value;
+    let type = this.editFunctionFormGroup.get('type')?.value;
+    if (type === 'kubernetes') {
+      type = 'custom';
+      record.metadata = {
+        version: this.editKubernetesFormGroup.get('version')?.value,
+        image: this.editKubernetesFormGroup.get('image')?.value
+      };
+      var configuration = this.editKubernetesFormGroup.get('configuration')?.value;
+      if (configuration) {
+        try {
+          var o = JSON.parse(configuration);
+          record.metadata['configuration'] = o;
+        } catch { }
+      }
+    }
+
+    record.type = type;
     this.functions.data.push(record);
     this.functions.data = this.functions.data;
     this.editFunctionFormGroup.reset();
@@ -50,10 +75,23 @@ export class FunctionsEditorComponent {
     let type = this.editFunctionFormGroup.get('type')?.value;
     switch (type) {
       case 'rest':
-        return 'functions.openAPIOperation';
+        return 'OPEN API url';
+    }
+
+    return '';
+  }
+
+  isDisabled() {
+    if (!this.editFunctionFormGroup.valid) {
+      return true;
+    }
+
+    let type = this.editFunctionFormGroup.get('type')?.value;
+    if (type == 'kubernetes') {
+      return !this.editKubernetesFormGroup.valid;
     }
 
-    return 'functions.operation';
+    return false;
   }
 
   save() {

src/FaasNet.Website/src/components/statediagram/components/operation/actionseditor.component.html

@@ -4,37 +4,46 @@ <h1 mat-dialog-title>Actions Editor</h1>
     <div fxFlex="50%" class="firstColumn">
       <form [formGroup]="addActionFormGroup" (ngSubmit)="addAction()">
         <!-- Name -->
-        <mat-form-field appearance="outline" class="full-width">
-          <mat-label>Action name</mat-label>
-          <input matInput formControlName="name" />
+        <div class="form-control">
+          <div class="title">Name</div>
+          <p class="description">Action name</p>
+          <input type="text" formControlName="name" class="full-width" />
           <mat-error *ngIf="addActionFormGroup.get('name')?.errors?.required">
             {{ 'functions.nameRequired' | translate }}
           </mat-error>
-        </mat-form-field>
+        </div>
+        <mat-divider></mat-divider>
         <!-- Type -->
-        <mat-form-field appearance="outline" class="full-width">
-          <mat-label>Select the type of action</mat-label>
-          <mat-select formControlName="type">
-            <mat-option value="1">Function</mat-option>
-          </mat-select>
-        </mat-form-field>
-        <!-- Function Ref -->
+        <div class="form-control">
+          <div class="title">Type</div>
+          <p class="description">Select the type of action</p>
+          <select formControlName="type" class="full-width">
+            <option value="1">Function</option>
+          </select>
+        </div>
+        <mat-divider></mat-divider>
         <div *ngIf="addActionFormGroup.get('type')?.value == 1" [formGroup]="addFunctionFormGroup">
           <!-- Reference Name -->
-          <mat-form-field appearance="outline" class="full-width">
-            <mat-label>Select a function</mat-label>
-            <mat-select formControlName="refName">
-              <mat-option *ngFor="let function of functions" [value]="function.name">{{ function.name + ' (' + function.type + ')'}}</mat-option>
-            </mat-select>
+          <div class="form-control">
+            <div class="title">Reference Name</div>
+            <p class="description">Name of the references function</p>
+            <select formControlName="refName" class="full-width">
+              <option *ngFor="let function of functions" [value]="function.name">{{ function.name + ' (' + function.type + ')'}}</option>
+            </select>
             <mat-error *ngIf="addFunctionFormGroup.get('refName')?.errors?.required">A function must be selected</mat-error>
-          </mat-form-field>
+          </div>
+          <mat-divider></mat-divider>
           <!-- Arguments -->
-          <mat-form-field appearance="outline" class="full-width">
-            <mat-label>Arguments</mat-label>
-            <input matInput formControlName="arguments" />
-          </mat-form-field>
+          <div class="form-control">
+            <div class="title">Arguments</div>
+            <p class="description">Arguments (inputs) to be passed to the referenced function.</p>
+            <input type="text" formControlName="arguments" class="full-width" />
+          </div>
+        </div>
+        <mat-divider></mat-divider>
+        <div class="mt-10">
+          <button mat-raised-button color="primary" [disabled]="isDisabled()">Add</button>
         </div>
-        <button mat-raised-button color="primary" [disabled]="isDisabled()">Add</button>
       </form>
     </div>
     <div fxFlex="50%" class="secondColumn">

src/FaasNet.Website/src/components/statediagram/components/operation/operation-state-editor.component.scss

@@ -3,5 +3,6 @@ $border-color: #c1c1c1;
 .actions {
     border: 1px solid $border-color;
     height: 30px;
+    line-height: 30px;
     cursor: pointer;
 }

src/FaasNet.Website/src/stores/statemachines/models/statemachine-function.model.ts

@@ -8,7 +8,8 @@ export class StateMachineFunction {
     return {
       name: this.name,
       type: this.type,
-      operation: this.operation
+      operation: this.operation,
+      metadata: this.metadata
     };
   }