Redesign corpus page and add possibility to add followers by username for owner

app/static/js/RessourceDisplays/CorpusDisplay.js

@@ -12,16 +12,6 @@ class CorpusDisplay extends RessourceDisplay {
       .addEventListener('click', (event) => {
         Utils.deleteCorpusRequest(this.userId, this.corpusId);
       });
-    this.displayElement
-      .querySelector('.action-switch[data-action="toggle-is-public"]')
-      .addEventListener('click', (event) => {
-        if (event.target.tagName !== 'INPUT') {return;}
-        if (event.target.checked) {
-          Utils.enableCorpusIsPublicRequest(this.userId, this.corpusId);
-        } else {
-          Utils.disableCorpusIsPublicRequest(this.userId, this.corpusId);
-        }
-      });
   }
 
   init(user) {
@@ -31,7 +21,6 @@ class CorpusDisplay extends RessourceDisplay {
     this.setStatus(corpus.status);
     this.setTitle(corpus.title);
     this.setNumTokens(corpus.num_tokens);
-    this.setShareLink();
   }
 
   onPatch(patch) {
@@ -82,7 +71,7 @@ class CorpusDisplay extends RessourceDisplay {
   }
 
   setStatus(status) {
-    let elements = this.displayElement.querySelectorAll('.corpus-analyse-trigger')
+    let elements = this.displayElement.querySelectorAll('.action-button[data-action="analyze"]');
     for (let element of elements) {
       if (['BUILT', 'STARTING_ANALYSIS_SESSION', 'RUNNING_ANALYSIS_SESSION', 'CANCELING_ANALYSIS_SESSION'].includes(status)) {
         element.classList.remove('disabled');
@@ -118,28 +107,4 @@ class CorpusDisplay extends RessourceDisplay {
       new Date(creationDate).toLocaleString("en-US")
     );
   }
-
-  setShareLink() {
-    let generateShareLinkButton = this.displayElement.querySelector('#generate-share-link-button');
-    let copyShareLinkButton = this.displayElement.querySelector('#copy-share-link-button');
-    let shareLinkInput = this.displayElement.querySelector('#share-link-input');
-    let shareLinkContainer = this.displayElement.querySelector('#share-link-container');
-    let roleSelect = this.displayElement.querySelector('#role-select');
-    let expirationDate = this.displayElement.querySelector('#expiration');
-
-    
-    generateShareLinkButton.addEventListener('click', () => {
-      Utils.generateCorpusShareLinkRequest(`${this.corpusId}`, roleSelect.value, expirationDate.value)
-        .then((shareLink) => {
-          shareLinkContainer.classList.remove('hide');
-          shareLinkInput.value = shareLink;
-        });
-    });
-
-    copyShareLinkButton.addEventListener('click', () => {
-      shareLinkInput.select();
-      navigator.clipboard.writeText(shareLinkInput.value);
-      app.flash(`Copied!`, 'success');
-    });
-  }
 }

app/static/js/Utils.js

@@ -69,6 +69,36 @@ class Utils {
     return Utils.mergeObjectsDeep(mergedObject, ...objects.slice(2));
   }
 
+  static updateCorpusIsPublicRequest(corpusId, isPublic) {
+    return new Promise((resolve, reject) => {
+      let fetchRessource = `/corpora/${corpusId}/is_public`;
+      let fetchOptions = {
+        method: 'POST',
+        headers: {
+          'Accept': 'application/json',
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(isPublic)
+      };
+      fetch(fetchRessource, fetchOptions)
+        .then(
+          (response) => {
+            if (response.ok) {
+              app.flash(`Corpus is now ${isPublic ? 'public' : 'private'}`, 'corpus');
+              resolve(response);
+            } else {
+              app.flash(`${response.statusText}`, 'error');
+              reject(response);
+            }
+          },
+          (response) => {
+            app.flash('Something went wrong', 'error');
+            reject(response);
+          }
+        );
+    });
+  }
+
   static updateCorpusFollowerRole(corpusId, followerId, roleName) {
     return new Promise((resolve, reject) => {
       fetch(`/corpora/${corpusId}/followers/${followerId}/role`, {method: 'POST', headers: {Accept: 'application/json', 'Content-Type': 'application/json'}, body: JSON.stringify({role: roleName})})
@@ -91,79 +121,27 @@ class Utils {
     });
   }
 
-  static enableCorpusIsPublicRequest(userId, corpusId) {
+  static addCorpusFollowersRequest(corpusId, usernames) {
     return new Promise((resolve, reject) => {
-      let corpus;
-      try {
-        corpus = app.data.users[userId].corpora[corpusId];
-      } catch (error) {
-        corpus = {};
-      }
-
-      let modalElement = Utils.HTMLToElement(
-        `
-          <div class="modal">
-            <div class="modal-content">
-              <h4>Hier könnte eine Warnung stehen</h4>
-              <p></p>
-            </div>
-            <div class="modal-footer">
-              <a class="action-button btn modal-close waves-effect waves-light" data-action="cancel">Cancel</a>
-              <a class="action-button btn modal-close red waves-effect waves-light" data-action="confirm">Confirm</a>
-            </div>
-          </div>
-        `
-      );
-      document.querySelector('#modals').appendChild(modalElement);
-      let modal = M.Modal.init(
-        modalElement,
-        {
-          dismissible: false,
-          onCloseEnd: () => {
-            modal.destroy();
-            modalElement.remove();
-          }
-        }
-      );
-
-      let confirmElement = modalElement.querySelector('.action-button[data-action="confirm"]');
-      confirmElement.addEventListener('click', (event) => {
-        let corpusTitle = corpus?.title;
-        fetch(`/corpora/${corpusId}/is_public/enable`, {method: 'POST', headers: {Accept: 'application/json'}})
-          .then(
-            (response) => {
-              if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
-              if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
-              app.flash(`Corpus "${corpusTitle}" is public now`, 'corpus');
-              resolve(response);
-            },
-            (response) => {
-              app.flash('Something went wrong', 'error');
-              reject(response);
-            }
-          );
-      });
-      modal.open();
-    });
-  }
-
-  static disableCorpusIsPublicRequest(userId, corpusId) {
-    return new Promise((resolve, reject) => {
-      let corpus;
-      try {
-        corpus = app.data.users[userId].corpora[corpusId];
-      } catch (error) {
-        corpus = {};
-      }
-
-      let corpusTitle = corpus?.title;
-      fetch(`/corpora/${corpusId}/is_public/disable`, {method: 'POST', headers: {Accept: 'application/json'}})
+      let fetchRessource = `/corpora/${corpusId}/followers/add`;
+      let fetchOptions = {
+        method: 'POST',
+        headers: {
+          'Accept': 'application/json',
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(usernames)
+      };
+      fetch(fetchRessource, fetchOptions)
         .then(
           (response) => {
-            if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
-            if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
-            app.flash(`Corpus "${corpusTitle}" is private now`, 'corpus');
-            resolve(response);
+            if (response.ok) {
+              app.flash(`${usernames.length > 1 ? 'Users are' : 'User is'} following now`, 'corpus');
+              resolve(response);
+            } else {
+              app.flash(`${response.statusText}`, 'error');
+              reject(response);
+            }
           },
           (response) => {
             app.flash('Something went wrong', 'error');