<template>
	<header class="conversation-header">
		<div class="conversation-header__title-line">
			<p class="eyebrow">当前路径</p>
			<el-tag
				v-if="sessionKind === 'group'"
				size="small"
				type="warning"
				style="margin-left: 8px"
			>微信群</el-tag>
			<el-tag
				v-else-if="sessionKind === 'dm'"
				size="small"
				type="primary"
				style="margin-left: 8px"
			>微信 DM</el-tag>
			<h1>{{ title }}</h1>
		</div>
		<div class="conversation-header__meta">
			<span>{{ entryCount }} 条消息</span>
			<span>存储 {{ sessionProviderLabel }}</span>
			<span>工作目录 {{ sessionCwdLabel }}</span>
			<span>恢复历史 {{ restoreLastSessionLabel }}</span>
		</div>
	</header>
</template>

<script lang="ts" setup>
defineProps<{
	title: string;
	entryCount: number;
	sessionProviderLabel: string;
	sessionCwdLabel: string;
	restoreLastSessionLabel: string;
	sessionKind?: 'dm' | 'group' | 'other';
}>();
</script>
