Worked on account update view

src/app/controllers/sidemenuCtrl.js

@@ -33,6 +33,7 @@ function (angular, _, $, config) {
         text: "Account", href: $scope.getUrl("/account"),
         icon: "fa fa-shield",
         links: [
+          { text: 'Info', href: $scope.getUrl("/account"), icon: "fa fa-sitemap" },
           { text: 'Data sources', href: $scope.getUrl("/account/datasources"), icon: "fa fa-sitemap" },
           { text: 'Users', href: $scope.getUrl("/account/users"), icon: "fa fa-users" },
           { text: 'API Keys', href: $scope.getUrl("/account/apikeys"), icon: "fa fa-key" },
@@ -42,6 +43,7 @@ function (angular, _, $, config) {
         text: "Profile", href: $scope.getUrl("/profile"),
         icon: "fa fa-user",
         links: [
+          { text: 'Info', href: $scope.getUrl("/profile"), icon: "fa fa-sitemap" },
           { text: 'Password', href:"", icon: "fa fa-lock" },
         ]
       }

src/app/features/account/accountCtrl.js

@@ -0,0 +1,29 @@
+define([
+  'angular',
+],
+function (angular) {
+  'use strict';
+
+  var module = angular.module('grafana.controllers');
+
+  module.controller('AccountCtrl', function($scope, $http, backendSrv) {
+
+    $scope.init = function() {
+      $scope.getAccount();
+    };
+
+    $scope.getAccount = function() {
+      backendSrv.get('/api/account').then(function(account) {
+        $scope.account = account;
+      });
+    };
+
+    $scope.update = function() {
+      if (!$scope.accountForm.$valid) { return; }
+      backendSrv.put('/api/account', $scope.account).then($scope.getAccount);
+    };
+
+    $scope.init();
+
+  });
+});

src/app/features/account/partials/account.html

@@ -5,14 +5,32 @@
 	<div class="dashboard-editor-header">
 		<div class="dashboard-editor-title">
 			<i class="fa fa-shield"></i>
-			Account info
+			  Account information
 		</div>
 	</div>
 
 	<div class="dashboard-editor-body">
-
-		<h3>TODO</h3>
-
+		<div class="row editor-row">
+			<div class="section">
+				<form name="accountForm">
+					<div>
+					<div class="tight-form">
+						<ul class="tight-form-list">
+							<li class="tight-form-item" style="width: 120px">
+								<strong>Account name</strong>
+							</li>
+							<li>
+								<input type="text" required ng-model="account.name" class="input-xlarge tight-form-input last" >
+							</li>
+						</ul>
+						<div class="clearfix"></div>
+					</div>
+					</div>
+					<br>
+					<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
+				</form>
+			</div>
+		</div>
 	</div>
 </div>
 

src/app/features/account/partials/users.html

@@ -5,7 +5,7 @@
 	<div class="dashboard-editor-header">
 		<div class="dashboard-editor-title">
 			<i class="fa fa-users"></i>
-			Account users
+			Users
 		</div>
 	</div>
 

src/app/features/all.js

@@ -12,6 +12,7 @@ define([
   './account/datasourcesCtrl',
   './account/apiKeysCtrl',
   './account/importCtrl',
+  './account/accountCtrl',
   './admin/adminUsersCtrl',
   './grafanaDatasource/datasource',
 ], function () {});

src/app/features/profile/partials/profile.html

@@ -7,51 +7,53 @@
 			<div class="dashboard-editor-header">
 				<div class="dashboard-editor-title">
 					<i class="fa fa-user"></i>
-					Your info
+					Personal information
 				</div>
 			</div>
 
 			<div class="dashboard-editor-body">
+				<div class="row">
+					<form name="userForm">
+						<div>
+							<div class="tight-form">
+								<ul class="tight-form-list">
+									<li class="tight-form-item" style="width: 80px">
+										<strong>Name</strong>
+									</li>
+									<li>
+										<input type="text" required ng-model="user.name" class="input-xxlarge tight-form-input last" >
+									</li>
+								</ul>
+								<div class="clearfix"></div>
+							</div>
+							<div class="tight-form" style="margin-top: 10px">
+								<ul class="tight-form-list">
+									<li class="tight-form-item" style="width: 80px">
+										<strong>Email</strong>
+									</li>
+									<li>
+										<input type="text" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
+									</li>
+								</ul>
+								<div class="clearfix"></div>
+							</div>
+							<div class="tight-form" style="margin-top: 10px">
+								<ul class="tight-form-list">
+									<li class="tight-form-item" style="width: 80px">
+										<strong>Username</strong>
+									</li>
+									<li>
+										<input type="text" required ng-model="user.login" class="input-xxlarge tight-form-input last" >
+									</li>
+								</ul>
+								<div class="clearfix"></div>
+							</div>
+						</div>
 
-				<form name="userForm">
-
-					<div class="tight-form">
-						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 80px">
-								<strong>Name</strong>
-							</li>
-							<li>
-								<input type="text" required ng-model="user.name" class="input-xxlarge tight-form-input last" >
-							</li>
-						</ul>
-						<div class="clearfix"></div>
-					</div>
-					<div class="tight-form" style="margin-top: 10px">
-						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 80px">
-								<strong>Email</strong>
-							</li>
-							<li>
-								<input type="text" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
-							</li>
-						</ul>
-						<div class="clearfix"></div>
-					</div>
-					<div class="tight-form" style="margin-top: 10px">
-						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 80px">
-								<strong>Username</strong>
-							</li>
-							<li>
-								<input type="text" required ng-model="user.login" class="input-xxlarge tight-form-input last" >
-							</li>
-						</ul>
-						<div class="clearfix"></div>
-					</div>
-
-					<br>
-					<button type="submit" class="btn btn-success" ng-click="update()">Update</button>
-				</form>
+						<br>
+						<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
+					</form>
+				</div>
 			</div>
 		</div>
 
@@ -59,7 +61,7 @@
 			<div class="dashboard-editor-header">
 				<div class="dashboard-editor-title">
 					<i class="fa fa-cubes"></i>
-					 Your accounts
+					Your accounts
 				</div>
 			</div>
 			<br>
@@ -87,7 +89,7 @@
 			<div class="dashboard-editor-header">
 				<div class="dashboard-editor-title">
 					<i class="fa fa-plus-square"></i>
-					 Add account
+					Add account
 				</div>
 			</div>
 			<br>
@@ -111,5 +113,8 @@
 		</div>
 	</div>
 </div>
+	</div>
+</div>
+</div>
 
 

src/app/partials/sidemenu.html

@@ -17,7 +17,7 @@
 		<li ng-repeat-end ng-if="item.active">
 			<ul class="sidemenu-links">
 				<li ng-repeat="link in item.links">
-					<a href="{{link.href}}" class="sidemenu-link"><i class="fa fa-angle-right"></i>{{link.text}}</a>
+					<a href="{{link.href}}" class="sidemenu-link" ng-class="{active: link.active}"><i class="fa fa-angle-right"></i>{{link.text}}</a>
 				</li>
 			</ul>
 		</li>

src/app/routes/backend/all.js

@@ -32,6 +32,7 @@ define([
       })
       .when('/account', {
         templateUrl: 'app/features/account/partials/account.html',
+        controller : 'AccountCtrl',
       })
       .when('/account/datasources', {
         templateUrl: 'app/features/account/partials/datasources.html',

src/css/less/p_pro.less

@@ -1,5 +1,8 @@
 .pro-sidemenu {
   display: none;
+  a:focus {
+    text-decoration: none;
+  }
 }
 
 .pro-sidemenu-open {
@@ -50,9 +53,14 @@
   display: block;
   padding: 6px 0 6px 30px;
   font-size: 15px;
+  color: @gray;
   i {
     padding-right: 15px;
   }
+  &.active {
+    color: white;
+    font-weight: bold;
+  }
 }
 
 .sidemenu-user {