<script lang="ts">
import CommentThread from './CommentThread.svelte';
import type { Comment } from '$lib/types';

type Props = {
	documentId: string;
	initialComments: Comment[];
	canComment: boolean;
	currentUserId: string | null;
	canAdmin: boolean;
	targetCommentId?: string | null;
	onCountChange?: (count: number) => void;
};

let {
	documentId,
	initialComments,
	canComment,
	currentUserId,
	canAdmin,
	targetCommentId = null,
	onCountChange
}: Props = $props();
</script>

<div class="flex-1 overflow-y-auto p-6">
	<CommentThread
		documentId={documentId}
		initialComments={initialComments}
		canComment={canComment}
		currentUserId={currentUserId}
		canAdmin={canAdmin}
		targetCommentId={targetCommentId}
		onCountChange={onCountChange}
	/>
</div>
