diff --git a/app/directives/challenge-links/challenge-links.jade b/app/directives/challenge-links/challenge-links.jade
index 85c5c7954..cdb50febc 100644
--- a/app/directives/challenge-links/challenge-links.jade
+++ b/app/directives/challenge-links/challenge-links.jade
@@ -1,10 +1,10 @@
 .challenge-links(ng-class="view + '-view'")
-  a.registrants(ng-href="{{challenge|challengeLinks:'registrants'}}", ng-switch="challenge.subTrack")
+  a.registrants(ng-href="{{challenge|challengeLinks:'registrants'}}", ng-switch="challenge.subTrack", target="_self")
     .icon.registrants-icon
     p(ng-switch-when="MARATHON_MATCH") {{challenge.numRegistrants[0]}}
     p(ng-switch-default) {{challenge.numRegistrants}}
 
-  a.submissions(ng-hide="challenge.track === 'DATA_SCIENCE'", ng-href="{{challenge|challengeLinks:'submissions'}}")
+  a.submissions(ng-hide="challenge.track === 'DATA_SCIENCE'", ng-href="{{challenge|challengeLinks:'submissions'}}", target="_self")
     .icon.submissions-icon
     p {{challenge.numSubmissions}}
 
diff --git a/app/index.js b/app/index.js
index a11c18e81..56c242efa 100644
--- a/app/index.js
+++ b/app/index.js
@@ -22,6 +22,7 @@ require('angucomplete-alt')
 require('angularjs-toaster')
 require('ng-dialog')
 require('xml2js')
+require('ngreact')
 
 require('appirio-tech-ng-ui-components')
 require('appirio-tech-ng-iso-constants')
diff --git a/app/listings/listings.controller.js b/app/listings/listings.controller.js
new file mode 100644
index 000000000..5ed5eae6a
--- /dev/null
+++ b/app/listings/listings.controller.js
@@ -0,0 +1,23 @@
+import angular from 'angular'
+
+(function () {
+  'use strict'
+
+  angular.module('tc.listings').controller('ListingsCtrl', ListingsCtrl)
+
+  ListingsCtrl.$inject = ['CONSTANTS', 'logger', '$q',
+    'TcAuthService', 'UserService', 'UserStatsService', 'ProfileService', 'ChallengeService', 'ExternalAccountService',
+    'ngDialog', '$anchorScroll'
+  ]
+
+  function ListingsCtrl(CONSTANTS, logger, $q, TcAuthService, UserService, UserStatsService, ProfileService, ChallengeService, ExternalAccountService, ngDialog, $anchorScroll) {
+
+    activate()
+
+    function activate() {
+      logger.debug('Calling ListingsController activate()')
+
+    }
+  }
+
+})()
diff --git a/app/listings/listings.jade b/app/listings/listings.jade
new file mode 100644
index 000000000..1774c70e3
--- /dev/null
+++ b/app/listings/listings.jade
@@ -0,0 +1 @@
+react-component(name="ChallengeFiltersExample")
diff --git a/app/listings/listings.module.js b/app/listings/listings.module.js
new file mode 100644
index 000000000..102cdcab2
--- /dev/null
+++ b/app/listings/listings.module.js
@@ -0,0 +1,21 @@
+import angular from 'angular'
+import { ChallengeFiltersExample } from 'appirio-tech-react-components'
+
+(function() {
+  'use strict'
+
+  var dependencies = [
+    'angular-jwt',
+    'ui.router',
+    'ngCookies',
+    'tc.services',
+    'tcUIComponents',
+    'angularSlideables',
+    'ngDialog',
+    'react'
+  ]
+
+  angular.module('tc.listings', dependencies)
+         .value('ChallengeFiltersExample', ChallengeFiltersExample.default)
+
+})()
diff --git a/app/listings/listings.routes.js b/app/listings/listings.routes.js
new file mode 100644
index 000000000..bffcc1672
--- /dev/null
+++ b/app/listings/listings.routes.js
@@ -0,0 +1,43 @@
+import angular from 'angular'
+
+(function() {
+  'use strict'
+
+  angular.module('tc.listings').config([
+    '$stateProvider',
+    routes
+  ]).run(['$rootScope', '$state', function($rootScope, $state) {
+    $rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error) {
+//      if (toState.name.indexOf('sloog') > -1 && 400 <= error.status <= 500 ) {
+//
+//        // unable to find a member with that username
+//        $state.go('404')
+//      }
+    })
+  }])
+
+  function routes($stateProvider) {
+    var states = {
+      'listings': {
+        parent: 'root',
+        url: '/listings/',
+        template: require('./listings')(),
+        controller: 'ListingsCtrl as vm',
+        resolve: {
+          userHandle: ['$stateParams', function($stateParams) {
+            return $stateParams.userHandle
+          }]
+        },
+        data: {
+          authRequired: false,
+          title: 'Listings'
+        }
+      }
+    }
+
+    for (var name in states) {
+      var state = states[name]
+      $stateProvider.state(name, state)
+    }
+  }
+})()
diff --git a/app/my-challenges/my-challenges.controller.js b/app/my-challenges/my-challenges.controller.js
index b30fe3731..d8623372c 100644
--- a/app/my-challenges/my-challenges.controller.js
+++ b/app/my-challenges/my-challenges.controller.js
@@ -146,6 +146,14 @@ import _ from 'lodash'
       vm.getChallenges(currentOffset, false)
     }
 
