phundrak.com/content/.vuepress/components/GitHub/FetchRepositories.vue
Lucien Cartier-Tilet 1885072da2
All checks were successful
continuous-integration/drone/push Build is passing
feat: better repository card
2023-05-08 15:57:45 +02:00

50 lines
1.1 KiB
Vue

<template>
<ApiLoader :url="fetchUrl" @dataLoaded="filterRepos" cache-name="repos" />
<slot />
</template>
<script setup lang="ts">
import { PropType } from 'vue';
import { GithubRepo } from '../../composables/github';
const props = defineProps({
sortBy: {
default: 'none',
required: false,
type: String as PropType<'stars' | 'forks' | 'pushed_at'>,
},
user: {
default: '',
required: true,
type: String,
},
limit: {
default: 5,
required: false,
type: Number,
},
});
const emits = defineEmits(['dataLoaded']);
const fetchUrl = `https://api.github.com/users/${props.user}/repos?per_page=100`;
const filterRepos = (response: GithubRepo[]) => {
emits(
'dataLoaded',
response
.sort((a, b) => {
if (props.sortBy === 'stars') {
return b.stargazers_count - a.stargazers_count;
}
if (props.sortBy === 'pushed_at') {
const dateA = new Date(a.pushed_at);
const dateB = new Date(b.pushed_at);
return dateB.getTime() - dateA.getTime();
}
return b.forks_count - a.forks_count;
})
.slice(0, +props.limit)
);
};
</script>