feat: add user page in admin

public/partials/admin/user.htm

@@ -0,0 +1,257 @@
+<div class="container page">
+  <div class="row">
+    <h1>
+      <img ng-src="{{userInfo.photo}}" ng-if="userInfo.photo" width="30" height="30" class="rounded-circle ng-scope">
+      {{userInfo.username}}
+      <span class="badge"><span ng-bind="userInfo.status | title"></span>
+    </h1>
+    <div class="row mb-3 m-0 py-2 border">
+      <div class="col-2 font-weight-bold">ID</div>
+      <div class="col-10">{{userInfo._id}}</div>
+
+      <div class="col-2 font-weight-bold">Email</div>
+      <div class="col-10">{{userInfo.emails[0].email}}</div>
+
+      <div class="col-2 font-weight-bold">accessTokens</div>
+      <div class="col-10">{{userInfo.accessTokens.github}}</div>
+
+      <div class="col-2 font-weight-bold">Github</div>
+      <div class="col-10"><a ng-href="https://github.com/{{userInfo.username}}">{{userInfo.username}}</a></div>
+
+      <div class="col-2 font-weight-bold">Github Repositories</div>
+      <div class="col-10">{{userInfo.repositories.length}}</a></div>
+    </div>
+    
+    <h3>Repositories {{repositories.length}}</h3>
+    <div class="border-bottom color-border-secondary py-3 w-100">
+      <div class="d-flex flex-items-start w-100">
+        <form class="w-100" aria-label="Repositories" accept-charset="UTF-8">
+          <div class="d-flex flex-column flex-lg-row flex-auto">
+            <div class="mb-1 mb-md-0 mr-md-3">
+              <input
+                type="search"
+                id="search"
+                class="form-control"
+                aria-label="Find repositories"
+                placeholder="Find repositories"
+                autocomplete="off"
+                ng-model="search"
+              />
+            </div>
+
+            <div class="d-flex flex-wrap">
+              <div class="dropdown mt-1 mt-lg-0 mr-1">
+                <button
+                  class="btn btn-secondary dropdown-toggle"
+                  type="button"
+                  id="dropdownSort"
+                  data-toggle="dropdown"
+                  aria-haspopup="true"
+                  aria-expanded="false"
+                >
+                  Sort
+                </button>
+                <div class="dropdown-menu" aria-labelledby="dropdownSort">
+                  <h6 class="dropdown-header">Select order</h6>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="radio"
+                      name="sort"
+                      id="anonymizeDate"
+                      value="-anonymizeDate"
+                      ng-model="orderBy"
+                    />
+                    <label class="form-check-label" for="anonymizeDate">
+                      Anonymize Date
+                    </label>
+                  </div>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="radio"
+                      name="sort"
+                      id="sortID"
+                      value="repoId"
+                      ng-model="orderBy"
+                    />
+                    <label class="form-check-label" for="sortID"> ID </label>
+                  </div>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="radio"
+                      name="sort"
+                      id="sortStatus"
+                      value="-status"
+                      ng-model="orderBy"
+                    />
+                    <label class="form-check-label" for="sortStatus">
+                      Status
+                    </label>
+                  </div>
+                </div>
+              </div>
+
+              <div class="dropdown mt-1 mt-lg-0 mr-1">
+                <button
+                  class="btn btn-secondary dropdown-toggle"
+                  type="button"
+                  id="dropdownStatus"
+                  data-toggle="dropdown"
+                  aria-haspopup="true"
+                  aria-expanded="false"
+                >
+                  Status
+                </button>
+                <div class="dropdown-menu" aria-labelledby="dropdownStatus">
+                  <h6 class="dropdown-header">Select status</h6>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="checkbox"
+                      name="sort"
+                      id="statusReady"
+                      value="ready"
+                      ng-model="filters.status.ready"
+                    />
+                    <label class="form-check-label" for="statusReady">
+                      Ready
+                    </label>
+                  </div>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="checkbox"
+                      name="sort"
+                      id="statusExpired"
+                      value="expired"
+                      ng-model="filters.status.expired"
+                    />
+                    <label class="form-check-label" for="statusExpired">
+                      Expired
+                    </label>
+                  </div>
+                  <div class="form-check dropdown-item">
+                    <input
+                      class="form-check-input"
+                      type="checkbox"
+                      name="sort"
+                      id="statusRemoved"
+                      value="removed"
+                      ng-model="filters.status.removed"
+                    />
+                    <label class="form-check-label" for="statusRemoved">
+                      Removed
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </form>
+        <div
+          class="d-none d-md-flex flex-md-items-center flex-md-justify-end"
+        ></div>
+      </div>
+    </div>
+    <ul class="p-0 m-0 w-100">
+      <li
+        class="col-12 d-flex px-0 py-3 border-bottom color-border-secondary"
+        ng-class="{'expired': repo.status == 'expired','removed': repo.status == 'removed' }"
+        ng-repeat="repo in repositories| filter:repoFiler| orderBy:orderBy as filteredRepositories"
+      >
+        <div class="w-100">
+          <div class="">
+            <h3>
+              <a ng-href="/r/{{repo.repoId}}" ng-bind="repo.repoId"></a>
+              <span
+                class="badge"
+                ng-class="{'badge-warning': repo.status == 'removed' || repo.status == 'expired', 'badge-success': repo.status == 'ready', 'badge-danger': ''}"
+                ng-bind="repo.status | title"
+              ></span>
+            </h3>
+            <span class="color-text-secondary mb-1">
+              <span class="repository">
+                <i class="fab fa-github" aria-hidden="true"></i>
+                <a
+                  href="https://github.com/{{repo.source.fullName}}/"
+                  class="fullName"
+                  ng-bind="repo.source.fullName"
+                ></a>
+              </span>
+              <span class="branch" ng-if="repo.options.update">
+                <i class="fas fa-code-branch" aria-hidden="true"></i>
+                <a
+                  href="https://github.com/{{repo.source.fullName}}/tree/{{repo.source.branch}}"
+                  class="branch"
+                  ng-bind="repo.source.branch"
+                ></a>
+              </span>
+              <span class="commit" ng-if="!repo.options.update">
+                @<a
+                  href="https://github.com/{{repo.source.fullName}}/tree/{{repo.source.commit}}"
+                  class="commit"
+                  ng-bind="repo.source.commit.substring(0, 8)"
+                ></a>
+              </span>
+              anonymized {{repo.anonymizeDate | humanTime}}
+            </span>
+          </div>
+          <div class="color-text-secondary mt-2">
+            <span
+              class="ml-0 mr-3"
+              class="terms"
+              title="Terms: {{::repo.options.terms.join(', ')}}"
+              data-toggle="tooltip"
+              data-placement="bottom"
+            >
+              <i class="fas fa-shield-alt"></i>
+              {{::repo.options.terms.length | number}}
+            </span>
+            <span
+              class="ml-0 mr-3"
+              title="Size: {{::repo.size | humanFileSize}}"
+              data-toggle="tooltip"
+              data-placement="bottom"
+            >
+              <i class="fas fa-database"></i> {{::repo.size.storage |
+              humanFileSize}}</span
+            >
+            <span
+              class="ml-0 mr-3"
+              title="View: {{::repo.pageView | number}}"
+              data-toggle="tooltip"
+              data-placement="bottom"
+            >
+              <i class="far fa-eye" aria-hidden="true"></i>
+              {{::repo.pageView | number}}
+            </span>
+            <span
+              class="ml-0 mr-3"
+              title="Last view: {{::repo.lastView | date}}"
+              data-toggle="tooltip"
+              data-placement="bottom"
+            >
+              <i class="far fa-calendar-alt" aria-hidden="true"></i>
+              Last view: {{::repo.lastView | humanTime}}</span
+            >
+            <span
+              class="ml-0 mr-3"
+              ng-if="repo.options.expirationMode!='never' && repo.status == 'ready'"
+            >
+              <i class="far fa-clock" aria-hidden="true"></i>
+              Expire: {{repo.options.expirationDate | humanTime}}</span
+            >
+          </div>
+        </div>
+      </li>
+      <li
+        class="col-12 d-flex px-0 py-3 border-bottom color-border-secondary"
+        ng-if="filteredRepositories.length == 0"
+      >
+        There is no repository to display.
+      </li>
+    </ul>
+  </div>
+</div>

