UI: adding users view

browser/goliac-ui/src/App.vue

@@ -6,23 +6,23 @@ import { User, MessageBox, Folder } from '@element-plus/icons-vue'
  <div id="app">
     <el-container>
       <el-aside width="130px">
-        <el-menu>
-          <el-menu-item index="1" style="justify-content: center">
+        <el-menu :router="true">
+          <el-menu-item index="/" style="justify-content: center">
             <template #title>
               <img src="/logo.png">
             </template>
           </el-menu-item>
-          <el-menu-item index="2">
+          <el-menu-item index="/users">
             <template #title>
               <el-icon :size="16"><User /></el-icon>Users
             </template>
           </el-menu-item>
-          <el-menu-item index="3">
+          <el-menu-item index="/teams">
             <template #title>
               <el-icon :size="16"><MessageBox /></el-icon>Teams
             </template>
           </el-menu-item>
-          <el-menu-item index="4">
+          <el-menu-item index="/repositories">
             <template #title>
               <el-icon :size="16"><Folder /></el-icon>Repositories
             </template>

browser/goliac-ui/src/components/DashboardApp.vue

@@ -24,7 +24,7 @@
       </el-row>
       <el-row>
         <div class="flex-container">
-            <span style="color:red;">Force a Github sync ? </span>
+            <el-text style="color:red;">Force a Github sync ? </el-text>
             <span> &nbsp; </span>
             <el-button @click="resync">Re-sync</el-button>
         </div>
@@ -34,7 +34,7 @@
       </el-row>
       <el-row>
         <div class="flex-container">
-            <span style="color:red;">Invalidate the cache of remote Github objects? </span>
+            <el-text style="color:red;">Invalidate the cache of remote Github objects? </el-text>
             <span> &nbsp; </span>
             <el-button @click="flushcache">Flush cache</el-button>
         </div>

browser/goliac-ui/src/components/UserApp.vue

@@ -0,0 +1,113 @@
+<template>
+    <el-breadcrumb separator="/">
+      <el-breadcrumb-item :to="{ path: '/' }">Goliac</el-breadcrumb-item>
+      <el-breadcrumb-item :to="{ path: '/users' }">users</el-breadcrumb-item>
+      <el-breadcrumb-item>{{ userid }}</el-breadcrumb-item>
+    </el-breadcrumb>
+    <el-divider />
+
+    <el-row>
+        <el-col :span="20" :offset="2">
+            <el-card>
+                <template #header>
+                    <div class="card-header">
+                        <el-text>{{userid}}</el-text>
+                    </div>
+                </template>
+                <div class="flex-container">
+                    <el-text>Github id : </el-text>
+                    <el-text>{{ user.githubid}}</el-text>
+                </div>
+                <div class="flex-container">
+                    <el-text>External : </el-text>
+                    <el-text> {{ user.external}}</el-text>
+                </div>
+            </el-card>
+        </el-col>
+    </el-row>  
+
+    <el-row>
+        &nbsp;
+    </el-row>
+
+    <el-row>
+      <el-col :span="20" :offset="2">
+        <el-card>
+          <el-table
+              :data="teams"
+              :stripe="true"
+              :highlight-current-row="false"
+              :default-sort="{ prop: 'name', order: 'descending' }"
+          >
+              <el-table-column prop="name" align="left" label="Team" sortable />
+
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+    <el-row>
+        &nbsp;
+    </el-row>
+
+    <el-row>
+      <el-col :span="20" :offset="2">
+        <el-card>
+          <el-table
+              :data="repositories"
+              :stripe="true"
+              :highlight-current-row="false"
+              :default-sort="{ prop: 'name', order: 'descending' }"
+          >
+              <el-table-column prop="name" align="left" label="Repository" sortable />
+              <el-table-column prop="public" align="left" label="Public" />
+              <el-table-column prop="archived" align="left" label="Archived" />
+
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+  </template>
+
+  <script>
+    import Axios from "axios";
+
+    import constants from "@/constants";
+    import helpers from "@/helpers/helpers";
+
+    const { handleErr } = helpers;
+
+    const { API_URL } = constants;
+
+    export default {
+      name: "UserApp",
+      components: {
+      },
+      computed: {
+        userid() {
+          return this.$route.params.userId;
+        },
+      },
+
+      data() {
+        return {
+          user: {},
+          repositories: [],
+          teams: [],
+        };
+      },
+      created() {
+        this.getUser()
+      },
+      methods: {
+          getUser() {
+              Axios.get(`${API_URL}/users/${this.userid}`).then(response => {
+                  let user = response.data;
+                  this.user = user
+                  this.repositories=user.repositories
+                  this.teams=user.teams
+              }, handleErr.bind(this));
+          },
+      }
+    };
+  </script>
+

browser/goliac-ui/src/components/UsersApp.vue

