Reviewed User package and invite user optical fix

This commit is contained in:
Inga Kirschnick
2023-03-13 13:29:01 +01:00
parent 7e54d56ed5
commit 646f735ab2
16 changed files with 190 additions and 364 deletions

View File

@ -1,3 +1,8 @@
.parallax-container .parallax {
z-index: 0;
}
.autocomplete-content {
width: 100% !important;
left: 0 !important;
}

View File

@ -0,0 +1,23 @@
/*****************************************************************************
* Users *
* Fetch requests for /users routes *
*****************************************************************************/
Requests.users = {};
Requests.users.entity = {};
Requests.users.entity.delete = (userId) => {
let input = `/users/${userId}`;
let init = {
method: 'DELETE'
};
return Requests.JSONfetch(input, init);
}
Requests.users.entity.deleteAvatar = (userId) => {
let input = `/users/${userId}/avatar`;
let init = {
method: 'DELETE'
};
return Requests.JSONfetch(input, init);
}

View File

@ -69,240 +69,4 @@ class Utils {
return Utils.mergeObjectsDeep(mergedObject, ...objects.slice(2));
}
static deleteProfileAvatarRequest(userId) {
return new Promise((resolve, reject) => {
let modalElement = Utils.HTMLToElement(
`
<div class="modal">
<div class="modal-content">
<h4>Confirm Avatar deletion</h4>
<p>Do you really want to delete your Avatar?</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">Delete</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) => {
fetch(`/users/${userId}/avatar`, {method: 'DELETE', 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(`Avatar marked for deletion`);
resolve(response);
},
(response) => {
app.flash('Something went wrong', 'error');
reject(response);
}
);
});
modal.open();
});
}
// static deleteJobRequest(userId, jobId) {
// return new Promise((resolve, reject) => {
// let job;
// try {
// job = app.data.users[userId].jobs[jobId];
// } catch (error) {
// job = {};
// }
// let confirmElement = modalElement.querySelector('.action-button[data-action="confirm"]');
// confirmElement.addEventListener('click', (event) => {
// let jobTitle = job?.title;
// fetch(`/jobs/${jobId}`, {method: 'DELETE', 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(`Job "${jobTitle}" marked for deletion`, 'job');
// resolve(response);
// },
// (response) => {
// app.flash('Something went wrong', 'error');
// reject(response);
// }
// );
// });
// modal.open();
// });
// }
// static getJobLogRequest(userId, jobId) {
// return new Promise((resolve, reject) => {
// fetch(`/jobs/${jobId}/log`, {method: 'GET', headers: {Accept: 'application/json, text/plain'}})
// .then(
// (response) => {
// if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
// if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
// return response.text();
// },
// (response) => {
// app.flash('Something went wrong', 'error');
// reject(response);
// }
// )
// .then(
// (text) => {
// let modalElement = Utils.HTMLToElement(
// `
// <div class="modal">
// <div class="modal-content">
// <h4>Job logs</h4>
// <pre><code>${text}</code></pre>
// </div>
// <div class="modal-footer">
// <a class="btn modal-close waves-effect waves-light">Close</a>
// </div>
// </div>
// `
// );
// document.querySelector('#modals').appendChild(modalElement);
// let modal = M.Modal.init(
// modalElement,
// {
// onCloseEnd: () => {
// modal.destroy();
// modalElement.remove();
// }
// }
// );
// modal.open();
// resolve(text);
// }
// );
// });
// }
// static restartJobRequest(userId, jobId) {
// return new Promise((resolve, reject) => {
// let job;
// try {
// job = app.data.users[userId].jobs[jobId];
// } catch (error) {
// job = {};
// }
// let modalElement = Utils.HTMLToElement(
// `
// <div class="modal">
// <div class="modal-content">
// <h4>Confirm Job restart</h4>
// <p>Do you really want to restart the Job <b>${job?.title}</b>? All Job Results will be permanently deleted.</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">Restart</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 jobTitle = job?.title;
// fetch(`/jobs/${jobId}/restart`, {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);}
// if (response.status === 409) {app.flash('Conflict', 'error'); reject(response);}
// app.flash(`Job "${jobTitle}" restarted.`, 'job');
// resolve(response);
// },
// (response) => {
// app.flash('Something went wrong', 'error');
// reject(response);
// }
// );
// });
// modal.open();
// });
// }
static deleteUserRequest(userId) {
return new Promise((resolve, reject) => {
let user;
try {
user = app.data.users[userId];
} catch (error) {
user = {};
}
let modalElement = Utils.HTMLToElement(
`
<div class="modal">
<div class="modal-content">
<h4>Confirm User deletion</h4>
<p>Do you really want to delete the User <b>${user?.username}</b>? All files will be permanently deleted!</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">Delete</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 userName = user?.username;
fetch(`/users/${userId}`, {method: 'DELETE', 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(`User "${userName}" marked for deletion`);
resolve(response);
},
(response) => {
app.flash('Something went wrong', 'error');
reject(response);
}
);
});
modal.open();
});
}
}