<script setup lang="ts">
interface Commit {
  sha: string
  created: string
  commit: {
    message: string
  }
  author: {
    username: string
    avatar_url: string
  }
}

const { isFetching, error, data } = useFetch('https://git.thehrz.net/api/v1/repos/19yuke2-project/19yuke2/commits?stat=false&limit=3').json<Commit[]>()
</script>

<template>
  <v-card>
    <v-alert
      v-if="isFetching"
      type="info"
      title="加载中"
    />

    <v-alert
      v-else-if="error"
      type="error"
      title="加载错误"
      text="无法加载ChangeLog，请刷新重试。"
    />

    <v-list v-else>
      <v-list-item
        v-for="commit in data"
        :key="commit.commit.message" :title="commit.commit.message"
        :subtitle="`${commit.sha.slice(0, 6)} ${commit.created}`"
      />
    </v-list>
  </v-card>
</template>
