fix: mount the code editor in its own container so duplicated message renders don't collide (#27740)

src/lib/components/channel/Messages/Message.svelte

@@ -49,7 +49,7 @@
 
 	export let showUserProfile = true;
 	export let thread = false;
-	export let id = null;
+	export let id: string | null = null;
 
 	export let replyToMessage = false;
 	export let disabled = false;

src/lib/components/channel/PinnedMessagesModal.svelte

@@ -103,6 +103,7 @@
 								{:else}
 									{#each pinnedMessages as message, messageIdx (message.id)}
 										<Message
+											id="pinned"
 											className="rounded-xl px-2"
 											{message}
 											{channel}

src/lib/components/common/CodeEditor.svelte

@@ -79,6 +79,7 @@
 	export let lang = '';
 
 	let codeEditor: EditorView | null = null;
+	let codeEditorContainerElement: HTMLDivElement | undefined = undefined;
 
 	export const focus = () => {
 		codeEditor?.focus();
@@ -249,7 +250,7 @@ print("${endTag}")
 				doc: _value,
 				extensions: extensions
 			}),
-			parent: document.getElementById(`code-textarea-${id}`)
+			parent: codeEditorContainerElement
 		});
 
 		if (isDarkMode) {
@@ -319,4 +320,8 @@ print("${endTag}")
 	});
 </script>
 
-<div id="code-textarea-{id}" class="{className} h-full w-full min-w-0 overflow-hidden" />
+<div
+	bind:this={codeEditorContainerElement}
+	id="code-textarea-{id}"
+	class="{className} h-full w-full min-w-0 overflow-hidden"
+/>