enh: channel read/write perm

src/lib/components/channel/Channel.svelte

@@ -14,6 +14,7 @@
 	import Drawer from '../common/Drawer.svelte';
 	import EllipsisVertical from '../icons/EllipsisVertical.svelte';
 	import Thread from './Thread.svelte';
+	import i18n from '$lib/i18n';
 
 	export let id = '';
 
@@ -252,6 +253,10 @@
 					{typingUsers}
 					userSuggestions={true}
 					channelSuggestions={true}
+					disabled={!channel?.write_access}
+					placeholder={!channel?.write_access
+						? $i18n.t('You do not have permission to send messages in this channel.')
+						: $i18n.t('Type here...')}
 					{onChange}
 					onSubmit={submitHandler}
 					{scrollToBottom}

src/lib/components/channel/MessageInput.svelte

@@ -38,7 +38,7 @@
 	import MentionList from './MessageInput/MentionList.svelte';
 	import Skeleton from '../chat/Messages/Skeleton.svelte';
 
-	export let placeholder = $i18n.t('Send a Message');
+	export let placeholder = $i18n.t('Type here...');
 
 	export let id = null;
 	export let chatInputElement;
@@ -53,6 +53,7 @@
 	export let scrollEnd = true;
 	export let scrollToBottom: Function = () => {};
 
+	export let disabled = false;
 	export let acceptFiles = true;
 	export let showFormattingToolbar = true;
 
@@ -731,7 +732,9 @@
 				</div>
 			</div>
 
-			<div class="">
+			<div
+				class="{disabled ? 'opacity-50 pointer-events-none cursor-not-allowed' : ''} relative z-20"
+			>
 				{#if recording}
 					<VoiceRecording
 						bind:recording
@@ -836,6 +839,8 @@
 											bind:this={chatInputElement}
 											json={true}
 											messageInput={true}
+											editable={!disabled}
+											{placeholder}
 											richText={$settings?.richTextInput ?? true}
 											showFormattingToolbar={$settings?.showFormattingToolbar ?? false}
 											shiftEnter={!($settings?.ctrlEnterToSend ?? false) &&

src/lib/components/channel/Thread.svelte

@@ -201,6 +201,10 @@
 			<div class=" pb-[1rem] px-2.5 w-full">
 				<MessageInput
 					id={threadId}
+					disabled={!channel?.write_access}
+					placeholder={!channel?.write_access
+						? $i18n.t('You do not have permission to send messages in this thread.')
+						: $i18n.t('Reply to thread...')}
 					typingUsersClassName="from-gray-50 dark:from-gray-850"
 					{typingUsers}
 					userSuggestions={true}

src/lib/components/common/RichTextInput.svelte

@@ -168,7 +168,7 @@
 	export let documentId = '';
 
 	export let className = 'input-prose';
-	export let placeholder = 'Type here...';
+	export let placeholder = $i18n.t('Type here...');
 	let _placeholder = placeholder;
 
 	$: if (placeholder !== _placeholder) {
@@ -689,7 +689,7 @@
 					link: link
 				}),
 				...(dragHandle ? [ListItemDragHandle] : []),
-				Placeholder.configure({ placeholder: () => _placeholder }),
+				Placeholder.configure({ placeholder: () => _placeholder, showOnlyWhenEditable: false }),
 				SelectionDecoration,
 
 				...(richText
@@ -1123,4 +1123,9 @@
 	</div>
 {/if}
 
-<div bind:this={element} class="relative w-full min-w-full h-full min-h-fit {className}" />
+<div
+	bind:this={element}
+	class="relative w-full min-w-full h-full min-h-fit {className} {!editable
+		? 'cursor-not-allowed'
+		: ''}"
+/>

src/lib/components/layout/Sidebar/ChannelModal.svelte

@@ -126,7 +126,7 @@
 
 					<div class="my-2 -mx-2">
 						<div class="px-4 py-3 bg-gray-50 dark:bg-gray-950 rounded-3xl">
-							<AccessControl bind:accessControl />
+							<AccessControl bind:accessControl accessRoles={['read', 'write']} />
 						</div>
 					</div>