<script lang="ts">
import { provideConfirmService, type ConfirmService } from '$lib/shared/services/confirm.svelte.js';
import TranscriptionBlock from './TranscriptionBlock.svelte';
import type { PersonMention } from '$lib/shared/types';

type BlockProps = {
	blockId: string;
	documentId: string;
	blockNumber: number;
	text: string;
	mentionedPersons?: PersonMention[];
	label: string | null;
	active: boolean;
	saveState: 'idle' | 'saving' | 'saved' | 'fading' | 'error';
	canComment: boolean;
	currentUserId: string | null;
	onTextChange: (text: string, mentionedPersons: PersonMention[]) => void;
	onFocus: () => void;
	onDeleteClick: () => void;
	onRetry: () => void;
	onReviewToggle?: () => void;
	onMoveUp?: () => void;
	onMoveDown?: () => void;
	isFirst?: boolean;
	isLast?: boolean;
};

let {
	onServiceReady,
	mentionedPersons = [],
	reviewed = false,
	onReviewToggle = () => {},
	...blockProps
}: BlockProps & {
	onServiceReady: (s: ConfirmService) => void;
	reviewed?: boolean;
} = $props();

const service = provideConfirmService();
onServiceReady(service);
</script>

<TranscriptionBlock
	{...blockProps}
	mentionedPersons={mentionedPersons}
	reviewed={reviewed}
	onReviewToggle={onReviewToggle}
/>
