Drop down selector for Connect project instead of text field

#443

configuration.md

@@ -35,6 +35,7 @@ The following config parameters are supported, they are defined in `src/config.j
 |AWS_CONNECTION_TIMEOUT | The timeout used to check if the app is healthy. |10000 |
 |TC_LOGIN_URL | TC login url | |
 |DYNAMODB_WAIT_TABLE_FOR_ACTIVE_TIMEOUT | Dynamodb wait for active timeout |10 minutes |
+|TC_API_V5_URL | Topcoder API v5 url for retrieving list of Connect Projects | |
 
 
 ## GitHub OAuth App Setup

src/config.js

@@ -83,4 +83,5 @@ module.exports.frontendConfigs = {
   TOPCODER_URL: process.env.TOPCODER_URL || 'https://topcoder-dev.com',
   GITHUB_TEAM_URL: process.env.GITHUB_TEAM_URL || 'https://github.com/orgs/',
   GITLAB_GROUP_URL: process.env.GITLAB_GROUP_URL || 'https://gitlab.com/groups/',
+  TC_API_V5_URL: process.env.TC_API_V5_URL || 'https://api.topcoder-dev.com/v5',
 };

src/front/src/app/projects/project.service.js

@@ -6,7 +6,7 @@
 'use strict';
 
 angular.module('topcoderX')
-  .factory('ProjectService', ['Helper', '$http', function (Helper, $http) {
+  .factory('ProjectService', ['Helper', '$http', '$rootScope', 'AuthService', function (Helper, $http, $rootScope, AuthService) {
     // object we will return
     var ProjectService = {};
     var projectsDataPromise = {};
@@ -140,5 +140,50 @@ angular.module('topcoderX')
       });
     };
 
+    /**
+     * Get associated connect projects that the current user has access to
+     */
+    ProjectService.getConnectProjects = function() {
+      function createProjectRequest(pagingParams) {
+        return $http({
+          method: 'GET',
+          url: $rootScope.appConfig.TC_API_V5_URL + '/projects/',
+          headers: {
+            "Content-Type": "application/json",
+            "Authorization": "Bearer " + AuthService.AuthService.getTokenV3()
+          },
+          params: {
+            fields: 'id,name,status',
+            sort: 'lastActivityAt desc',
+            perPage: pagingParams.perPage,
+            page: pagingParams.page
+          }
+        });
+      }
+
+      function getAll(getter, perPage, page, prev) {
+        return getter({
+          perPage: perPage,
+          page: page
+        }).then(function (res) {
+          if (res.status === 200) {
+            var data = res.data;
+            if (!data.length) return prev || [];
+            var current = [];
+            if (prev) {
+              current = prev.concat(data);
+            } else {
+              current = data;
+            }
+            return getAll(getter, perPage, 1 + page, current);
+          }
+          return prev || [];
+        });
+      }
+      return getAll(function (params) { return createProjectRequest(params) }, 20, 1).then(function(response) {
+        return response;
+      });
+    }
+
     return ProjectService;
   }]);

src/front/src/app/upsertproject/upsertproject.controller.js

@@ -40,6 +40,18 @@ angular.module('topcoderX').controller('ProjectController', ['currentUser', '$sc
     }
 
     $scope.isAdminUser = Helper.isAdminUser(currentUser);
+    $scope.loadingConnectProjects = true;
+    ProjectService.getConnectProjects().then(function (result) {
+      $scope.loadingConnectProjects = false;
+      $scope.connectProjects = result.map(function (p) {
+        return {
+          label: 'ID: ' + p.id + ', NAME: ' + p.name + ', STATUS: ' + p.status,
+          value: p.id
+        }
+      });
+    }).catch(function (error) {
+      Alert.error(error.data.message, $scope);
+    });
 
     // function to add labels to the current project.
     $scope.addLabels = function () {

src/front/src/app/upsertproject/upsertproject.html

@@ -56,10 +56,11 @@ <h2>{{title}}</h2>
             <br />
             <br />
             <label class="form-label">Connect ID:</label>
-            <input class="form-control" type="number" ng-model="project.tcDirectId" required />
-            <small class="form-hint">The Topcoder Connect Project ID of the project. You can obtain this through the URL to the
-              project in Topcoder Connect. For example:
-              "https://connect.topcoder.com/projects/16598" - Enter ID "16598"</small>
+            <select ng-options="option.value as option.label for option in connectProjects" ng-model="project.tcDirectId"
+              class="form-control" ng-disabled="loadingConnectProjects" required>
+            </select>
+            <small class="form-hint">Select the Topcoder Connect Project ID of the project. The above list contains all Topcoder Connect Projects
+              you have access to.</small>
             <span ng-show="projectForm.project.tcDirectId.$touched && projectForm.project.tcDirectId.$invalid">The
               TC Connect Project ID is required.</span>
             <br />