included backend logic to include stage information

coolsamson7 · Nov 7, 2024 · 1d45715 · 1d45715
1 parent 7ae1e86
commit 1d45715
Show file tree

Hide file tree

Showing 19 changed files with 166 additions and 85 deletions.
diff --git a/administration/server/src/main/resources/application-dev.properties b/administration/server/src/main/resources/application-dev.properties
diff --git a/modulefederation/apps/web/src/app/plugin/plugin-manager.ts b/modulefederation/apps/web/src/app/plugin/plugin-manager.ts
@@ -38,7 +38,7 @@ export class PluginManager extends PluginRegistry {
 
     next = 0 // correlation id
 
-    // construtor
+    // constructor
 
     constructor(private stomp: RxStomp) {
         super()

diff --git a/modulefederation/apps/web/src/app/plugin/plugins.plugin.ts b/modulefederation/apps/web/src/app/plugin/plugins.plugin.ts
@@ -9,7 +9,7 @@ export interface PluginInfo {
     description: string
 }
 
-@RegisterPlugin("plugins")
+@RegisterPlugin("plugin-manager")
 @Injectable({providedIn: 'root'})
 export class PluginsPlugin extends AbstractPlugin {
     // constructor
@@ -24,4 +24,4 @@ export class PluginsPlugin extends AbstractPlugin {
     async plugins() : Promise<PluginInfo[]> {
       return Promise.resolve([])//make the compiler happy
     }
-  }
+  }
diff --git a/modulefederation/apps/web/src/app/portal/applications/application-view.ts b/modulefederation/apps/web/src/app/portal/applications/application-view.ts
@@ -29,7 +29,7 @@ export abstract class ApplicationView extends WithSnackbar(WithCommandToolbar(Wi
          value: []
        }
 
-       // copy all values which either dont't inherit or overwrite
+       // copy all values which either don't inherit or overwrite
 
        const copy = (properties: ConfigurationProperty[], result: ConfigurationProperty[]) => {
          for ( const property of properties) {

diff --git a/modulefederation/apps/web/src/app/portal/applications/application.feature.ts b/modulefederation/apps/web/src/app/portal/applications/application.feature.ts
@@ -169,6 +169,9 @@ export class ApplicationFeatureComponent extends WithCommandToolbar(WithCommands
    }
 
     selectNode(node: Node | undefined) {
+        if ( node === this.selectedNode)
+            return
+
         if ( this.dirty) {
             this.confirmationDialog()
                 .title("Dirty")
@@ -180,6 +183,10 @@ export class ApplicationFeatureComponent extends WithCommandToolbar(WithCommands
                         this.save()
                         this.selectNode(node)
                     }
+                    else {
+                        this.tree.select(this.selectedNode!)
+                       this.tree.treeControl.expansionModel.select(this.selectedNode!)
+                    }
                 })
             return
         }
@@ -404,7 +411,7 @@ export class ApplicationFeatureComponent extends WithCommandToolbar(WithCommands
                         const addTree : AddTreeData  = {
                         }
 
-            
+
                         if ( !microfrontend ) {
                             // microfronted was created as well
 
@@ -413,7 +420,7 @@ export class ApplicationFeatureComponent extends WithCommandToolbar(WithCommands
                             addTree.microfrontend = microfrontend
                         }
 
-                        let version = addTree.microfrontend ? null : microfrontend?.versions.find(version => version.version == manifest.version) 
+                        let version = addTree.microfrontend ? null : microfrontend?.versions.find(version => version.version == manifest.version)
 
                         if ( !version ) {
                             // version was created as well

diff --git a/.../src/app/portal/applications/assigned-microfrontends/assigned-microfrontends.component.ts b/.../src/app/portal/applications/assigned-microfrontends/assigned-microfrontends.component.ts
@@ -1,4 +1,4 @@
-import { AfterViewInit, Component, Directive, EventEmitter, Input, OnInit, Output } from "@angular/core";
+import { AfterViewInit, Component, Directive, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from "@angular/core";
 import { ApplicationVersion, AssignedMicrofrontend, Microfrontend } from "../../model";
 import { MatTableDataSource, MatTableModule } from "@angular/material/table";
 import { NG_VALIDATORS, Validator, AbstractControl, NgControl, AbstractControlDirective, FormsModule } from "@angular/forms";
@@ -172,7 +172,7 @@ export const Columns = [
         VersionValidatorDirective
     ]
 })
-export class AssignedMicrofrontendsComponent  implements OnInit {
+export class AssignedMicrofrontendsComponent  implements OnInit, OnChanges {
    // inputs
 
     @Input() applicationVersion! : ApplicationVersion
@@ -273,6 +273,22 @@ export class AssignedMicrofrontendsComponent  implements OnInit {
 
        // NEW TODO
 
+  // implement OnChanges
+
+  ngOnChanges(changes: SimpleChanges): void {
+    this.dataSource = new MatTableDataSource<AssignedMicrofrontendRow>(
+      this.applicationVersion.assignedMicrofrontends.map(assigned => {
+          return {
+              isSelected: false,
+              isEdit: false,
+              data: assigned
+          }
+      })
+  )
+
+ this.suggestionProvider = new ArraySuggestionProvider(this.microfrontends.map(microfrontend => microfrontend.name))
+  }
+
    // implement OnInit
 
    ngOnInit(): void {

diff --git a/...eb/src/app/portal/applications/microfrontend-version/microfrontend-version.component.html b/...eb/src/app/portal/applications/microfrontend-version/microfrontend-version.component.html
@@ -46,7 +46,6 @@
             </mat-icon>
           </a>
 
-          <!--mat-icon (click)="removeManifest(manifest)" class="icon">remove_circle</mat-icon-->
           <mat-slide-toggle (ngModelChange)="onChangedEnabled(instance)" [(ngModel)]="instance.enabled"  class="toggle"  color="primary"></mat-slide-toggle>
         </mat-list-item>
 

diff --git a/...eb/src/app/portal/applications/microfrontend-version/microfrontend-version.component.scss b/...eb/src/app/portal/applications/microfrontend-version/microfrontend-version.component.scss
@@ -34,7 +34,7 @@
             .content {
                 display: inline-grid;
                 align-items: center;
-                grid-template-columns: 27px 4em 15em 2em 14em 4em 25px;
+                grid-template-columns: 27px 4em 15em 4em 14em 4em 25px;
             }
 
             a {

diff --git a/modulefederation/libs/components/src/lib/monaco-editor/abstract-monaco-editor.component.ts b/modulefederation/libs/components/src/lib/monaco-editor/abstract-monaco-editor.component.ts
@@ -34,35 +34,8 @@ export abstract class AbstractMonacoEditor implements AfterViewInit, OnDestroy {
         });
     }
 
-    private onResize(resize: ResizeObserverEntry) {
-        this.layout()
-    }
-
     // protected
 
-    ngAfterViewInit() : void {
-        this.loader.isLoaded$.pipe(
-            filter(isLoaded => isLoaded),
-            take(1)
-        ).subscribe(() => {
-            setTimeout(() => this.setupEditor(), 0)
-        })
-
-        this.resizeSubscription = new ResizeObservable(this.el.nativeElement.childNodes[0], this.zone)
-        //TODO .pipe(debounceTime(200))
-        .subscribe((entries: ResizeObserverEntry[]) => this.onResize(entries[0]));
-    }
-
-    ngOnDestroy() {
-        if (this.resizeSubscription) this.resizeSubscription.unsubscribe();
-
-        if (this.editor) {
-            this.editor.getModel()?.dispose()
-            this.editor.dispose();
-            this.editor = undefined;
-        }
-    }
-
     protected setupEditor() {
         if (this.model.schema)
             this.setSchema()
@@ -78,8 +51,6 @@ export abstract class AbstractMonacoEditor implements AfterViewInit, OnDestroy {
         return monaco.editor.getModel(this.uri || '');
     }
 
-    // private
-
     protected createModel() {
         let model = this.getModel();
         if (!model) {
@@ -94,8 +65,6 @@ export abstract class AbstractMonacoEditor implements AfterViewInit, OnDestroy {
         return this.modelInstance = model
     }
 
-    // implement AfterViewInit
-
     protected setSchema() {
         monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
             validate: true,
@@ -107,11 +76,46 @@ export abstract class AbstractMonacoEditor implements AfterViewInit, OnDestroy {
         })
     }
 
-    // implement OnDestroy
+    // private
+
+    private onResize(resize: ResizeObserverEntry) {
+        this.layout()
+    }
 
     private layout() {
-        if (this.editor)
-            this.editor.layout()
+        if (this.editor) {
+          console.log("layout")
+          this.editor.layout()
+
+          setTimeout(() => this.editor.layout(), 200)
+        }
+    }
+
+    // implement AfterViewInit
+
+    ngAfterViewInit() : void {
+        this.loader.isLoaded$.pipe(
+            filter(isLoaded => isLoaded),
+            take(1)
+        ).subscribe(() => {
+            setTimeout(() => this.setupEditor(), 0)
+        })
+
+        this.resizeSubscription = new ResizeObservable(this.el.nativeElement.childNodes[0], this.zone)
+        //TODO .pipe(debounceTime(200))
+        .subscribe((entries: ResizeObserverEntry[]) => this.onResize(entries[0]));
+    }
+
+    // implement OnDestroy
+
+    ngOnDestroy() {
+        if (this.resizeSubscription) this.resizeSubscription.unsubscribe();
+
+        if (this.editor) {
+            this.editor.getModel()?.dispose()
+            this.editor.dispose();
+            this.editor = undefined;
+        }
     }
 }
 

diff --git a/modulefederation/libs/components/src/lib/monaco-editor/monaco-editor.component.ts b/modulefederation/libs/components/src/lib/monaco-editor/monaco-editor.component.ts
@@ -44,7 +44,17 @@ declare let monaco : any;
       .editor-container {
           width: 100%;
           height: 98%;
+
+          .monaco-editor {
+          color: red;
+            height: 100%;
+          }
       }
+
+        .monaco-editor {
+                color: red;
+                  height: 100%;
+                }
   `],
     providers: [
         {
@@ -81,6 +91,8 @@ export class MonacoEditorComponent extends AbstractMonacoEditor implements Contr
     @Input()
     set options(options : any) {
         this.editorOptions = Object.assign({}, this.config.defaultOptions, options);
+
+        this.editorOptions.automaticLayout = true
     }
 
     onChange = (_ : any) => { /** noop */}
@@ -129,7 +141,7 @@ export class MonacoEditorComponent extends AbstractMonacoEditor implements Contr
             this.onTouched();
         });
 
-        // doesnt't work
+        // doesn't work
 
         editor.onDidChangeModelDecorations(() => {
             // @ts-ignore

diff --git a/modulefederation/libs/portal/src/lib/deployment/deployment-loader.ts b/modulefederation/libs/portal/src/lib/deployment/deployment-loader.ts
@@ -1,5 +1,14 @@
 import { Deployment } from "../deployment";
 
+export interface DeploymentRequest {
+    application: string
+    version : string
+    session: boolean
+    host: string
+    port: string
+    protocol: string
+}
+
 export abstract class DeploymentLoader {
-    abstract load(name: string, version: string) : Promise<Deployment>
+    abstract load(request: DeploymentRequest) : Promise<Deployment>
 }
diff --git a/modulefederation/libs/portal/src/lib/deployment/http-deployment-loader.ts b/modulefederation/libs/portal/src/lib/deployment/http-deployment-loader.ts
@@ -1,9 +1,8 @@
 import { Injectable, Injector } from "@angular/core";
-import { Deployment, DeploymentLoader } from "../deployment";
+import { Deployment, DeploymentLoader, DeploymentRequest } from "../deployment";
 
 import { Observable } from "rxjs";
 import { AbstractHTTPService, Service } from "../common/communication";
-import { SessionManager, Ticket } from "../security";
 
 @Injectable({providedIn: 'root'})
 @Service({domain: "admin", prefix: "/portal-administration"})
@@ -16,28 +15,23 @@ export class PortalDeploymentService extends AbstractHTTPService {
 
     // public
 
-    public getDeployment(name: string, version: string, session : boolean) : Observable<Deployment> {
-        return this.computeDeployment(name, version, session)
-        //return this.get<Deployment>(`/deployment/${session}`);
-    }
-
-    public computeDeployment(application: string, version: string, session : boolean) : Observable<Deployment> {
-        return this.get<Deployment>(`/compute-deployment/${application}/${version}/${session}`)
+    public computeDeployment(request: DeploymentRequest) : Observable<Deployment> {
+        return this.post<Deployment>(`/compute-deployment`, request)
     }
 }
 
 @Injectable({providedIn: 'root'})
 export class HTTPDeploymentLoader extends DeploymentLoader {
     // constructor
 
-    constructor(private deploymentService : PortalDeploymentService, private sessionManager : SessionManager<any, Ticket>) {
+    constructor(private deploymentService : PortalDeploymentService) {
         super();
     }
 
     // implement DeploymentLoader
 
-    load(name: string, version: string) : Promise<Deployment> {
+    load(request: DeploymentRequest) : Promise<Deployment> {
         // @ts-ignore
-        return this.deploymentService.getDeployment(name, version, this.sessionManager.hasSession()).toPromise()
+        return this.deploymentService.computeDeployment(request).toPromise()
     }
 }
diff --git a/modulefederation/libs/portal/src/lib/deployment/local-deployment-loader.ts b/modulefederation/libs/portal/src/lib/deployment/local-deployment-loader.ts
@@ -1,4 +1,4 @@
-import { DeploymentLoader } from "./deployment-loader";
+import { DeploymentLoader, DeploymentRequest } from "./deployment-loader";
 import { Deployment } from "./deployment-model";
 import { ManifestDecorator } from "./manifest-decorator";
 
@@ -16,7 +16,7 @@ export class LocalDeploymentLoader extends DeploymentLoader {
 
     // implement DeploymentLoader
 
-    async load(name: string, version: string) : Promise<Deployment> {
+    async load(request: DeploymentRequest) : Promise<Deployment> {
         const promises = this.urls.map(url => {
             return fetch(url + "/assets/manifest.json")
         })

diff --git a/modulefederation/libs/portal/src/lib/portal-manager.ts b/modulefederation/libs/portal/src/lib/portal-manager.ts
@@ -19,6 +19,7 @@ import { LocaleManager } from './locale';
 import { DeploymentConfigurationSource } from './deployment/deployment-configuration-source';
 import { ConfigurationManager } from './common';
 import { RouteBuilder, RouteBuilderManager } from './federation';
+import { SessionManager, Ticket } from './security';
 
 /**
  * the runtime data of feature
@@ -68,6 +69,7 @@ export class PortalManager {
     private localeManager: LocaleManager,
     private configurationManager: ConfigurationManager,
     private routeBuilder : RouteBuilderManager,
+    private sessionManager: SessionManager<any,Ticket>,
     private injector: Injector
   ) {}
 
@@ -90,7 +92,14 @@ export class PortalManager {
        throw new Error("you need to specify either a server  or local loader")
 
     return loader
-      .load(this.portalConfig.localManifest.name, this.portalConfig.localManifest.version)
+      .load({
+        application: this.portalConfig.localManifest.name,
+        version: this.portalConfig.localManifest.version,
+        session: this.sessionManager.hasSession(),
+        host: window.location.hostname,
+        port: window.location.port,
+        protocol: window.location.protocol,
+      }, )
       .then((deployment) => this.setupDeployment(deployment, merge));
   }