public/partials/admin/users.htm

@@ -155,7 +155,7 @@
         <div class="w-100">
           <div class="">
             <h3>
-              {{user.username}}
+              <a ng-href="/admin/users/{{user.username}}" ng-bind="user.username"></a>
               <span
                 class="badge"
                 ng-class="{'badge-warning': user.status == 'removed' || user.status == 'expired' ||  user.status == 'removing' || user.status == 'expiring', 'badge-info': user.status == 'preparing' || user.status == 'download', 'badge-success': user.status == 'active', 'badge-danger': user.status == 'error'}"

public/script/admin.js

@@ -105,6 +105,76 @@ angular
       );
     },
   ])
+  .controller("userAdminController", [
+    "$scope",
+    "$http",
+    "$location",
+    "$routeParams",
+    function ($scope, $http, $location, $routeParams) {
+      $scope.$watch("user.status", () => {
+        if ($scope.user == null) {
+          $location.url("/");
+        }
+      });
+      if ($scope.user == null) {
+        $location.url("/");
+      }
+
+      $scope.userInfo;
+      $scope.repositories = [];
+      $scope.search = "";
+      $scope.filters = {
+        status: { ready: true, expired: false, removed: false },
+      };
+      $scope.orderBy = "-anonymizeDate";
+
+      $scope.repoFiler = (repo) => {
+        if ($scope.filters.status[repo.status] == false) return false;
+
+        if ($scope.search.trim().length == 0) return true;
+
+        if (repo.source.fullName.indexOf($scope.search) > -1) return true;
+        if (repo.repoId.indexOf($scope.search) > -1) return true;
+
+        return false;
+      };
+      
+      function getUserRepositories(username) {
+        $http.get("/api/admin/users/" + username + "/repos", {}).then(
+          (res) => {
+            $scope.repositories = res.data;
+          },
+          (err) => {
+            console.error(err);
+          }
+        );
+      }
+      function getUser(username) {
+        $http.get("/api/admin/users/" + username, {}).then(
+          (res) => {
+            $scope.userInfo = res.data;
+          },
+          (err) => {
+            console.error(err);
+          }
+        );
+      }
+      getUser($routeParams.username);
+      getUserRepositories($routeParams.username);
+
+      let timeClear = null;
+      $scope.$watch(
+        "query",
+        () => {
+          clearTimeout(timeClear);
+          timeClear = setTimeout(() => {
+            getUserRepositories($routeParams.username);
+          }, 500);
+        },
+        true
+      );
+    },
+  ])
   .controller("conferencesAdminController", [
     "$scope",
     "$http",

public/script/app.js

@@ -101,6 +101,11 @@ angular
         controller: "usersAdminController",
         title: "Users Admin - Anonymous GitHub",
       })
