remanso-space/remanso
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ (private repo) display if fav repo is priva…

Browse Source
This commit is contained in:
Julien Calixte
2021-03-19 23:54:20 +01:00
parent 68fdc6fda3
commit 2bd9cb8dd0
2 changed files with 78 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/hooks/useRepos.hook.ts
View File

@@ -19,11 +19,13 @@ export const useRepos = () => {
per_page: 100 per_page: 100
}) })
return repoList.data.items.map((item) => ({ return repoList.data.items
id: `${item.id}`, .map((item) => ({
name: item.name, id: `${item.id}`,
isPrivate: item.private name: item.name,
})) isPrivate: item.private
}))
.sort((a, b) => (a.name < b.name ? -1 : 1))
}, []) }, [])
return { return {

116
src/views/RepoList.vue
View File

@@ -1,55 +1,77 @@
<template> <template>
<div class="repo-list"> <div class="repo-list">
<go-back />
<h1 class="title is-1">Repositories</h1> <h1 class="title is-1">Repositories</h1>
<go-back />
<span v-if="!isReady">loading...</span> <span v-if="!isReady">loading...</span>
<div v-else class="columns is-centered"> <div v-else class="columns is-centered">
<div class="column is-one-third"> <div class="column is-one-third">
<table class="table is-striped is-hoverable is-fullwidth"> <table
<tr v-for="repo in favoriteRepos" :key="repo.id"> class="table is-striped is-hoverable"
<td> v-if="favoriteRepos.length > 0"
<input >
type="checkbox" <thead>
name="favorites" <tr>
:value="repo.id" <th></th>
:checked="favoriteCheckboxes.includes(repo.id)" <th>Favorites</th>
@click="toggleCheckbox(repo)" </tr>
/> </thead>
</td> <tbody>
<td> <tr v-for="repo in favoriteRepos" :key="repo.id">
<span v-if="repo.isPrivate">🔏</span> <td>
<input
type="checkbox"
name="favorites"
:value="repo.id"
:checked="favoriteCheckboxes.includes(repo.id)"
@click="toggleCheckbox(repo)"
/>
</td>
<td>
<span v-if="repo.isPrivate">🔏</span>
<router-link <router-link
:to="{ :to="{
name: 'Home', name: 'Home',
params: { user: username, repo: repo.name } params: { user: username, repo: repo.name }
}" }"
> >
{{ repo.name }} {{ repo.name }}
</router-link> </router-link>
</td> </td>
</tr> </tr>
<tr v-for="repo in otherRepos" :key="repo.id"> </tbody>
<td> </table>
<input <br v-if="favoriteRepos.length > 0" />
type="checkbox" <table class="table is-striped is-hoverable">
name="favorites" <thead>
:value="repo.id" <tr>
:checked="favoriteCheckboxes.includes(repo.id)" <th></th>
@click="toggleCheckbox(repo)" <th>Repos</th>
/> </tr>
</td> </thead>
<td> <tbody>
<router-link <tr v-for="repo in otherRepos" :key="repo.id">
:to="{ <td>
name: 'Home', <input
params: { user: username, repo: repo.name } type="checkbox"
}" name="favorites"
> :value="repo.id"
{{ repo.name }} :checked="favoriteCheckboxes.includes(repo.id)"
</router-link> @click="toggleCheckbox(repo)"
</td> />
</tr> </td>
<td>
<router-link
:to="{
name: 'Home',
params: { user: username, repo: repo.name }
}"
>
{{ repo.name }}
</router-link>
</td>
</tr>
</tbody>
</table> </table>
</div> </div>
</div> </div>
@@ -95,5 +117,9 @@ export default defineComponent({
text-align: center; text-align: center;
overflow-y: auto; overflow-y: auto;
table {
margin: auto;
}
} }
</style> </style>