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

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

<template>
  <v-card>
    <p v-if="isFetching">
      Loading...
    </p>
    <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.author.username}`"
      />
    </v-list>
  </v-card>
</template>

<style scoped></style>