+      .when("/admin/users/:username", {
+        templateUrl: "/partials/admin/user.htm",
+        controller: "userAdminController",
+        title: "User Admin - Anonymous GitHub",
+      })
       .when("/admin/conferences", {
         templateUrl: "/partials/admin/conferences.htm",
         controller: "conferencesAdminController",

src/routes/admin.ts

@@ -1,10 +1,12 @@
 import { Queue } from "bullmq";
 import * as express from "express";
+import AnonymousError from "../AnonymousError";
 import AnonymizedRepositoryModel from "../database/anonymizedRepositories/anonymizedRepositories.model";
 import ConferenceModel from "../database/conference/conferences.model";
 import UserModel from "../database/users/users.model";
 import { downloadQueue, removeQueue } from "../queue";
 import Repository from "../Repository";
+import User from "../User";
 import { ensureAuthenticated } from "./connection";
 import { handleError, getUser, isOwnerOrAdmin } from "./route-utils";
 
@@ -165,7 +167,43 @@ router.get("/users", async (req, res) => {
       .skip(skipIndex),
   });
 });
-
+router.get(
+  "/users/:username",
+  async (req: express.Request, res: express.Response) => {
+    try {
+      const model = await UserModel.findOne({ username: req.params.username });
+      if (!model) {
+        req.logout((error) => console.error(error));
+        throw new AnonymousError("user_not_found", {
+          httpStatus: 404,
+        });
+      }
+      const user = new User(model);
+      res.json(user);
+    } catch (error) {
+      handleError(error, res, req);
+    }
+  }
+);
+router.get(
+  "/users/:username/repos",
+  async (req: express.Request, res: express.Response) => {
+    try {
+      const model = await UserModel.findOne({ username: req.params.username });
+      if (!model) {
+        req.logout((error) => console.error(error));
+        throw new AnonymousError("user_not_found", {
+          httpStatus: 404,
+        });
+      }
+      const user = new User(model);
+      const repos = await user.getRepositories();
+      res.json(repos);
+    } catch (error) {
+      handleError(error, res, req);
+    }
+  }
+);
 router.get("/conferences", async (req, res) => {
   const page = parseInt(req.query.page as string) || 1;
   const limit = parseInt(req.query.limit as string) || 10;