diff --git a/src/components/RightSidebar/Participants/Participant.vue b/src/components/RightSidebar/Participants/Participant.vue
index 8e2a9abd2669..881b76926094 100644
--- a/src/components/RightSidebar/Participants/Participant.vue
+++ b/src/components/RightSidebar/Participants/Participant.vue
@@ -318,17 +318,21 @@
{{ t('spreed', 'Also ban from this conversation') }}
-
+
+ {{ maxLengthWarning }}
+
{{ t('spreed', 'Dismiss') }}
-
+
{{ t('spreed', 'Remove') }}
@@ -376,7 +380,7 @@ import NcActionText from '@nextcloud/vue/dist/Components/NcActionText.js'
import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
-import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
+import NcTextArea from '@nextcloud/vue/dist/Components/NcTextArea.js'
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
import ParticipantPermissionsEditor from './ParticipantPermissionsEditor.vue'
@@ -411,7 +415,7 @@ export default {
NcButton,
NcCheckboxRadioSwitch,
NcDialog,
- NcTextField,
+ NcTextArea,
ParticipantPermissionsEditor,
// Icons
Account,
@@ -801,6 +805,16 @@ export default {
|| this.participant.actorType === ATTENDEE.ACTOR_TYPE.EMAILS)
},
+ maxLengthWarning() {
+ if (this.internalNote.length <= 4000) {
+ return ''
+ }
+ return t('spreed', 'The text must be less than or equal to {maxLength} characters long. Your current text is {charactersCount} characters long.', {
+ maxLength: 4000,
+ charactersCount: this.internalNote.length,
+ })
+ },
+
removeParticipantLabel() {
switch (this.participant.actorType) {
case ATTENDEE.ACTOR_TYPE.GROUPS:
@@ -1261,6 +1275,9 @@ export default {
&__input {
margin-block-end: 6px;
}
+ &__error-hint {
+ color: var(--color-error);
+ }
}
.utils {