Load relations on directive initialisation

This fixes an issue, where the relations of
a work package wouldn't be loaded and thus
not shown.

frontend/app/components/api/api-v3/hal-resources/collection-resource.service.ts

@@ -27,7 +27,11 @@
 //++
 
 import {HalResource} from './hal-resource.service';
-import {opApiModule} from "../../../../angular-modules";
+import {opApiModule} from '../../../../angular-modules';
+
+interface CollectionResourceEmbedded {
+  elements: HalResource[] & any;
+}
 
 export class CollectionResource extends HalResource {
   public getElements() {
@@ -35,6 +39,9 @@ export class CollectionResource extends HalResource {
   }
 }
 
+export interface CollectionResourceInterface extends CollectionResourceEmbedded, CollectionResource {
+}
+
 function collectionResource() {
   return CollectionResource;
 }

frontend/app/components/api/api-v3/hal-resources/work-package-resource.service.ts

@@ -27,10 +27,11 @@
 //++
 
 import {HalResource} from './hal-resource.service';
-import {opApiModule} from "../../../../angular-modules";
-import {WorkPackageCacheService} from "../../../work-packages/work-package-cache.service";
-import {ApiWorkPackagesService} from "../../api-work-packages/api-work-packages.service";
+import {opApiModule} from '../../../../angular-modules';
+import {WorkPackageCacheService} from '../../../work-packages/work-package-cache.service';
+import {ApiWorkPackagesService} from '../../api-work-packages/api-work-packages.service';
 import IQService = angular.IQService;
+import {CollectionResourceInterface} from './collection-resource.service';
 
 interface WorkPackageResourceEmbedded {
   activities:HalResource|any;
@@ -43,7 +44,7 @@ interface WorkPackageResourceEmbedded {
   parent:HalResource|any;
   priority:HalResource|any;
   project:HalResource|any;
-  relations:HalResource[]|any[]
+  relations:CollectionResourceInterface;
   responsible:HalResource|any;
   schema:HalResource|any;
   status:HalResource|any;

frontend/app/components/wp-panels/relations-panel/relations-panel.directive.ts

@@ -36,8 +36,7 @@ export class RelationsPanelController {
   public relationTitles;
   public relationGroups;
 
-  constructor($scope,
-              I18n: op.I18n,
+  constructor(I18n: op.I18n,
               wpRelations:WorkPackageRelationsService) {
 
     this.relationTitles = {
@@ -52,15 +51,9 @@ export class RelationsPanelController {
       follows: I18n.t('js.relation_buttons.add_follows')
     };
 
+    this.workPackage.relations.$load().then(() => {
       this.relationGroups = wpRelations.getWpRelationGroups(this.workPackage);
-    
-    // $scope.wpChildren = new ChildRelationsHandler(this.workPackage);
-    //
-    //
-    // if (this.workPackage.children) {
-    //   $scope.wpChildren = new ChildRelationsHandler(this.workPackage, this.workPackage.children);
-    // }
-    //
+    });
   }
 }
 

frontend/app/components/wp-relations/wp-relation-group/wp-relation-group.service.ts

@@ -118,9 +118,10 @@ export class WorkPackageRelationGroup {
   }
 
   protected init() {
-    if (Array.isArray(this.workPackage.relations)) {
+    const elements = this.workPackage.relations.elements;
+    if (Array.isArray(elements)) {
       this.relations.push(
-        ...this.workPackage.relations.filter(relation => relation._type === this.type));
+        ...elements.filter(relation => relation._type === this.type));
     }
   }
 }

frontend/app/components/wp-relations/wp-relations.directive.ts

@@ -26,8 +26,8 @@
 // See doc/COPYRIGHT.rdoc for more details.
 //++
 
-import {wpTabsModule} from "../../angular-modules";
-import {WorkPackageRelationGroup} from "./wp-relation-group/wp-relation-group.service";
+import {wpTabsModule} from '../../angular-modules';
+import {WorkPackageRelationGroup} from './wp-relation-group/wp-relation-group.service';
 
 const iconArrowClasses = ['icon-arrow-up1', 'icon-arrow-down1'];
 
@@ -48,7 +48,7 @@ export class WorkPackageRelationsController {
   }
 
   public get groupExpanded() {
-    if (angular.isUndefined(this._initialExpand)) {
+    if (angular.isUndefined(this._initialExpand) && !this.relationGroup.isEmpty) {
       this._initialExpand = this.expand = !this.relationGroup.isEmpty;
     }
     return this.expand;