Skip to content

✨ Front-end: Drafts "Pending Users" view on the PO center #7745

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
May 28, 2025
Merged

✨ Front-end: Drafts "Pending Users" view on the PO center #7745

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
e094738
getReviewedUsers
odeimaiz May 23, 2025
41fcd8e
list both
odeimaiz May 23, 2025
d197315
connect to backend
odeimaiz May 23, 2025
4970024
approve working
odeimaiz May 23, 2025
93a71f8
reload button
odeimaiz May 23, 2025
2ed1bb9
minor
odeimaiz May 23, 2025
dc55d78
Merge branch 'master' into enh/po-center
pcrespov May 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions services/static-webserver/client/source/class/osparc/data/Resources.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1065,6 +1065,10 @@ qx.Class.define("osparc.data.Resources", {
method: "GET",
url: statics.API + "/admin/user-accounts?review_status=PENDING"
},
getReviewedUsers: {
method: "GET",
url: statics.API + "/admin/user-accounts?review_status=REVIEWED"
},
approveUser: {
method: "POST",
url: statics.API + "/admin/user-accounts:approve"
Expand Down
168 changes: 102 additions & 66 deletions services/static-webserver/client/source/class/osparc/po/UsersPending.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,65 +20,82 @@ qx.Class.define("osparc.po.UsersPending", {
extend: osparc.po.BaseView,

statics: {
getPendingUsers: function() {
return new Promise(resolve => {
resolve({
data: [{
name: "John Doe",
email: "[email protected]",
date: "2025-01-01 00:00:00.702394",
status: "PENDING",
info: {
"institution": "ETH Zurich",
"department": "Department of Physics",
"position": "PhD Student",
"country": "Switzerland",
"city": "Zurich",
},
}, {
name: "Jane Doe",
email: "[email protected]",
date: "2025-01-01 00:01:00.702394",
status: "REJECTED",
info: {
"institution": "ETH Zurich",
"department": "Department of Physics",
"position": "PhD Student",
"country": "Switzerland",
"city": "Zurich",
},
}, {
name: "Alice Smith",
email: "[email protected]",
date: "2025-01-01 00:02:00.702394",
status: "APPROVED",
info: {
"institution": "ETH Zurich",
"department": "Department of Physics",
"position": "PhD Student",
"country": "Switzerland",
"city": "Zurich",
},
}]
});
createInvitationForm: function() {
const form = new qx.ui.form.Form();

const extraCreditsInUsd = new qx.ui.form.Spinner().set({
minimum: 0,
maximum: 1000,
value: 100
});
form.add(extraCreditsInUsd, qx.locale.Manager.tr("Welcome Credits (USD)"), null, "credits");

const withExpiration = new qx.ui.form.CheckBox().set({
value: false
});
form.add(withExpiration, qx.locale.Manager.tr("With expiration"), null, "withExpiration");

const trialDays = new qx.ui.form.Spinner().set({
minimum: 1,
maximum: 1000,
value: 1
});
withExpiration.bind("value", trialDays, "visibility", {
converter: val => val ? "visible" : "excluded"
});
form.add(trialDays, qx.locale.Manager.tr("Trial Days"), null, "trialDays");

return form;
},

createApproveButton: function(email) {
const button = new osparc.ui.form.FetchButton(qx.locale.Manager.tr("Approve"));
const button = new qx.ui.form.Button(qx.locale.Manager.tr("Approve"));
button.addListener("execute", () => {
button.setFetching(true);
const params = {
data: {
email,
},
};
osparc.data.Resources.fetch("poUsers", "approveUser", params)
.then(() => {
osparc.FlashMessenger.logAs(qx.locale.Manager.tr("User approved"), "INFO");
})
.catch(err => osparc.FlashMessenger.logError(err))
.finally(() => button.setFetching(false));
const form = this.createInvitationForm();
const approveBtn = new osparc.ui.form.FetchButton(qx.locale.Manager.tr("Approve"));
approveBtn.set({
appearance: "form-button"
});
form.addButton(approveBtn);
const layout = new qx.ui.container.Composite(new qx.ui.layout.VBox(10));
const invitationForm = new qx.ui.form.renderer.Single(form);
layout.add(invitationForm);
const win = osparc.ui.window.Window.popUpInWindow(layout, email, 350, 150).set({
clickAwayClose: false,
resizable: false,
showClose: true
});
win.open();
approveBtn.addListener("execute", () => {
if (!osparc.data.Permissions.getInstance().canDo("user.invitation.generate", true)) {
return;
}
if (form.validate()) {
approveBtn.setFetching(true);
const params = {
data: {
email,
},
};
params.data["invitation"] = {};
const extraCreditsInUsd = form.getItems()["credits"].getValue();
if (extraCreditsInUsd > 0) {
params.data["invitation"]["extraCreditsInUsd"] = extraCreditsInUsd;
}
if (form.getItems()["withExpiration"].getValue()) {
params.data["invitation"]["trialAccountDays"] = form.getItems()["trialDays"].getValue();
}
osparc.data.Resources.fetch("poUsers", "approveUser", params)
.then(() => {
osparc.FlashMessenger.logAs(qx.locale.Manager.tr("User approved"), "INFO");
})
.catch(err => osparc.FlashMessenger.logError(err))
.finally(() => {
approveBtn.setFetching(false);
win.close();
});
}
});
});
return button;
},
Expand Down Expand Up @@ -136,6 +153,16 @@ qx.Class.define("osparc.po.UsersPending", {
_createChildControlImpl: function(id) {
let control;
switch (id) {
case "reload-button":
control = new qx.ui.form.Button(this.tr("Reload")).set({
allowGrowX: false,
});
control.addListener("execute", () => {
this.getChildControl("pending-users-layout").removeAll();
this.__populatePendingUsersLayout();
});
this._add(control);
break;
case "pending-users-container":
control = new qx.ui.container.Scroll();
this._add(control, {
Expand All @@ -153,6 +180,7 @@ qx.Class.define("osparc.po.UsersPending", {
},

_buildLayout: function() {
this.getChildControl("reload-button");
this.getChildControl("pending-users-container");

this.__populatePendingUsersLayout();
Expand Down Expand Up @@ -182,14 +210,14 @@ qx.Class.define("osparc.po.UsersPending", {
column: 2,
});

pendingUsersLayout.add(new qx.ui.basic.Label(this.tr("Info")).set({
pendingUsersLayout.add(new qx.ui.basic.Label(this.tr("Status")).set({
font: "text-14"
}), {
row: 0,
column: 3,
});

pendingUsersLayout.add(new qx.ui.basic.Label(this.tr("Status")).set({
pendingUsersLayout.add(new qx.ui.basic.Label(this.tr("Info")).set({
font: "text-14"
}), {
row: 0,
Expand All @@ -209,24 +237,24 @@ qx.Class.define("osparc.po.UsersPending", {

let row = 1;
pendingUsers.forEach(pendingUser => {
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.name), {
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.firstName + " " + pendingUser.lastName), {
row,
column: 0,
});
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.email), {
row,
column: 1,
});
pendingUsersLayout.add(new qx.ui.basic.Label(osparc.utils.Utils.formatDateAndTime(new Date(pendingUser.date))), {
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.date ? osparc.utils.Utils.formatDateAndTime(new Date(pendingUser.date)) : "-"), {
row,
column: 2,
});
const infoButton = this.self().createInfoButton(pendingUser.info);
pendingUsersLayout.add(infoButton, {
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.accountRequestStatus.toLowerCase()), {
row,
column: 3,
});
pendingUsersLayout.add(new qx.ui.basic.Label(pendingUser.status.toLowerCase()), {
const infoButton = this.self().createInfoButton(pendingUser);
pendingUsersLayout.add(infoButton, {
row,
column: 4,
});
Expand All @@ -236,7 +264,7 @@ qx.Class.define("osparc.po.UsersPending", {
column: 5,
});

switch (pendingUser.status) {
switch (pendingUser.accountRequestStatus) {
case "PENDING": {
const approveButton = this.self().createApproveButton(pendingUser.email);
buttonsLayout.add(approveButton);
Expand All @@ -250,8 +278,12 @@ qx.Class.define("osparc.po.UsersPending", {
break;
}
case "APPROVED": {
/*
const resendEmailButton = this.self().createResendEmailButton(pendingUser.email);
buttonsLayout.add(resendEmailButton);
*/
const rejectButton = this.self().createRejectButton(pendingUser.email);
buttonsLayout.add(rejectButton);
break;
}
}
Expand All @@ -260,13 +292,17 @@ qx.Class.define("osparc.po.UsersPending", {
},

__populatePendingUsersLayout: function() {
// osparc.data.Resources.fetch("poUsers", "getPendingUsers", params)
this.self().getPendingUsers()
.then(pendingUsers => {
Promise.all([
osparc.data.Resources.fetch("poUsers", "getPendingUsers"),
osparc.data.Resources.fetch("poUsers", "getReviewedUsers")
])
.then(resps => {
const pendingUsers = resps[0];
const reviewedUsers = resps[1];
const pendingUsersLayout = this.getChildControl("pending-users-layout");
pendingUsersLayout.removeAll();
this.__addHeader();
this.__addRows(pendingUsers["data"]);
this.__addRows(pendingUsers.concat(reviewedUsers));
})
.catch(err => osparc.FlashMessenger.logError(err));
}
Expand Down
Loading