@@ -0,0 +1,63 @@
+<template>
+    <el-breadcrumb separator="/">
+      <el-breadcrumb-item :to="{ path: '/' }">Goliac</el-breadcrumb-item>
+      <el-breadcrumb-item :to="{ path: '/' }">users</el-breadcrumb-item>
+    </el-breadcrumb>
+    <el-divider />
+
+    <el-row>
+      <el-col :span="20" :offset="2">
+        <el-row>
+          <el-table
+              :data="users"
+              :stripe="true"
+              :highlight-current-row="false"
+              v-on:row-click="goToUser"
+              :default-sort="{ prop: 'name', order: 'descending' }"
+          >
+              <el-table-column prop="name" align="left" label="Username" sortable />
+              <el-table-column prop="githubid" align="left" label="Github Id" />
+              <el-table-column prop="external" align="left" label="External" />
+
+          </el-table>
+        </el-row>
+      </el-col>
+    </el-row>
+  </template>
+
+  <script>
+    import Axios from "axios";
+
+    import constants from "@/constants";
+    import helpers from "@/helpers/helpers";
+
+    const { handleErr } = helpers;
+
+    const { API_URL } = constants;
+
+    export default {
+      name: "UsersApp",
+      components: {
+      },
+      data() {
+        return {
+          users: [],
+        };
+      },
+      created() {
+        this.getUsers()
+      },
+      methods: {
+        goToUser(row) {
+            this.$router.push({ name: "user", params: { userId: row.name } });
+        },
+          getUsers() {
+              Axios.get(`${API_URL}/users`).then(response => {
+                  let users = response.data.users;
+                  this.users = users
+              }, handleErr.bind(this));
+          },
+      }
+    };
+  </script>
+

browser/goliac-ui/src/router/index.js

@@ -1,12 +1,24 @@
 import { createWebHashHistory, createRouter } from "vue-router";
 import DashboardApp from "@/components/DashboardApp.vue";
+import UsersApp from "@/components/UsersApp.vue";
+import UserApp from "@/components/UserApp.vue";
 
 const routes = [
   {
     path: "/",
     name: "dashboard",
     component: DashboardApp,
   },
+  {
+    path: "/users",
+    name: "users",
+    component: UsersApp,
+  },
+  {
+    path: "/users/:userId",
+    name: "user",
+    component: UserApp,
+  },
 ];
 
 const router = createRouter({

docs/api_docs/bundle.yaml

@@ -150,12 +150,23 @@ definitions:
       name:
         type: string
         x-isnullable: false
+      githubid:
+        type: string
+        x-isnullable: false
       external:
         type: boolean
         x-isnullable: false
+        x-omitempty: false
   userDetails:
     type: object
     properties:
+      githubid:
+        type: string
+        x-isnullable: false
+      external:
+        type: boolean
+        x-isnullable: false
+        x-omitempty: false
       teams:
         type: array
         items:

internal/goliac_server.go

@@ -62,32 +62,48 @@ func (g *GoliacServerImpl) GetUsers(app.GetUsersParams) middleware.Responder {
 		Users: make([]*models.User, 0),
 	}
 	local := g.goliac.GetLocal()
-	for username := range local.Users() {
+	for username, user := range local.Users() {
 		u := models.User{
 			External: false,
 			Name:     username,
+			Githubid: user.Data.GithubID,
 		}
 		users.Users = append(users.Users, &u)
 	}
-	for username := range local.ExternalUsers() {
+	for username, user := range local.ExternalUsers() {
 		u := models.User{
 			External: true,
 			Name:     username,
+			Githubid: user.Data.GithubID,
 		}
 		users.Users = append(users.Users, &u)
 	}
 	return app.NewGetUsersOK().WithPayload(&users)
 }
 
 func (g *GoliacServerImpl) GetUser(params app.GetUserParams) middleware.Responder {
+	local := g.goliac.GetLocal()
+
+	user, found := local.Users()[params.UserID]
+	external := false
+	if !found {
+		user, found = local.ExternalUsers()[params.UserID]
+		if !found {
+			message := fmt.Sprintf("User %s not found", params.UserID)
+			return app.NewGetUserDefault(404).WithPayload(&models.Error{Message: &message})
+		}
+		external = true
+	}
+
 	userdetails := models.UserDetails{
+		Githubid:     user.Data.GithubID,
+		External:     external,
 		Teams:        make([]*models.Team, 0),
 		Repositories: make([]*models.Repository, 0),
 	}
 
 	// [teamname]team
 	userTeams := make(map[string]*models.Team)
-	local := g.goliac.GetLocal()
 	for teamname, team := range local.Teams() {
 		for _, owner := range team.Data.Owners {
 			if owner == params.UserID {

swagger/index.yaml

@@ -63,13 +63,24 @@ definitions:
       name:
         type: string
         x-isnullable: false
+      githubid:
+        type: string
+        x-isnullable: false
       external:
         type: boolean
         x-isnullable: false
+        x-omitempty: false
 
   userDetails:
     type: object
     properties:
+      githubid:
+        type: string
+        x-isnullable: false
+      external:
+        type: boolean
+        x-isnullable: false
+        x-omitempty: false
       teams:
         type: array
         items: