73 lines
2.3 KiB
JavaScript
73 lines
2.3 KiB
JavaScript
class MessagesSidebar extends Shadow {
|
|
conversations = []
|
|
selectedConvoID
|
|
onSelect
|
|
|
|
constructor(conversations, selectedConvoID, onSelect) {
|
|
super()
|
|
this.conversations = conversations
|
|
this.selectedConvoID = selectedConvoID
|
|
this.onSelect = onSelect
|
|
}
|
|
|
|
render() {
|
|
VStack(() => {
|
|
this.conversations.forEach((convo, i) => {
|
|
|
|
VStack(() => {
|
|
HStack(() => {
|
|
|
|
p(this.makeConvoTitle(convo.between))
|
|
.textAlign("left")
|
|
.marginLeft(0.5, inches)
|
|
.paddingTop(0.2, inches)
|
|
.width(100, pct)
|
|
.marginTop(0)
|
|
.fontSize(1, em)
|
|
.fontWeight("bold")
|
|
|
|
p(util.formatTime(convo.messages.last.time))
|
|
.paddingTop(0.2, inches)
|
|
.fontSize(0.8, em)
|
|
.marginRight(0.1, inches)
|
|
.color("var(--divider")
|
|
})
|
|
.justifyContent("space-between")
|
|
.marginBottom(0)
|
|
|
|
p(convo.messages.last.text)
|
|
.fontSize(0.8, em)
|
|
.textAlign("left")
|
|
.marginLeft(0.5, inches)
|
|
.marginBottom(2, em)
|
|
.color("var(--divider)")
|
|
})
|
|
.background(convo.id === this.selectedConvoID ? "var(--darkbrown)" : "")
|
|
.onClick(() => {
|
|
this.onSelect(i)
|
|
})
|
|
})
|
|
})
|
|
.minWidth(15, vw)
|
|
.height(100, vh)
|
|
.gap(0, em)
|
|
}
|
|
|
|
makeConvoTitle(members) {
|
|
let membersString = ""
|
|
for(let i=0; i<members.length; i++) {
|
|
let member = members[i]
|
|
if(member.email === global.profile.email) {
|
|
continue;
|
|
}
|
|
if(members.length > 2) {
|
|
membersString += member.firstName
|
|
} else {
|
|
membersString += member.firstName + " " + member.lastName
|
|
}
|
|
}
|
|
return membersString
|
|
}
|
|
}
|
|
|
|
register(MessagesSidebar) |