src/components/ChatWindow.vue

<script setup lang="ts">
import type { ChatPair } from '@/types/chat'
import MessagePair from './MessagePair.vue'

defineProps<{
  pairs: ChatPair[]
}>()
</script>

<template>
  <div class="chat-window">
    <MessagePair v-for="(pair, index) in pairs" :key="index" :pair="pair" />
  </div>
</template>

<style scoped>
.chat-window {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  padding-bottom: 1rem;
}
</style>