Added onclick for extra drop down options. Renamed applicationId.

Author: MadsApollo

src/app/applications/application-change-organization-dialog/application-change-organization-dialog.component.html

@@ -1,11 +1,11 @@
 <div class="application-change-organization-dialog">
   <h1 mat-dialog-title>{{ "APPLICATION.CHANGE-ORGANIZATION.TITLE" | translate }}</h1>
   <div mat-dialog-content>
-    <label class="form-label" for="userGroup">{{
+    <label class="form-label" for="organizationSelect">{{
       "APPLICATION.CHANGE-ORGANIZATION.CHOOSE-ORGANIZATION" | translate
     }}</label>
     <mat-select
-      id="userGroup"
+      id="organizationSelect"
       class="form-control"
       panelClass="overflow-x-hidden"
       [(value)]="application.organizationId"
@@ -16,11 +16,11 @@ <h1 mat-dialog-title>{{ "APPLICATION.CHANGE-ORGANIZATION.TITLE" | translate }}</
         {{ organization.name }}
       </mat-option>
     </mat-select>
-    <label class="form-label" for="userGroup">{{
+    <label class="form-label" for="permissionSelect">{{
       "APPLICATION.CHANGE-ORGANIZATION.CHOOSE-USER-GROUPS" | translate
     }}</label>
     <mat-select
-      id="userGroup"
+      id="permissionSelect"
       class="form-control"
       [multiple]="true"
       panelClass="overflow-x-hidden"

src/app/applications/application-change-organization-dialog/application-change-organization-dialog.component.ts

@@ -46,8 +46,8 @@ export class ApplicationChangeOrganizationDialogComponent implements OnInit {
 
   ngOnInit(): void {
     this.translate.use("da");
-    if (this.dialogModel.id) {
-      this.getApplication(this.dialogModel.id);
+    if (this.dialogModel.applicationId) {
+      this.getApplication(this.dialogModel.applicationId);
     }
     this.getOrganizations();
     this.getPermissions();
@@ -60,7 +60,7 @@ export class ApplicationChangeOrganizationDialogComponent implements OnInit {
   }
 
   getOrganizations() {
-    this.organizationsSubscription = this.organizationService.getMinimal().subscribe(res => {
+    this.organizationsSubscription = this.organizationService.getMultiple().subscribe(res => {
       this.organizations = res.data;
       this.filteredOrganizations.next(this.organizations.slice());
     });
@@ -92,7 +92,7 @@ export class ApplicationChangeOrganizationDialogComponent implements OnInit {
 
   onSubmit() {
     this.applicationsSubscription = this.applicationService
-      .updateApplicationOrganization(this.application, this.dialogModel.id)
+      .updateApplicationOrganization(this.application, this.dialogModel.applicationId)
       .subscribe(savedApplication => {
         this.snackBar.open(
           this.translate.instant("APPLICATION.CHANGE-ORGANIZATION.SNACKBAR-SAVED", {

src/app/applications/application-detail/application-detail.component.html

@@ -7,7 +7,6 @@
     [dropDownButton]="dropdownButton"
     (deleteSelectedInDropdown)="onDeleteApplication()"
     [canEdit]="canEdit"
-    (extraDropdownOptions)="onExtraDropdownOptionClicked($event)"
   >
   </app-top-bar>
   <div class="container-fluid">
@@ -67,7 +66,7 @@ <h3>{{ "APPLICATION.DETAILS" | translate }}</h3>
       </div>
     </div>
 
-    <nav mat-tab-nav-bar [tabPanel]="tabPanel" >
+    <nav mat-tab-nav-bar [tabPanel]="tabPanel">
       <a
         mat-tab-link
         *ngFor="let link of navTabs"

src/app/applications/application-detail/application-detail.component.ts

@@ -60,7 +60,6 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
   public redMarker = "/assets/images/red-marker.png";
   public greenMarker = "/assets/images/green-marker.png";
   public greyMarker = "/assets/images/grey-marker.png";
-  private dropdownButtonExtraOptionsHandlers: Map<number, () => void> = new Map();
 
   constructor(
     private applicationService: ApplicationService,
@@ -88,13 +87,11 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
       };
 
       this.translate.get("APPLICATION.CHANGE-ORGANIZATION.TITLE").subscribe(translation => {
-        const changeOrganizationButton = {
+        this.dropdownButton.extraOptions.push({
           id: this.id,
           label: translation,
           onClick: () => this.onOpenChangeOrganizationDialog(),
-        };
-        this.dropdownButton.extraOptions.push(changeOrganizationButton);
-        this.dropdownButtonExtraOptionsHandlers.set(changeOrganizationButton.id, changeOrganizationButton.onClick);
+        });
       });
     }
 
@@ -212,18 +209,12 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
   onOpenChangeOrganizationDialog() {
     this.changeOrganizationDialog.open(ApplicationChangeOrganizationDialogComponent, {
       data: {
-        id: this.id,
+        applicationId: this.id,
         organizationId: this.application.belongsTo.id,
       } as ApplicationDialogModel,
     });
   }
 
-  onExtraDropdownOptionClicked(id: string) {
-    const handler = this.dropdownButtonExtraOptionsHandlers.get(Number(id));
-
-    handler && handler();
-  }
-
   bindApplication(id: number): void {
     this.applicationsSubscription = this.applicationService.getApplication(id).subscribe(application => {
       this.application = application;

src/app/applications/applications-list/applications-table/applications-table.component.ts

@@ -275,7 +275,7 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit {
   onOpenChangeOrganizationDialog(id: number) {
     const dialog = this.changeOrganizationDialog.open(ApplicationChangeOrganizationDialogComponent, {
       data: {
-        id: id,
+        applicationId: id,
       } as ApplicationDialogModel,
     });
 

src/app/shared/components/top-bar/top-bar.component.ts

@@ -123,6 +123,9 @@ export class TopBarComponent implements OnInit {
 
   onClickExtraDropdownOption(id: string) {
     this.extraDropdownOptions.emit(id);
+    const extraDropdownOption = this.dropDownButton.extraOptions.find(opt => opt.id === id);
+
+    extraDropdownOption?.onClick();
   }
 
   public goToHelp() {

src/app/shared/models/dialog.model.ts

@@ -14,6 +14,6 @@ export class WelcomeDialogModel {
 }
 
 export class ApplicationDialogModel {
-  id: number;
+  applicationId: number;
   organizationId?: number;
 }

src/app/shared/models/dropdown-button.model.ts

@@ -3,6 +3,7 @@ import { PermissionType } from "@app/admin/permission/permission.model";
 export interface ExtraDropdownOption {
   id: string | number;
   label: string;
+  onClick?: () => void
 }
 
 export interface DropdownButton {