2 files changed, 26 insertions, 15 deletions

diff --git a/catalog-ui/src/app/ng2/pages/catalog/catalog.component.ts b/catalog-ui/src/app/ng2/pages/catalog/catalog.component.ts
index 5d6526001c..5298e7e0d3 100644
--- a/catalog-ui/src/app/ng2/pages/catalog/catalog.component.ts
+++ b/catalog-ui/src/app/ng2/pages/catalog/catalog.component.ts
@@ -27,7 +27,6 @@ import { SdcMenuToken, IAppMenu } from "../../config/sdc-menu.config";
 import { Component, ICategoryBase, IMainCategory, ISubCategory, IConfigStatuses, ICatalogSelector, CatalogSelectorTypes } from "app/models";
 import { ResourceNamePipe } from "../../pipes/resource-name.pipe";
 import { EntityFilterPipe, IEntityFilterObject, ISearchFilter} from "../../pipes/entity-filter.pipe";
-import { Model } from "app/models/model";
 import { DEFAULT_MODEL_NAME } from "app/utils/constants";
 
 interface Gui {
@@ -78,7 +77,7 @@ export class CatalogComponent {
     public checkboxesFilterKeys:ICheckboxesFilterKeys;
     public gui:Gui;
     public categories:Array<IMainCategory>;
-    public models: Array<string> = new Array();
+    public models: Array<any> = new Array();
     public filteredCategories:Array<IMainCategory>;
     public confStatus:IConfigStatuses;
     public componentTypes:{[key:string]: Array<string>};
@@ -157,8 +156,17 @@ export class CatalogComponent {
         this.numberOfItemToDisplay = 0;
         this.categories = this.makeSortedCategories(this.cacheService.get('serviceCategories').concat(this.cacheService.get('resourceCategories')))
             .map((cat) => <IMainCategory>cat);
-        this.models = this.cacheService.get('models').map((model:Model) => model.name);
-        this.models.unshift(DEFAULT_MODEL_NAME);
+
+        var modelList = this.cacheService.get('models');
+        modelList.sort((o:any, o1:any) => new String(o.modelType).localeCompare(o1.modelType));
+        modelList.forEach(m => {
+            if (m.derivedFrom) {
+                this.models[m.derivedFrom].push(m.name);
+            } else {
+                this.models[m.name] = [];
+            }
+        });
+        this.models[DEFAULT_MODEL_NAME] = [];
         this.confStatus = this.sdcMenu.statuses;
         this.expandedSection = ["type", "category", "status", "model"];
         this.catalogItems = [];
@@ -229,14 +237,17 @@ export class CatalogComponent {
 
     private buildChecklistModelForModels() {
         this.modelsChecklistModel = new SdcUiCommon.ChecklistModel(this.checkboxesFilterKeys.models._main,
-            this.models.map((model) => new SdcUiCommon.ChecklistItemModel(
-                model, 
-                false, 
-                this.checkboxesFilterKeys.models._main.indexOf(model) !== -1, 
-                null, 
-                this.getTestIdForCheckboxByText(model), 
-                model))
-        );
+            Object.keys(this.models).map((modelName) => {
+                var modelList = this.models[modelName];
+                modelList.unshift(modelName);
+                return new SdcUiCommon.ChecklistItemModel(
+                    modelName,
+                    false,
+                    this.checkboxesFilterKeys.models._main.indexOf(modelName) !== -1,
+                    null,
+                    this.getTestIdForCheckboxByText(modelName),
+                    modelList);
+        }));
     }
 
     private buildChecklistModelForStatuses() {
diff --git a/catalog-ui/src/app/ng2/pipes/entity-filter.pipe.ts b/catalog-ui/src/app/ng2/pipes/entity-filter.pipe.ts
index b67f42d4df..29b21cb6da 100644
--- a/catalog-ui/src/app/ng2/pipes/entity-filter.pipe.ts
+++ b/catalog-ui/src/app/ng2/pipes/entity-filter.pipe.ts
@@ -135,11 +135,11 @@ export class EntityFilterPipe implements PipeTransform{
         // --------------------------------------------------------------------------
         if (filter.selectedModels && filter.selectedModels.length > 0) {
             let filteredModels = [];
-            let defaultModelPresent = filter.selectedModels.indexOf(DEFAULT_MODEL_NAME) > -1;
+            let allSelectedModels =  [].concat.apply([], filter.selectedModels);
             angular.forEach(filteredComponents, (component:Component):void => {
-                if (filter.selectedModels.indexOf(component.model) > -1) {
+                if (component.model && allSelectedModels.indexOf(component.model) > -1) {
                     filteredModels.push(component);
-                } else if (!component.model && defaultModelPresent) {
+                } else if (!component.model && allSelectedModels.indexOf(DEFAULT_MODEL_NAME) > -1) {
 	                filteredModels.push(component);
                 }
             });