feat(plugins): added filter (type) tabs po plugin list view

public/app/features/plugins/partials/plugin_list.html

@@ -4,6 +4,26 @@
 <div class="page-container">
   <div class="page-header">
     <h1>Plugins</h1>
+
+		<div class="page-header-tabs">
+			<ul class="gf-tabs">
+				<li class="gf-tabs-item">
+					<a class="gf-tabs-link" href="plugins?type=panel" ng-class="{active: ctrl.tabIndex === 0}">
+						Panels
+					</a>
+				</li>
+				<li class="gf-tabs-item">
+					<a class="gf-tabs-link" href="plugins?type=datasource" ng-class="{active: ctrl.tabIndex === 1}">
+						Data sources
+					</a>
+				</li>
+				<li class="gf-tabs-item">
+					<a class="gf-tabs-link" href="plugins?type=app" ng-class="{active: ctrl.tabIndex === 2}">
+						Apps
+					</a>
+				</li>
+			</ul>
+		</div>
 	</div>
 
 	<table class="filter-table">
@@ -38,5 +58,5 @@
 			</tr>
 		</tbody>
 	</table>
-	</div>
+</div>
 </div>

public/app/features/plugins/plugin_list_ctrl.ts

@@ -4,11 +4,28 @@ import angular from 'angular';
 
 export class PluginListCtrl {
   plugins: any[];
+  tabIndex: number;
 
   /** @ngInject */
-  constructor(private backendSrv: any) {
+  constructor(private backendSrv: any, $location) {
+    this.tabIndex = 0;
 
-    this.backendSrv.get('api/plugins', {embedded: 0}).then(plugins => {
+    var pluginType = $location.search().type || 'panel';
+    switch (pluginType) {
+      case "datasource":  {
+        this.tabIndex = 1;
+        break;
+      }
+      case "app": {
+        this.tabIndex = 2;
+        break;
+      }
+      case "panel":
+      default:
+        this.tabIndex = 0;
+    }
+
+    this.backendSrv.get('api/plugins', {embedded: 0, type: pluginType}).then(plugins => {
       this.plugins = plugins;
     });
   }