+    window.onscroll = function() {
+      if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
+        if (vm.totalCount > vm.myChallenges.length) {
+          vm.loadMore()
+        }
+      }
+    }
+
     function _checkForParticipation() {
       return ChallengeService.checkChallengeParticipation(vm.handle, function(participated) {
         vm.neverParticipated = !participated
diff --git a/app/my-challenges/my-challenges.jade b/app/my-challenges/my-challenges.jade
index 652af8165..644a84e4b 100644
--- a/app/my-challenges/my-challenges.jade
+++ b/app/my-challenges/my-challenges.jade
@@ -1,6 +1,6 @@
 .my-challenges-container
   .my-challenges
-    
+
     .page-header
       page-state-header(handle="{{vm.handle}}", page-title="My Challenges", hide-money="true", show-back-link="true", default-state="dashboard")
 
@@ -26,10 +26,7 @@
 
         .hasChallenges(ng-show="vm.myChallenges.length", state="vm.loading")
 
-          .data(ng-class="vm.view + '-view'")                      
+          .data(ng-class="vm.view + '-view'")
             challenge-tile(
-              ng-repeat="challenge in vm.myChallenges | orderBy:vm.orderBy:true", 
+              ng-repeat="challenge in vm.myChallenges | orderBy:vm.orderBy:true",
               challenge="challenge", view="vm.view", ng-class="vm.view + '-view'")
-
-          tc-section.load-more-section(state="vm.loading")
-              button.tc-btn(ng-show="vm.totalCount > vm.myChallenges.length", ng-click="vm.loadMore()") Load More
diff --git a/app/my-dashboard/header-dashboard/header-dashboard.spec.js b/app/my-dashboard/header-dashboard/header-dashboard.spec.js
index ea69e934a..d88fb4ed5 100644
--- a/app/my-dashboard/header-dashboard/header-dashboard.spec.js
+++ b/app/my-dashboard/header-dashboard/header-dashboard.spec.js
@@ -3,10 +3,7 @@ const mockData = require('../../../tests/test-helpers/mock-data')
 
 /* jshint -W117, -W030 */
 describe('Header Dashboard Controller', function() {
-  var userService, profileService, identity
   var profile = mockData.getMockProfile()
-  var stats = mockData.getMockStats()
-  var financials = mockData.getMockUserFinancials()
 
   beforeEach(function() {
     bard.appModule('topcoder')
@@ -14,45 +11,7 @@ describe('Header Dashboard Controller', function() {
       '$controller',
       '$rootScope',
       '$q',
-      'UserService',
-      'ProfileService',
       'Helpers')
-
-    userService = UserService
-    profileService = ProfileService
-
-    identity = function() {
-      return {
-        handle: 'albertwang',
-        userId: 123456
-      }
-    }
-
-    // mock user api
-    sinon.stub(userService, 'getUserIdentity', function() {
-      return {
-        userId: 1234567,
-        handle: 'ut',
-        email: 'ut@topcoder.com'
-      }
-    })
-
-    // mock profile api
-    sinon.stub(profileService, 'getUserProfile', function(handle) {
-      var deferred = $q.defer()
-      deferred.resolve(profile)
-      return deferred.promise
-    })
-    sinon.stub(profileService, 'getUserStats', function(handle) {
-      var deferred = $q.defer()
-      deferred.resolve(stats)
-      return deferred.promise
-    })
-    sinon.stub(profileService, 'getUserFinancials', function(handle) {
-      var deferred = $q.defer()
-      deferred.resolve(financials)
-      return deferred.promise
-    })
   })
 
   bard.verifyNoOutstandingHttpRequests()
@@ -61,33 +20,6 @@ describe('Header Dashboard Controller', function() {
     var controller = null
     beforeEach( function(){
       controller = $controller('HeaderDashboardController', {
-        UserService : userService,
-        ProfileService: profileService,
-        userIdentity: identity,
-        profile: profile
-      })
-      $rootScope.$apply()
-    })
-
-    it('variables should be initialized to correct value', function() {
-      expect(controller.profile).to.exist
-      expect(controller.profile.handle).to.equal('albertwang')
-    })
-  })
-
-  describe('inialization with profile api stats endpoint error', function() {
-    var controller = null
-    beforeEach( function(){
-      profileService.getUserStats.restore()
-      sinon.stub(profileService, 'getUserStats', function(handle) {
-        var deferred = $q.defer()
-        deferred.reject('failed')
-        return deferred.promise
-      })
-      controller = $controller('HeaderDashboardController', {
-        UserService : userService,
-        ProfileService: profileService,
-        userIdentity: identity,
         profile: profile
       })
       $rootScope.$apply()
@@ -99,27 +31,17 @@ describe('Header Dashboard Controller', function() {
     })
   })
 
-  describe('inialization with profile api profile endpoint error', function() {
+  describe('inialization with null profile', function() {
     var controller = null
     beforeEach( function(){
-      profileService.getUserProfile.restore()
-      sinon.stub(profileService, 'getUserProfile', function(handle) {
-        var deferred = $q.defer()
-        deferred.reject('failed')
-        return deferred.promise
-      })
       controller = $controller('HeaderDashboardController', {
-        UserService : userService,
-        ProfileService: profileService,
-        userIdentity: identity,
-        profile: profileService.getUserProfile()
+        profile: null
       })
       $rootScope.$apply()
     })
 
     it('variables should be initialized to correct value', function() {
-      expect(controller.profile.$$state.status).to.equal(2)
-      expect(controller.profile.$$state.value).to.equal('failed')
+      expect(controller.profile).to.be.null
     })
   })
 
diff --git a/app/profile/badges/badges.jade b/app/profile/badges/badges.jade
index 205077f18..74b9d48d5 100644
--- a/app/profile/badges/badges.jade
+++ b/app/profile/badges/badges.jade
@@ -1,4 +1,5 @@
 header.head
+  .ngdialog-close
   .breadcrumbs
     .handle
       img.profile-circle(fallback-src=require("../../../assets/images/avatarPlaceholder.png"), ng-src="{{vm.profile.photoURL}}")
diff --git a/app/services/externalAccounts.service.js b/app/services/externalAccounts.service.js
index 7e2417ccc..f4ac09a1f 100644
--- a/app/services/externalAccounts.service.js
+++ b/app/services/externalAccounts.service.js
@@ -194,7 +194,7 @@ import _ from 'lodash'
         } else {
           logger.error('Unsupported social login backend', provider)
 
-          $q.reject({
+          reject({
             status: 'failed',
             'error': 'Unsupported social login backend \'' + provider + '\''
           })
diff --git a/app/services/externalAccounts.service.spec.js b/app/services/externalAccounts.service.spec.js
index 662a7116d..dc6b10926 100644
--- a/app/services/externalAccounts.service.spec.js
+++ b/app/services/externalAccounts.service.spec.js
@@ -14,7 +14,7 @@ describe('ExternalAccount Service', function() {
 
   beforeEach(function() {
     bard.appModule('topcoder')
-    bard.inject(this, 'ExternalAccountService', '$httpBackend', '$q', 'CONSTANTS', 'JwtInterceptorService', 'auth', 'UserService')
+    bard.inject(this, 'ExternalAccountService', '$httpBackend', '$q', 'CONSTANTS', 'JwtInterceptorService', 'auth', 'UserService', '$rootScope')
     bard.mockService(JwtInterceptorService, {
       getToken: $q.when('token'),
       _default:    $q.when([])
@@ -61,179 +61,186 @@ describe('ExternalAccount Service', function() {
 
   })
 
-  afterEach(function() {
-    $httpBackend.verifyNoOutstandingExpectation()
-    $httpBackend.verifyNoOutstandingRequest()
-  })
-
-  it('service should be defined', function() {
-    expect(service).to.be.defined
-  })
-
-  it('should return linked external accounts', function() {
-    service.getLinkedAccounts(111).then(function(data) {
-      expect(data).to.have.length(5)
-    })
-    $httpBackend.flush()
-  })
-
-  it('should return linked external accounts data', function() {
-    service.getAccountsData('test1').then(function(data) {
-      data = data.plain()
-      expect(data).to.be.defined
-      expect(_.keys(data)).to.include.members(['dribbble', 'github', 'behance', 'bitbucket', 'linkedin', 'stackoverflow', 'twitter'])
-    })
-    $httpBackend.flush()
-  })
-
-  it('should return all non-pending external links', function() {
-    // spy
-    service.getAllExternalLinks('test1', 111, false).then(function(data) {
-      expect(data).to.be.defined
-      expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github','bitbucket', 'stackoverflow'])
-      expect(_.every(_.map(data, 'data'))).to.be.truthy
-    })
-    $httpBackend.flush()
-  })
-
-  it('should return all external links including pending', function() {
-    // spy
-    service.getAllExternalLinks('test1', 111, true).then(function(data) {
-      expect(data).to.be.defined
-      expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github', 'behance', 'bitbucket','stackoverflow'])
-      expect(data).to.have.length(5)
-      var nullAccounts = _.remove(data, function(n) {return n.data.status === 'PENDING'})
-      expect(nullAccounts).to.have.length(1)
+  describe('should call api ', function() {
+
+    afterEach(function() {
+      $httpBackend.verifyNoOutstandingExpectation()
+      $httpBackend.verifyNoOutstandingRequest()
+    })
+
+    it('service should be defined', function() {
+      expect(service).to.be.defined
+    })
+
+    it('should return linked external accounts', function() {
+      service.getLinkedAccounts(111).then(function(data) {
+        expect(data).to.have.length(5)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should return linked external accounts data', function() {
+      service.getAccountsData('test1').then(function(data) {
+        data = data.plain()
+        expect(data).to.be.defined
+        expect(_.keys(data)).to.include.members(['dribbble', 'github', 'behance', 'bitbucket', 'linkedin', 'stackoverflow', 'twitter'])
+      })
+      $httpBackend.flush()
+    })
+
+    it('should return all non-pending external links', function() {
+      // spy
+      service.getAllExternalLinks('test1', 111, false).then(function(data) {
+        expect(data).to.be.defined
+        expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github','bitbucket', 'stackoverflow'])
+        expect(_.every(_.map(data, 'data'))).to.be.truthy
+      })
+      $httpBackend.flush()
+    })
+
+    it('should return all external links including pending', function() {
+      // spy
+      service.getAllExternalLinks('test1', 111, true).then(function(data) {
+        expect(data).to.be.defined
+        expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github', 'behance', 'bitbucket','stackoverflow'])
+        expect(data).to.have.length(5)
+        var nullAccounts = _.remove(data, function(n) {return n.data.status === 'PENDING'})
+        expect(nullAccounts).to.have.length(1)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should not return unsupported links even if they are returned by the API', function() {
+      var profiles = JSON.parse(JSON.stringify(mockUserLinksData))
+      profiles.profiles.push({providerType: 'unsupported'})
+      profileGet.respond(200, {result: {content: profiles}})
+      // spy
+      service.getAllExternalLinks('test1', 111, true).then(function(data) {
+        expect(data).to.be.defined
+        expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github','bitbucket', 'stackoverflow'])
+        expect(_.every(_.map(data, 'data'))).to.be.truthy
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail in returning links', function() {
+      var errorMessage = 'bad request'
+      // mocks the GET call to respond with 400 bad request
+      profileGet.respond(400, {result:  { status: 400, content: errorMessage } })
+      // calls getAllExternalLinks method with valid params
+      service.getAllExternalLinks('test1', 111, true).then(function(data) {
+        sinon.assert.fail('should not be called')
+      }).catch(function(resp) {
+        expect(resp).to.exist
+        expect(resp.status).to.exist.to.equal(400)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should link external account', function() {
+      // call linkExternalAccount method with supporte network, should succeed
+      service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
+        expect(data).to.be.defined
+        // console.log(data)
+        expect(data.status).to.exist.to.equal('SUCCESS')
+        expect(data.linkedAccount).to.exist
+        expect(data.linkedAccount.provider).to.exist.to.equal('stackoverflow')
+        expect(data.linkedAccount.data).to.exist
+        expect(data.linkedAccount.data.status).to.exist.to.equal('PENDING')
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail with already existing profile', function() {
+      var errorMessage = 'social profile exists'
+      profilePost.respond(400, {result:  { status: 400, content: errorMessage } })
+      // call linkExternalAccount method, having user service throw already exist
+      service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
+        sinon.assert.fail('should not be called')
+      }, function(error) {
+        expect(error).to.be.defined
+        expect(error.status).to.exist.to.equal('SOCIAL_PROFILE_ALREADY_EXISTS')
+        expect(error.msg).to.exist.to.equal(errorMessage)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail with auth0 error', function() {
+      // call linkExternalAccount method with auth0 throwing error
+      service.linkExternalAccount('stackoverflow', 'failure').then(function(data) {
+        sinon.assert.fail('should not be called')
+      }, function(error) {
+        expect(error).to.be.exist.to.equal('MOCK_ERROR')
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail, with fatal error, in linking external account', function() {
+      var errorMessage = 'endpoint not found'
+      profilePost.respond(404, {result:  { status: 404, content: errorMessage } })
+      // call unlinkExternalAccount method with supporte network, should succeed
+      service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
+        sinon.assert.fail('should not be called')
+      }).catch(function(error) {
+        expect(error).to.be.defined
+        expect(error.status).to.exist.to.equal('FATAL_ERROR')
+        expect(error.msg).to.exist.to.equal(errorMessage)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should unlink external account', function() {
+      var errorMessage = 'social profile exists'
+      profilePost.respond(400, {result:  { status: 400, content: errorMessage } })
+      // call unlinkExternalAccount method with supporte network, should succeed
+      service.unlinkExternalAccount('stackoverflow').then(function(data) {
+        expect(data).to.be.defined
+        // console.log(data)
+        expect(data.status).to.exist.to.equal('SUCCESS')
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail, with profile does not exist, in unlinking external account', function() {
+      var errorMessage = 'social profile does not exists'
+      profileDelete.respond(404, {result:  { status: 404, content: errorMessage } })
+      // call unlinkExternalAccount method with supporte network, should succeed
+      service.unlinkExternalAccount('stackoverflow').then(function(data) {
+        sinon.assert.fail('should not be called')
+      }).catch(function(error) {
+        expect(error).to.be.defined
+        expect(error.status).to.exist.to.equal('SOCIAL_PROFILE_NOT_EXIST')
+        expect(error.msg).to.exist.to.equal(errorMessage)
+      })
+      $httpBackend.flush()
+    })
+
+    it('should fail, with fatal error, in unlinking external account', function() {
+      var errorMessage = 'bad request'
+      profileDelete.respond(400, {result:  { status: 400, content: errorMessage } })
+      // call unlinkExternalAccount method with supporte network, should succeed
+      service.unlinkExternalAccount('stackoverflow').then(function(data) {
+        sinon.assert.fail('should not be called')
+      }).catch(function(error) {
+        expect(error).to.be.defined
+        expect(error.status).to.exist.to.equal('FATAL_ERROR')
+        expect(error.msg).to.exist.to.equal(errorMessage)
+      })
+      $httpBackend.flush()
     })
-    $httpBackend.flush()
-  })
 
-  it('should not return unsupported links even if they are returned by the API', function() {
-    var profiles = JSON.parse(JSON.stringify(mockUserLinksData))
-    profiles.profiles.push({providerType: 'unsupported'})
-    profileGet.respond(200, {result: {content: profiles}})
-    // spy
-    service.getAllExternalLinks('test1', 111, true).then(function(data) {
-      expect(data).to.be.defined
-      expect(_.map(data, 'provider')).to.include.members(['dribbble', 'github','bitbucket', 'stackoverflow'])
-      expect(_.every(_.map(data, 'data'))).to.be.truthy
-    })
-    $httpBackend.flush()
-  })
-
-  it('should fail in returning links', function() {
-    var errorMessage = 'bad request'
-    // mocks the GET call to respond with 400 bad request
-    profileGet.respond(400, {result:  { status: 400, content: errorMessage } })
-    // calls getAllExternalLinks method with valid params
-    service.getAllExternalLinks('test1', 111, true).then(function(data) {
-      sinon.assert.fail('should not be called')
-    }).catch(function(resp) {
-      expect(resp).to.exist
-      expect(resp.status).to.exist.to.equal(400)
-    })
-    $httpBackend.flush()
-  })
-
-  it('should link external account', function() {
-    // call linkExternalAccount method with supporte network, should succeed
-    service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
-      expect(data).to.be.defined
-      // console.log(data)
-      expect(data.status).to.exist.to.equal('SUCCESS')
-      expect(data.linkedAccount).to.exist
-      expect(data.linkedAccount.provider).to.exist.to.equal('stackoverflow')
-      expect(data.linkedAccount.data).to.exist
-      expect(data.linkedAccount.data.status).to.exist.to.equal('PENDING')
-    })
-    $httpBackend.flush()
   })
 
   it('should fail with unsupported network', function() {
     // call linkExternalAccount method with unsupported network, should fail
-    service.linkExternalAccount('unsupported', 'callback').then(function(data) {
-      expect(data).to.be.defined
-      expect(data.status).to.exist.to.equal('failed')
-      expect(data.error.to.contain('unsupported'))
-    })
-  })
-
-  it('should fail with already existing profile', function() {
-    var errorMessage = 'social profile exists'
-    profilePost.respond(400, {result:  { status: 400, content: errorMessage } })
-    // call linkExternalAccount method, having user service throw already exist
-    service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
-      sinon.assert.fail('should not be called')
-    }, function(error) {
-      expect(error).to.be.defined
-      expect(error.status).to.exist.to.equal('SOCIAL_PROFILE_ALREADY_EXISTS')
-      expect(error.msg).to.exist.to.equal(errorMessage)
-    })
-    $httpBackend.flush()
-  })
-
-  it('should fail with auth0 error', function() {
-    // call linkExternalAccount method with auth0 throwing error
-    service.linkExternalAccount('stackoverflow', 'failure').then(function(data) {
-      sinon.assert.fail('should not be called')
-    }, function(error) {
-      expect(error).to.be.exist.to.equal('MOCK_ERROR')
-    })
-    $httpBackend.flush()
-  })
-
-  it('should fail, with fatal error, in linking external account', function() {
-    var errorMessage = 'endpoint not found'
-    profilePost.respond(404, {result:  { status: 404, content: errorMessage } })
-    // call unlinkExternalAccount method with supporte network, should succeed
-    service.linkExternalAccount('stackoverflow', 'callback').then(function(data) {
-      sinon.assert.fail('should not be called')
-    }).catch(function(error) {
-      expect(error).to.be.defined
-      expect(error.status).to.exist.to.equal('FATAL_ERROR')
-      expect(error.msg).to.exist.to.equal(errorMessage)
-    })
-    $httpBackend.flush()
-  })
-
-  it('should unlink external account', function() {
-    var errorMessage = 'social profile exists'
-    profilePost.respond(400, {result:  { status: 400, content: errorMessage } })
-    // call unlinkExternalAccount method with supporte network, should succeed
-    service.unlinkExternalAccount('stackoverflow').then(function(data) {
-      expect(data).to.be.defined
-      // console.log(data)
-      expect(data.status).to.exist.to.equal('SUCCESS')
-    })
-    $httpBackend.flush()
-  })
-
-  it('should fail, with profile does not exist, in unlinking external account', function() {
-    var errorMessage = 'social profile does not exists'
-    profileDelete.respond(404, {result:  { status: 404, content: errorMessage } })
-    // call unlinkExternalAccount method with supporte network, should succeed
-    service.unlinkExternalAccount('stackoverflow').then(function(data) {
+    var promise = service.linkExternalAccount('unsupported', 'callback')
+    promise.then(function(data) {
       sinon.assert.fail('should not be called')
-    }).catch(function(error) {
-      expect(error).to.be.defined
-      expect(error.status).to.exist.to.equal('SOCIAL_PROFILE_NOT_EXIST')
-      expect(error.msg).to.exist.to.equal(errorMessage)
-    })
-    $httpBackend.flush()
-  })
-
-  it('should fail, with fatal error, in unlinking external account', function() {
-    var errorMessage = 'bad request'
-    profileDelete.respond(400, {result:  { status: 400, content: errorMessage } })
-    // call unlinkExternalAccount method with supporte network, should succeed
-    service.unlinkExternalAccount('stackoverflow').then(function(data) {
-      sinon.assert.fail('should not be called')
-    }).catch(function(error) {
-      expect(error).to.be.defined
-      expect(error.status).to.exist.to.equal('FATAL_ERROR')
-      expect(error.msg).to.exist.to.equal(errorMessage)
+    }, function(resp) {
+      expect(resp).to.exist
+      expect(resp.status).to.exist.to.equal('failed')
     })
-    $httpBackend.flush()
+    $rootScope.$apply()
   })
 
 })
diff --git a/app/topcoder.module.js b/app/topcoder.module.js
index d8fdfee83..d2bbce8b2 100644
--- a/app/topcoder.module.js
+++ b/app/topcoder.module.js
@@ -10,6 +10,7 @@ import { getCurrentUser, loadUser } from './services/userv3.service.js'
     'tc.account',
     'tc.peer-review',
     'tc.myDashboard',
+    'tc.listings',
     'tc.mySRMs',
     'tc.myChallenges',
     'tc.profile',
diff --git a/assets/css/community/members.scss b/assets/css/community/members.scss
index d2ae25751..019cb6999 100644
--- a/assets/css/community/members.scss
+++ b/assets/css/community/members.scss
@@ -65,6 +65,9 @@
       color: #a3a3ae;
       font-size: 12px;
       font-weight: 400;
+      @media only screen and (max-width: 768px) {
+        font-size: 5vw;
+      }
     }
   }
 
diff --git a/assets/css/directives/design-lightbox.scss b/assets/css/directives/design-lightbox.scss
index c8c0d928b..d8c67eafe 100644
--- a/assets/css/directives/design-lightbox.scss
+++ b/assets/css/directives/design-lightbox.scss
@@ -67,12 +67,18 @@
   justify-content: center;
   z-index: 10000;
   .ngdialog-content {
-    .ngdialog-close { 
+    .ngdialog-close {
+      display: none;
       position: absolute;
       top: 5px;
       right: 15px;
       font-size: 30px;
     }
+    .head {
+      .ngdialog-close {
+        display: block;
+      }
+    }
     opacity: .95;
     height: 742px;
     width: 768px;
diff --git a/assets/css/profile/badges.scss b/assets/css/profile/badges.scss
index 8b9abf289..77c6ac89b 100644
--- a/assets/css/profile/badges.scss
+++ b/assets/css/profile/badges.scss
@@ -17,6 +17,7 @@
       @include sofia-pro-extra-light;
       font-size: 28px;
       line-height: 34px;
+      position: relative;
       span {
         display: inline;
         &.title {
diff --git a/assets/css/profile/nav.scss b/assets/css/profile/nav.scss
index 9df8832b8..03580ddcf 100644
--- a/assets/css/profile/nav.scss
+++ b/assets/css/profile/nav.scss
@@ -32,8 +32,8 @@
   border-radius: 5px;
   cursor: pointer;
   position: absolute;
-  right: 0;
-  top: 0;
+  right: -30px;
+  top: -20px;
 }
 
 .ngdialog.ngdialog-nav-theme .ngdialog-close:before {
diff --git a/package.json b/package.json
index 72c20d151..764083137 100644
--- a/package.json
+++ b/package.json
@@ -56,11 +56,12 @@
     "appirio-styles": "0.x.x",
     "appirio-tech-ng-iso-constants": "^1.0.6",
     "appirio-tech-ng-ui-components": "^2.1.2",
-    "appirio-tech-react-components": "^0.0.12",
+    "appirio-tech-react-components": "appirio-tech/react-components.git#challenge-listings",
     "auth0-angular": "^4.1.0",
     "auth0-js": "^6.8.0",
     "d3": "^3.5.14",
     "font-awesome": "^4.5.0",
+    "html-webpack-plugin": "^2.26.0",
     "intro.js": "^1.1.1",
     "jstimezonedetect": "^1.0.6",
     "lodash": "^4.5.0",
@@ -69,10 +70,10 @@
     "ng-dialog": "^0.5.6",
     "react-select": "1.0.0-beta8",
     "restangular": "^1.5.2",
+    "tc-accounts": "https://github.com/appirio-tech/accounts-app.git#0.0.7",
     "tc-angular-ellipsis": "^0.1.6",
     "topcoder-app-r": "^1.0.0",
     "xml2js": "^0.4.16",
-    "zepto": "1.0.1",
-    "tc-accounts": "https://github.com/appirio-tech/accounts-app.git#0.0.7"
+    "zepto": "1.0.1"
   }
 }