diff --git a/conversejs/custom/plugins/notes/components/muc-note-occupant-view.js b/conversejs/custom/plugins/notes/components/muc-note-occupant-view.js
new file mode 100644
index 00000000..51ed79ae
--- /dev/null
+++ b/conversejs/custom/plugins/notes/components/muc-note-occupant-view.js
@@ -0,0 +1,28 @@
+// SPDX-FileCopyrightText: 2024 John Livingston
+//
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import { CustomElement } from 'shared/components/element.js'
+import { tplMucNoteOccupant } from '../templates/muc-note-occupant'
+import { api } from '@converse/headless'
+
+import '../styles/muc-note-occupant.scss'
+
+export default class MUCNoteOccupantView extends CustomElement {
+ static get properties () {
+ return {
+ model: { type: Object, attribute: true },
+ full_display: { type: Boolean, attribute: true }
+ }
+ }
+
+ async initialize () {
+ this.listenTo(this.model, 'change', () => this.requestUpdate())
+ }
+
+ render () {
+ return tplMucNoteOccupant(this, this.model)
+ }
+}
+
+api.elements.define('livechat-converse-muc-note-occupant', MUCNoteOccupantView)
diff --git a/conversejs/custom/plugins/notes/components/muc-notes-view.js b/conversejs/custom/plugins/notes/components/muc-notes-view.js
index ef5c9900..f16656fb 100644
--- a/conversejs/custom/plugins/notes/components/muc-notes-view.js
+++ b/conversejs/custom/plugins/notes/components/muc-notes-view.js
@@ -14,7 +14,8 @@ export default class MUCNotesView extends DraggablesCustomElement {
return {
model: { type: Object, attribute: true },
create_note_error_message: { type: String, attribute: false },
- create_note_opened: { type: Boolean, attribute: false }
+ create_note_opened: { type: Boolean, attribute: false },
+ create_note_for_occupant: { type: Object, attribute: false }
}
}
@@ -41,9 +42,10 @@ export default class MUCNotesView extends DraggablesCustomElement {
return tplMucNotes(this, this.model)
}
- async openCreateNoteForm (ev) {
+ async openCreateNoteForm (ev, occupant) {
ev?.preventDefault?.()
this.create_note_opened = true
+ this.create_note_for_occupant = occupant ?? undefined
await this.updateComplete
const textarea = this.querySelector('.notes-create-note textarea[name="description"]')
if (textarea) {
@@ -54,6 +56,7 @@ export default class MUCNotesView extends DraggablesCustomElement {
closeCreateNoteForm (ev) {
ev?.preventDefault?.()
this.create_note_opened = false
+ this.create_note_for_occupant = undefined
}
async submitCreateNote (ev) {
diff --git a/conversejs/custom/plugins/notes/index.js b/conversejs/custom/plugins/notes/index.js
index a1bd5d66..860ec9eb 100644
--- a/conversejs/custom/plugins/notes/index.js
+++ b/conversejs/custom/plugins/notes/index.js
@@ -11,6 +11,7 @@ import { initOrDestroyChatRoomNotes, getHeadingButtons, getMessageActionButtons
import './components/muc-note-app-view.js'
import './components/muc-notes-view.js'
import './components/muc-note-view.js'
+import './components/muc-note-occupant-view.js'
converse.plugins.add('livechat-converse-notes', {
dependencies: ['converse-muc', 'converse-disco', 'converse-pubsub'],
diff --git a/conversejs/custom/plugins/notes/styles/muc-note-occupant.scss b/conversejs/custom/plugins/notes/styles/muc-note-occupant.scss
new file mode 100644
index 00000000..18f3819a
--- /dev/null
+++ b/conversejs/custom/plugins/notes/styles/muc-note-occupant.scss
@@ -0,0 +1,34 @@
+/*
+ * SPDX-FileCopyrightText: 2024 John Livingston
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+.conversejs {
+ livechat-converse-muc-note-occupant {
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0.25em;
+
+ & > a {
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: center;
+
+ span {
+ font-weight: bold;
+ margin-left: 0.5em;
+ max-width: 200px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+
+ & > ul {
+ list-style: none;
+ text-align: right;
+ }
+ }
+}
diff --git a/conversejs/custom/plugins/notes/templates/muc-note-occupant.js b/conversejs/custom/plugins/notes/templates/muc-note-occupant.js
new file mode 100644
index 00000000..1ed19b9d
--- /dev/null
+++ b/conversejs/custom/plugins/notes/templates/muc-note-occupant.js
@@ -0,0 +1,37 @@
+// SPDX-FileCopyrightText: 2024 John Livingston
+//
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import { html } from 'lit'
+import { api } from '@converse/headless'
+import { getAuthorStyle } from '../../../../src/utils/color.js'
+import { __ } from 'i18n'
+
+export function tplMucNoteOccupant (el, occupant) {
+ const authorStyle = getAuthorStyle(occupant)
+ const jid = occupant.get('jid')
+ const occupantId = occupant.get('occupant_id')
+
+ return html`
+ {
+ api.modal.show('converse-muc-occupant-modal', { model: occupant }, ev)
+ }}>
+
+
+ ${occupant.getDisplayName()}
+
+ ${
+ el.full_display
+ ? html`
+ ${jid ? html`- ${jid}
` : ''}
+ ${occupantId ? html`- ${occupantId}
` : ''}
+
`
+ : ''
+ }
+ `
+}
diff --git a/conversejs/custom/plugins/notes/templates/muc-note.js b/conversejs/custom/plugins/notes/templates/muc-note.js
index 0eebcd4b..c60e966a 100644
--- a/conversejs/custom/plugins/notes/templates/muc-note.js
+++ b/conversejs/custom/plugins/notes/templates/muc-note.js
@@ -50,12 +50,32 @@ function _tplNoteForm (note) {
`
}
-export function tplMucCreateNoteForm (notesEl) {
+function _tplNoteOccupantFormFields (occupant) {
+ if (!occupant) { return '' }
+ return html`
+
+
+
+ `
+}
+
+export function tplMucCreateNoteForm (notesEl, occupant) {
const i18nOk = __('Ok')
const i18nCancel = __('Cancel')
return html`