@catandbox/schrodinger-web-adapter 0.1.21 → 0.1.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/ticket-detail.js +34 -5
- package/package.json +1 -1
|
@@ -35,9 +35,14 @@ export async function renderTicketDetail(container, client, ticketId, emitter) {
|
|
|
35
35
|
</s-card>
|
|
36
36
|
`;
|
|
37
37
|
try {
|
|
38
|
-
const data = await
|
|
38
|
+
const [data, portalConfig] = await Promise.all([
|
|
39
|
+
client.getTicket(ticketId),
|
|
40
|
+
client.getPortalConfig().catch(() => ({ categories: [], aliases: [] }))
|
|
41
|
+
]);
|
|
39
42
|
const { ticket, messages } = data;
|
|
40
43
|
const isOpen = ticket.status !== "Closed" && ticket.status !== "Archived";
|
|
44
|
+
const aliasMap = new Map(portalConfig.aliases.map((a) => [a.id, a]));
|
|
45
|
+
const assignedAlias = ticket.assignedAliasId ? (aliasMap.get(ticket.assignedAliasId) ?? null) : null;
|
|
41
46
|
setInnerHtml(container, `
|
|
42
47
|
<s-card>
|
|
43
48
|
<s-box padding="large">
|
|
@@ -67,6 +72,23 @@ export async function renderTicketDetail(container, client, ticketId, emitter) {
|
|
|
67
72
|
</s-box>
|
|
68
73
|
</s-card>
|
|
69
74
|
|
|
75
|
+
${assignedAlias
|
|
76
|
+
? `
|
|
77
|
+
<s-card style="margin-top:16px;">
|
|
78
|
+
<s-box padding="base large">
|
|
79
|
+
<div style="display:flex; align-items:center; gap:10px;">
|
|
80
|
+
<div style="width:36px; height:36px; border-radius:50%; background:var(--p-color-bg-fill-info, #e4f0fe); display:flex; align-items:center; justify-content:center; flex-shrink:0;">
|
|
81
|
+
<span style="font-size:13px; font-weight:700; color:var(--p-color-text-info, #2c6ecb);">${escapeHtml(getInitials(assignedAlias.displayName))}</span>
|
|
82
|
+
</div>
|
|
83
|
+
<div>
|
|
84
|
+
<s-text variant="bodySm" fontWeight="semibold">${escapeHtml(assignedAlias.displayName)}</s-text>
|
|
85
|
+
<div><s-text variant="bodySm" tone="subdued">${escapeHtml(assignedAlias.department)}</s-text></div>
|
|
86
|
+
</div>
|
|
87
|
+
</div>
|
|
88
|
+
</s-box>
|
|
89
|
+
</s-card>`
|
|
90
|
+
: ""}
|
|
91
|
+
|
|
70
92
|
<div id="sch-messages-list" style="margin-top:16px;">
|
|
71
93
|
${messages.length === 0
|
|
72
94
|
? `
|
|
@@ -78,7 +100,7 @@ export async function renderTicketDetail(container, client, ticketId, emitter) {
|
|
|
78
100
|
</s-box>
|
|
79
101
|
</s-card>`
|
|
80
102
|
: `<div style="display:flex; flex-direction:column; gap:2px;">
|
|
81
|
-
${messages.map((msg) => renderMessage(msg)).join("")}
|
|
103
|
+
${messages.map((msg) => renderMessage(msg, aliasMap.get(msg.authorAliasId ?? "") ?? null)).join("")}
|
|
82
104
|
</div>`}
|
|
83
105
|
</div>
|
|
84
106
|
|
|
@@ -194,7 +216,14 @@ export async function renderTicketDetail(container, client, ticketId, emitter) {
|
|
|
194
216
|
});
|
|
195
217
|
}
|
|
196
218
|
}
|
|
197
|
-
function
|
|
219
|
+
function getInitials(displayName) {
|
|
220
|
+
const parts = displayName.trim().split(/\s+/);
|
|
221
|
+
if (parts.length >= 2) {
|
|
222
|
+
return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
|
|
223
|
+
}
|
|
224
|
+
return displayName.slice(0, 2).toUpperCase();
|
|
225
|
+
}
|
|
226
|
+
function renderMessage(msg, alias) {
|
|
198
227
|
const isSystem = msg.authorType === "system";
|
|
199
228
|
const isAgent = msg.authorType === "agent" || msg.authorType === "admin";
|
|
200
229
|
const isCustomer = !isSystem && !isAgent;
|
|
@@ -211,8 +240,8 @@ function renderMessage(msg) {
|
|
|
211
240
|
const avatarColor = isAgent
|
|
212
241
|
? "var(--p-color-text-info, #2c6ecb)"
|
|
213
242
|
: "var(--p-color-text-success, #008060)";
|
|
214
|
-
const avatarLetter = isAgent ? "S" : "Y";
|
|
215
|
-
const label = isAgent ? "Support" : "You";
|
|
243
|
+
const avatarLetter = isAgent ? (alias ? getInitials(alias.displayName) : "S") : "Y";
|
|
244
|
+
const label = isAgent ? (alias ? alias.displayName : "Support") : "You";
|
|
216
245
|
const bubbleBg = isCustomer
|
|
217
246
|
? "var(--p-color-bg-fill-info, #e4f0fe)"
|
|
218
247
|
: "var(--p-color-bg-surface-secondary, #f6f6f7)";
|