Merge pull request 'show apps by role' (#131) from tonitch/front/apps into master

Reviewed-on: PGL/Clyde#131
Reviewed-by: Wal <karpinskiwal@gmail.com>
Reviewed-by: Maxime <231026@umons.ac.be>

backend/src/main/java/ovh/herisson/Clyde/EndPoints/ApplicationsController.java

@@ -2,6 +2,7 @@ package ovh.herisson.Clyde.EndPoints;
 
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.CrossOrigin;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PathVariable;
 import org.springframework.web.bind.annotation.RequestHeader;
@@ -9,10 +10,12 @@ import org.springframework.web.bind.annotation.RestController;
 import ovh.herisson.Clyde.Services.AuthenticatorService;
 import ovh.herisson.Clyde.Tables.Applications;
 import ovh.herisson.Clyde.Tables.Role;
+import ovh.herisson.Clyde.Tables.User;
 
 import java.util.ArrayList;
 
 @RestController
+@CrossOrigin(originPatterns = "*", allowCredentials = "true")
 public class ApplicationsController {
 
     AuthenticatorService authServ;
@@ -41,12 +44,17 @@ public class ApplicationsController {
     }
 
     public ArrayList<Applications> getAuthorizedApplications(String token){
-        Role posterRole = authServ.getUserFromToken(token).getRole();
         ArrayList<Applications> authorizedApps = new ArrayList<>();
 
         authorizedApps.add(Applications.Login);
         authorizedApps.add(Applications.Profile);
 
+		User user = authServ.getUserFromToken(token);
+		if(user == null)
+			return authorizedApps;
+
+		Role posterRole = user.getRole();
+
         if (posterRole == Role.Teacher || posterRole == Role.Student || posterRole == Role.Admin){
             authorizedApps.add(Applications.Msg);
             authorizedApps.add(Applications.Forum);

frontend/src/App.vue

@@ -1,32 +1,10 @@
 <script setup>
   import { toast } from 'vue3-toastify';
-  import { ref, computed } from 'vue'
+  import { ref } from 'vue'
   import i18n, { setLang } from './i18n.js'
   import { isLogged } from '@/rest/Users.js'
 
-
+  import { appList, currentView } from '@/rest/apps.js'
-  // Liste des apps
-  import LoginPage from './Apps/Login.vue'
-  import Inscription from "./Apps/Inscription.vue"
-  import Profil from "./Apps/Profil.vue"
-  import Courses from "./Apps/ManageCourses.vue" 
-
-  const apps = {
-  	'/login': LoginPage,
-	'/inscription': Inscription,
-  '/profil': Profil,
-  '/manage-courses' : Courses,
-  }
-  const currentPath = ref(window.location.hash)
-
-  window.addEventListener('hashchange', () => {
-	Logged.value = isLogged();
-    currentPath.value = window.location.hash
-  })
-
-  const currentView = computed(() => {
-    return apps[currentPath.value.slice(1) || '/']
-  })
 
   const home=ref(i18n("app.home"))
   const notifications=ref(i18n("app.notifications"))
@@ -36,6 +14,9 @@
 
   const Logged = ref(isLogged());
 
+	const apps = ref([])
+	appList().then(e => apps.value = e)
+
 </script>
 
 <template>
@@ -84,31 +65,12 @@
 
     <div class="leftBar">
     <ul class="vertical">
-        <li style="margin-top: 25px;" >
+        <li v-for="app in apps">
-          <a href="#Messages">
+						<a href="app.path">
-            <div class="fa-solid fa-comment" style="font-size: 40px;"></div>
+            <div class="fa-solid" :class="app.icon" style="font-size: 40px;"></div>
-            <div class="text">{{i18n("app.messages")}}</div>
+            <div class="text">{{app.text}}</div>
-          </a></li>
+						</a>
-        <li >
+				</li>
-          <a href="#Notifications">
-            <div class="fa-solid fa-bell" style="font-size: 40px;" ></div>
-            <div class="text">{{i18n("app.notifications")}}</div>
-          </a></li>
-        <li >
-          <a href="#Schedule">
-            <div class="fa-solid fa-calendar-days" style="font-size: 40px;"></div>
-            <div class="text">{{i18n("app.schedules")}}</div>
-          </a></li>
-        <li ><a href="#Forum">
-            <div class="fa-solid fa-envelope" style="font-size: 40px;" ></div>
-            <div class="text">{{i18n("app.forum")}}</div></a></li>
-        <li><a href="#/inscription">
-            <div class="fa-solid fa-users" style="align-self:center;font-size: 40px;"></div>
-            <div class="text" style="top:0;">{{i18n("app.inscription.requests")}}</div></a></li>
-
-        <li><a href="#/manage-courses">
-            <div class="fa-solid fa-book" style="align-self:center;font-size: 40px;overflow:none;"></div>
-            <div class="text">{{i18n("app.manage.courses")}}</div></a></li>
     </ul>
 
     </div>
@@ -277,3 +239,5 @@
 	  }
     
 </style>
+
+<!-- vim:set noet sts=0 sw=4 ts=2: --> 

frontend/src/rest/apps.js

@@ -1,9 +1,60 @@
 import { restGet } from './restConsumer.js' 
+import { ref, computed } from 'vue'
+import i18n from '@/i18n.js'
 
+// Liste des apps
+import LoginPage from '@/Apps/Login.vue'
+import Inscription from "@/Apps/Inscription.vue"
+import Profil from "@/Apps/Profil.vue"
+import Courses from "@/Apps/ManageCourses.vue" 
+
+const apps = {
+		'/login': LoginPage,
+		'/inscription': Inscription,
+		'/profil': Profil,
+		'/manage-courses' : Courses,
+}
+
+const appsList = {
+		'Msg': { path: '#/msg', icon: 'fa-comment', text: i18n("app.messages") },
+		'Notification': { path: '#/notifs', icon: 'fa-bell', text: i18n("app.notifications") },
+		'Forum': { path: '#/forum', icon: 'fa-envelope', text: i18n("app.forum") },
+		'Schedule': { path: '#/schedule', icon: 'fa-calendar-days', text: i18n("app.schedules") },
+		'Inscription': { path: '#/inscription', icon: 'fa-users', text: i18n("app.inscription.requests") },
+		'ManageCourses': { path: '#/manage-courses', icon: 'fa-book', text: i18n("app.manage.courses") },
+}
+
+const currentPath = ref(window.location.hash)
+
+export const currentView = computed(() => {
+		return apps[currentPath.value.slice(1) || '/']
+})
+
+/**
+ * Return the list of app accesible by a logged (or not)
+ * user.
+ */
 export async function appList(){
-	return restGet("/apps")
+		let ret = [];
+		let userAppList = await restGet("/apps");
+		for (let userapp in userAppList) {
+				if(appsList[userAppList[userapp]] != null){
+						ret.push(appsList[userAppList[userapp]])
+				}
+		}
+		return ret;
 }
 
+/**
+ * Check if the specified page is authorized for the
+ * user
+ */
 export async function checkPage(page){
-	return restGet("/apps/" + page)
+		return restGet("/apps/" + page)
 }
+
+window.addEventListener('hashchange', () => {
+		currentPath.value = window.location.hash
+})
+
+// vim:set noet sts=0 sw=4 ts=2 tw=2:

frontend/src/rest/restConsumer.js

@@ -46,7 +46,6 @@ async function _rest(endPoint, config){
 			pending: config['pending'] != null ? config['pending'] : 'pending',
 			error: config['error'] != null ? config['error'] : 'Network Failure...',
 			success: config['success'] != null ? config['success'] : {render(res){
-				console.log(res);
 				return res.data.ok ? "Success" : "error";
 			}},
 		})