Skip to content

Commit 57d948f

Browse files
authored
🎨 [Frontend] Support center feedback (#8362)
1 parent 7e42fd0 commit 57d948f

File tree

20 files changed

+354
-330
lines changed

20 files changed

+354
-330
lines changed

services/static-webserver/client/source/class/osparc/auth/Data.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -163,6 +163,12 @@ qx.Class.define("osparc.auth.Data", {
163163
let friendlyRole = role.replace(/_/g, " ");
164164
friendlyRole = osparc.utils.Utils.firstsUp(friendlyRole);
165165
return friendlyRole;
166-
}
166+
},
167+
168+
getAvatar: function(size) {
169+
const email = this.getEmail();
170+
const userName = this.getUserName();
171+
return osparc.utils.Avatar.emailToThumbnail(email, userName, size);
172+
},
167173
}
168174
});

services/static-webserver/client/source/class/osparc/conversation/AddMessage.js

Lines changed: 12 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,9 @@ qx.Class.define("osparc.conversation.AddMessage", {
5353
},
5454

5555
events: {
56-
"messageAdded": "qx.event.type.Data",
57-
"messageUpdated": "qx.event.type.Data",
56+
"addMessage": "qx.event.type.Data",
57+
"updateMessage": "qx.event.type.Data",
58+
"notifyUser": "qx.event.type.Data",
5859
},
5960

6061
members: {
@@ -70,9 +71,9 @@ qx.Class.define("osparc.conversation.AddMessage", {
7071
}
7172
case "thumbnail": {
7273
control = osparc.utils.Utils.createThumbnail(32);
73-
const meGroup = osparc.store.Groups.getInstance().getGroupMe();
74+
const authStore = osparc.auth.Data.getInstance();
7475
control.set({
75-
source: meGroup.getThumbnail(),
76+
source: authStore.getAvatar(32),
7677
alignX: "center",
7778
alignY: "middle",
7879
marginRight: 8,
@@ -171,70 +172,19 @@ qx.Class.define("osparc.conversation.AddMessage", {
171172
},
172173

173174
addComment: function() {
174-
const conversationId = this.getConversationId();
175-
if (conversationId) {
176-
return this.__postMessage();
177-
} else {
178-
const studyData = this.getStudyData();
179-
let promise = null;
180-
if (studyData) {
181-
// create new project conversation first
182-
promise = osparc.store.ConversationsProject.getInstance().postConversation(studyData["uuid"])
183-
} else {
184-
// support conversation
185-
const extraContext = {};
186-
const currentStudy = osparc.store.Store.getInstance().getCurrentStudy()
187-
if (currentStudy) {
188-
extraContext["projectId"] = currentStudy.getUuid();
189-
}
190-
promise = osparc.store.ConversationsSupport.getInstance().postConversation(extraContext);
191-
}
192-
return promise
193-
.then(data => {
194-
this.setConversationId(data["conversationId"]);
195-
return this.__postMessage();
196-
});
197-
}
198-
},
199-
200-
__postMessage: function() {
201175
const commentField = this.getChildControl("comment-field");
202176
const content = commentField.getChildControl("text-area").getValue();
203-
let promise = null;
204177
if (content) {
205-
const studyData = this.getStudyData();
206-
const conversationId = this.getConversationId();
207-
if (studyData) {
208-
promise = osparc.store.ConversationsProject.getInstance().postMessage(studyData["uuid"], conversationId, content);
209-
} else {
210-
promise = osparc.store.ConversationsSupport.getInstance().postMessage(conversationId, content);
211-
}
212-
return promise
213-
.then(data => {
214-
this.fireDataEvent("messageAdded", data);
215-
commentField.getChildControl("text-area").setValue("");
216-
return data;
217-
});
178+
this.fireDataEvent("addMessage", content);
179+
commentField.getChildControl("text-area").setValue("");
218180
}
219-
return Promise.reject();
220181
},
221182

222183
__editComment: function() {
223184
const commentField = this.getChildControl("comment-field");
224185
const content = commentField.getChildControl("text-area").getValue();
225186
if (content) {
226-
const studyData = this.getStudyData();
227-
const conversationId = this.getConversationId();
228-
const message = this.getMessage();
229-
if (studyData) {
230-
promise = osparc.store.ConversationsProject.getInstance().editMessage(studyData["uuid"], conversationId, message["messageId"], content);
231-
} else {
232-
promise = osparc.store.ConversationsSupport.getInstance().editMessage(conversationId, message["messageId"], content);
233-
}
234-
promise.then(data => {
235-
this.fireDataEvent("messageUpdated", data);
236-
commentField.getChildControl("text-area").setValue("");
237-
});
187+
this.fireDataEvent("updateMessage", content);
238188
}
239189
},
240190

@@ -273,7 +223,7 @@ qx.Class.define("osparc.conversation.AddMessage", {
273223
// This check only works if the project is directly shared with the user.
274224
// If it's shared through a group, it might be a bit confusing
275225
if (userGid in studyData["accessRights"]) {
276-
this.__addNotify(userGid);
226+
this.__doNotifyUser(userGid);
277227
} else {
278228
const msg = this.tr("This user has no access to the project. Do you want to share it?");
279229
const win = new osparc.ui.window.Confirmation(msg).set({
@@ -290,7 +240,7 @@ qx.Class.define("osparc.conversation.AddMessage", {
290240
};
291241
osparc.store.Study.getInstance().addCollaborators(studyData, newCollaborators)
292242
.then(() => {
293-
this.__addNotify(userGid);
243+
this.__doNotifyUser(userGid);
294244
const potentialCollaborators = osparc.store.Groups.getInstance().getPotentialCollaborators()
295245
if (userGid in potentialCollaborators && "getUserId" in potentialCollaborators[userGid]) {
296246
const uid = potentialCollaborators[userGid].getUserId();
@@ -303,47 +253,13 @@ qx.Class.define("osparc.conversation.AddMessage", {
303253
}
304254
},
305255

306-
__addNotify: function(userGid) {
307-
const studyData = this.getStudyData();
308-
if (!studyData) {
309-
return;
310-
}
311-
312-
const conversationId = this.getConversationId();
313-
if (conversationId) {
314-
this.__postNotify(userGid);
315-
} else {
316-
// create new conversation first
317-
osparc.store.ConversationsProject.getInstance().postConversation(studyData["uuid"])
318-
.then(data => {
319-
this.setConversationId(data["conversationId"]);
320-
this.__postNotify(userGid);
321-
});
322-
}
323-
},
324-
325-
__postNotify: function(userGid) {
256+
__doNotifyUser: function(userGid) {
326257
const studyData = this.getStudyData();
327258
if (!studyData) {
328259
return;
329260
}
330261

331-
if (userGid) {
332-
const conversationId = this.getConversationId();
333-
osparc.store.ConversationsProject.getInstance().notifyUser(studyData["uuid"], conversationId, userGid)
334-
.then(data => {
335-
this.fireDataEvent("messageAdded", data);
336-
const potentialCollaborators = osparc.store.Groups.getInstance().getPotentialCollaborators();
337-
if (userGid in potentialCollaborators) {
338-
if ("getUserId" in potentialCollaborators[userGid]) {
339-
const uid = potentialCollaborators[userGid].getUserId();
340-
osparc.notification.Notifications.pushConversationNotification(uid, studyData["uuid"]);
341-
}
342-
const msg = "getLabel" in potentialCollaborators[userGid] ? potentialCollaborators[userGid].getLabel() + this.tr(" was notified") : this.tr("Notification sent");
343-
osparc.FlashMessenger.logAs(msg, "INFO");
344-
}
345-
});
346-
}
262+
this.fireDataEvent("notifyUser", userGid);
347263
},
348264
/* NOTIFY USERS */
349265
}

services/static-webserver/client/source/class/osparc/conversation/MessageUI.js

Lines changed: 27 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,9 @@ qx.Class.define("osparc.conversation.MessageUI", {
4040

4141
statics: {
4242
isMyMessage: function(message) {
43+
if (message["userGroupId"] === "system") {
44+
return false;
45+
}
4346
return message && osparc.auth.Data.getInstance().getGroupId() === message["userGroupId"];
4447
}
4548
},
@@ -163,15 +166,19 @@ qx.Class.define("osparc.conversation.MessageUI", {
163166
const messageContent = this.getChildControl("message-content");
164167
messageContent.setValue(message["content"]);
165168

166-
osparc.store.Users.getInstance().getUser(message["userGroupId"])
167-
.then(user => {
168-
thumbnail.setUser(user);
169-
userName.setValue(user ? user.getLabel() : "Unknown user");
170-
})
171-
.catch(() => {
169+
if (message["userGroupId"] === "system") {
170+
userName.setValue("Support");
171+
} else {
172+
osparc.store.Users.getInstance().getUser(message["userGroupId"])
173+
.then(user => {
174+
thumbnail.setUser(user);
175+
userName.setValue(user ? user.getLabel() : "Unknown user");
176+
})
177+
.catch(() => {
172178
thumbnail.setSource(osparc.utils.Avatar.emailToThumbnail());
173179
userName.setValue("Unknown user");
174-
});
180+
});
181+
}
175182

176183
this.getChildControl("spacer");
177184

@@ -207,9 +214,19 @@ qx.Class.define("osparc.conversation.MessageUI", {
207214
resizable: true,
208215
showClose: true,
209216
});
210-
addMessage.addListener("messageUpdated", e => {
211-
win.close();
212-
this.fireDataEvent("messageUpdated", e.getData());
217+
addMessage.addListener("updateMessage", e => {
218+
const content = e.getData();
219+
const conversationId = message["conversationId"];
220+
const messageId = message["messageId"];
221+
if (this.__studyData) {
222+
promise = osparc.store.ConversationsProject.getInstance().editMessage(this.__studyData["uuid"], conversationId, messageId, content);
223+
} else {
224+
promise = osparc.store.ConversationsSupport.getInstance().editMessage(conversationId, messageId, content);
225+
}
226+
promise.then(data => {
227+
win.close();
228+
this.fireDataEvent("messageUpdated", data);
229+
});
213230
});
214231
},
215232

services/static-webserver/client/source/class/osparc/data/model/Conversation.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -242,7 +242,7 @@ qx.Class.define("osparc.data.model.Conversation", {
242242
renameConversation: function(newName) {
243243
osparc.store.ConversationsSupport.getInstance().renameConversation(this.getConversationId(), newName)
244244
.then(() => {
245-
this.setNameAlias(newName);
245+
this.setName(newName);
246246
});
247247
},
248248

services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,7 @@ qx.Class.define("osparc.data.model.NodeProgressSequence", {
231231
__initLayout: function() {
232232
this.__mainLoadingPage = new qx.ui.container.Composite(new qx.ui.layout.VBox(8)).set({
233233
maxWidth: 400,
234+
decorator: "rounded",
234235
});
235236

236237
const sequenceLoadingPage = new osparc.widget.ProgressSequence(qx.locale.Manager.tr("LOADING ..."));

services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -307,7 +307,7 @@ qx.Class.define("osparc.navigation.NavigationBar", {
307307
break;
308308
}
309309
case "help":
310-
control = this.__createHelpMenuBtn().set({
310+
control = this.__createHelpBtn().set({
311311
...this.self().RIGHT_BUTTON_OPTS
312312
});
313313
osparc.utils.Utils.setIdToWidget(control, "helpNavigationBtn");
@@ -361,22 +361,12 @@ qx.Class.define("osparc.navigation.NavigationBar", {
361361
}, this);
362362
},
363363

364-
__createHelpMenuBtn: function() {
365-
const menu = new qx.ui.menu.Menu().set({
366-
position: "top-right",
367-
appearance: "menu-wider",
368-
});
369-
const menuButton = new qx.ui.form.MenuButton(null, "@FontAwesome5Regular/question-circle/24", menu).set({
364+
__createHelpBtn: function() {
365+
const helpButton = new qx.ui.form.Button(null, "@FontAwesome5Regular/question-circle/24").set({
370366
backgroundColor: "transparent"
371367
});
372-
373-
osparc.utils.Utils.setIdToWidget(menu, "helpNavigationMenu");
374-
375-
// add support conversations
376-
osparc.store.Support.addSupportConversationsToMenu(menu);
377-
378-
379-
return menuButton;
368+
helpButton.addListener("execute", () => osparc.support.SupportCenter.openWindow());
369+
return helpButton;
380370
},
381371

382372
__createLoginBtn: function() {

services/static-webserver/client/source/class/osparc/navigation/UserMenu.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,14 @@ qx.Class.define("osparc.navigation.UserMenu", {
8585
control.addListener("execute", () => osparc.desktop.organizations.OrganizationsWindow.openWindow(), this);
8686
this.add(control);
8787
break;
88+
case "help-button":
89+
control = new qx.ui.menu.Button().set({
90+
label: qx.locale.Manager.tr("Help & Support"),
91+
icon: "@FontAwesome5Solid/question-circle/16",
92+
});
93+
control.addListener("execute", () => osparc.support.SupportCenter.openWindow());
94+
this.add(control);
95+
break;
8896
case "market":
8997
control = new qx.ui.menu.Button(this.tr("The Shop"));
9098
control.addListener("execute", () => osparc.vipMarket.MarketWindow.openWindow());
@@ -213,7 +221,7 @@ qx.Class.define("osparc.navigation.UserMenu", {
213221
this.addSeparator();
214222

215223
// quick starts and manuals
216-
osparc.store.Support.addSupportConversationsToMenu(this);
224+
this.getChildControl("help-button");
217225
this.addSeparator();
218226

219227
this.getChildControl("theme-switcher");

services/static-webserver/client/source/class/osparc/store/Groups.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@ qx.Class.define("osparc.store.Groups", {
110110
groupMe.set({
111111
label: myAuthData.getUserName(),
112112
description,
113-
thumbnail: osparc.utils.Avatar.emailToThumbnail(myAuthData.getEmail(), myAuthData.getUserName()),
113+
thumbnail: myAuthData.getAvatar(32),
114114
})
115115
return orgs;
116116
});

services/static-webserver/client/source/class/osparc/store/Support.js

Lines changed: 0 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -19,33 +19,6 @@ qx.Class.define("osparc.store.Support", {
1919
return osparc.store.VendorInfo.getManuals();
2020
},
2121

22-
addSupportConversationsToMenu: function(menu) {
23-
const supportCenterButton = new qx.ui.menu.Button().set({
24-
label: qx.locale.Manager.tr("Help & Support"),
25-
icon: "@FontAwesome5Solid/question-circle/16",
26-
});
27-
supportCenterButton.addListener("execute", () => osparc.support.SupportCenter.openWindow());
28-
menu.add(supportCenterButton);
29-
30-
const askAQuestionButton = new qx.ui.menu.Button().set({
31-
label: qx.locale.Manager.tr("Ask a Question"),
32-
icon: "@FontAwesome5Solid/comments/16",
33-
visibility: "excluded",
34-
});
35-
askAQuestionButton.addListener("execute", () => osparc.support.SupportCenter.openWindow("conversations"));
36-
menu.add(askAQuestionButton);
37-
38-
const updateAskAQuestionButton = () => {
39-
const isSupportEnabled = osparc.store.Groups.getInstance().isSupportEnabled();
40-
askAQuestionButton.set({
41-
visibility: isSupportEnabled ? "visible" : "excluded",
42-
});
43-
}
44-
45-
updateAskAQuestionButton();
46-
osparc.store.Groups.getInstance().addListener("changeSupportGroup", () => updateAskAQuestionButton());
47-
},
48-
4922
__getQuickStartInfo: function() {
5023
const quickStart = osparc.product.quickStart.Utils.getQuickStart();
5124
if (quickStart) {

0 commit comments

Comments
 (0)