Event listener for reloading the projects

frontend/README.md

@@ -41,36 +41,41 @@ Events
 
 **Events fired by the project-list element:**
 
-`"projects-loaded"`:
+`projects-loaded`:
 
 The project-list element fires this event whenever the projects are reloaded from the project-service.
 The event details contain a list of all projects that the current user can access.
 Depending on how the visibility of all projects is configured in the project-service, also projects where the current user is no member of will be part of the list.
 
-`"project-selected"`:
+`project-selected`:
 
 Whenever the user clicks on one of the projects in the list, this event will be fired.
 It contains detailed information on the selected project and its metadata.
 
-`"metadata-changed"`:
+`metadata-changed`:
 
 If the metadata of the currently selected/opened project got changed, this event will be fired.
 It contains the updated project metadata.
 If you display the metadata in the UI and want to keep it up-to-date, then you can use this event.
 
 **Events that the project-list element listens for:**
 
-`"metadata-change-request"`:
+`metadata-change-request`:
 
 The project-list element listens to the event "metadata-change-request".
 It can be used to update the metadata of the currently selected project.
 If you send the event and set the event details to the updated metadata, the project-list element will send it to the project-service and after that the "metadata-changed" event will be fired.
 
-`"metadata-reload-request"`:
+`metadata-reload-request`:
 
 If you updated the metadata without using the "metadata-change-request" event, as an example by using the RMI interface of the project-service, then you should use this event to inform the project-list element about it.
 When receiving the event, the project-list will fetch the metadata from the project-service again and will also send a "metadata-changed" event.
 
+`projects-reload-request`:
+
+This event can be used to reload the list of projects.
+It might be used after the user has logged in.
+
 Extension: SyncMeta Online User List
 -------------------------------------------
 

frontend/dev/demo-element.js

@@ -20,7 +20,6 @@ export class DemoElement extends LitElement {
   }
   // I didnt get how to use ready, so simply used firstUpdated which is always called after render...
   firstUpdated(changedProperties){
-    console.log("sas");
     const statusBar = this.shadowRoot.querySelector("#statusBar");
     // in the following we use (event) => this.method(event) in order to be able to access
     // this.shadowRoot in the handleLogin and handleLogout methods
@@ -29,24 +28,25 @@ export class DemoElement extends LitElement {
   }
 
   handleLogin(event) {
-    console.log("swsqwsw");
     console.log(event.detail.access_token);
     Auth.setAuthDataToLocalStorage(event.detail.access_token);
 
-      var url = "https://api.learning-layers.eu/auth/realms/main/protocol/openid-connect/userinfo";
-      console.log(url);
-      fetch(url, {method: "GET", headers: {
-        "Authorization": "Bearer " + Auth.getAccessToken()
-      }}).then(response => {
-        if(response.ok) {
-          return response.json();
-        }
-      }).then(data => {
-        console.log(data.name);
-       // const userInfo = Common.getUserInfo();
-        //userInfo.sub = data.sub;
-        Common.storeUserInfo(data);
-      });
+    var url = "https://api.learning-layers.eu/auth/realms/main/protocol/openid-connect/userinfo";
+    fetch(url, {method: "GET", headers: {
+      "Authorization": "Bearer " + Auth.getAccessToken()
+    }}).then(response => {
+      if(response.ok) {
+        return response.json();
+      }
+    }).then(data => {
+      console.log(data.name);
+      // const userInfo = Common.getUserInfo();
+      //userInfo.sub = data.sub;
+      Common.storeUserInfo(data);
+
+      // reload projects 
+      window.dispatchEvent(new CustomEvent("projects-reload-request", { bubbles: true }));
+    });
   }
 
   handleLogout() {

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rwth-acis/las2peer-project-service-frontend",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Frontend for las2peer project service.",
   "main": "project-list.js",
   "module": "project-list.js",

frontend/project-list.js

@@ -220,6 +220,7 @@ export class ProjectList extends LitElement {
     this.contactServiceURL = "http://127.0.0.1:8080/contactservice";
     window.addEventListener('metadata-change-request', this._changeMetadata.bind(this));
     window.addEventListener('metadata-reload-request', this._reloadMetadata.bind(this));
+    window.addEventListener('projects-reload-request', (e) => this.showProjects(false));
     this.disableAllProjects = false;
     this.yjsAddress = "http://127.0.0.1:1234";
     this.yjsResourcePath = "./socket.io";
@@ -519,7 +520,6 @@ export class ProjectList extends LitElement {
   showProjects(allProjects) {
     // set loading to true
     this.projectsLoading = true;
-    console.log("sasaq");
     // clear current project list
     this.projects = [];
     this.listedProjects = [];