Split dashboard elements into separate template files (#10885)
* Split dashboard elements into separate template files No code change just Move Heatmap and Repo list/search into separate template files (like feeds and navbar already are). This will let a user more easily replace dashboard.tmpl without regularly becoming out of sync with fixes or changes to the actual code. Fixes #10870 * End file with an empty line Co-authored-by: zeripath <art27@cantab.net>
This commit is contained in:
mrsdizzie
GitHub
parent
bdfe4e258f
commit
972b3bf3b0
3 changed files with 119 additions and 117 deletions
|
|
@ -6,126 +6,11 @@
|
||||||
<div class="ui mobile reversed stackable grid">
|
<div class="ui mobile reversed stackable grid">
|
||||||
<div class="ui container ten wide column">
|
<div class="ui container ten wide column">
|
||||||
{{if .EnableHeatmap}}
|
{{if .EnableHeatmap}}
|
||||||
<div id="user-heatmap" style="padding-right: 40px">
|
{{template "user/dashboard/heatmap" .}}
|
||||||
<activity-heatmap :locale="locale" :suburl="suburl" :user="heatmapUser">
|
|
||||||
<div slot="loading">
|
|
||||||
<div class="ui active centered inline indeterminate text loader" id="loading-heatmap">{{.i18n.Tr "user.heatmap.loading"}}</div>
|
|
||||||
</div>
|
|
||||||
</activity-heatmap>
|
|
||||||
<div class="ui divider"></div>
|
|
||||||
</div>
|
|
||||||
{{end}}
|
{{end}}
|
||||||
{{template "user/dashboard/feeds" .}}
|
{{template "user/dashboard/feeds" .}}
|
||||||
</div>
|
</div>
|
||||||
<div id="app" class="six wide column">
|
{{template "user/dashboard/repolist" .}}
|
||||||
<repo-search
|
|
||||||
:search-limit="searchLimit"
|
|
||||||
:suburl="suburl"
|
|
||||||
:uid="uid"
|
|
||||||
:more-repos-link="'{{.ContextUser.HomeLink}}'"
|
|
||||||
{{if not .ContextUser.IsOrganization}}
|
|
||||||
:organizations="[
|
|
||||||
{{range .ContextUser.Orgs}}
|
|
||||||
{name: '{{.Name}}', num_repos: '{{.NumRepos}}'},
|
|
||||||
{{end}}
|
|
||||||
]"
|
|
||||||
:is-organization="false"
|
|
||||||
:organizations-total-count="{{.ContextUser.GetOrganizationCount}}"
|
|
||||||
:can-create-organization="{{.SignedUser.CanCreateOrganization}}"
|
|
||||||
{{end}}
|
|
||||||
inline-template
|
|
||||||
v-cloak
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
<div v-if="!isOrganization" class="ui two item tabable menu">
|
|
||||||
<a :class="{item: true, active: tab === 'repos'}" @click="changeTab('repos')">{{.i18n.Tr "repository"}}</a>
|
|
||||||
<a :class="{item: true, active: tab === 'organizations'}" @click="changeTab('organizations')">{{.i18n.Tr "organization"}}</a>
|
|
||||||
</div>
|
|
||||||
<div v-show="tab === 'repos'" class="ui tab active list dashboard-repos">
|
|
||||||
<h4 class="ui top attached header">
|
|
||||||
{{.i18n.Tr "home.my_repos"}} <span class="ui grey label">${reposTotalCount}</span>
|
|
||||||
{{if or (not .ContextUser.IsOrganization) .IsOrganizationOwner}}
|
|
||||||
<div class="ui right">
|
|
||||||
<a class="poping up" :href="suburl + '/repo/create{{if .ContextUser.IsOrganization}}?org={{.ContextUser.ID}}{{end}}'" data-content="{{.i18n.Tr "new_repo"}}" data-variation="tiny inverted" data-position="left center">
|
|
||||||
<i class="plus icon"></i>
|
|
||||||
<span class="sr-only">{{.i18n.Tr "new_repo"}}</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
{{end}}
|
|
||||||
</h4>
|
|
||||||
<div class="ui attached secondary segment repos-search">
|
|
||||||
<div class="ui fluid icon input" :class="{loading: isLoading}">
|
|
||||||
<input @input="searchRepos(reposFilter)" v-model="searchQuery" ref="search" placeholder="{{.i18n.Tr "home.search_repos"}}">
|
|
||||||
<i class="search icon"></i>
|
|
||||||
</div>
|
|
||||||
<div class="ui secondary tiny pointing borderless menu center aligned grid repos-filter">
|
|
||||||
<a class="item" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">
|
|
||||||
{{.i18n.Tr "all"}}
|
|
||||||
<div v-show="reposFilter === 'all'" class="ui circular mini grey label">${repoTypeCount}</div>
|
|
||||||
</a>
|
|
||||||
<a class="item" :class="{active: reposFilter === 'sources'}" @click="changeReposFilter('sources')">
|
|
||||||
{{.i18n.Tr "sources"}}
|
|
||||||
<div v-show="reposFilter === 'sources'" class="ui circular mini grey label">${repoTypeCount}</div>
|
|
||||||
</a>
|
|
||||||
<a class="item" :class="{active: reposFilter === 'forks'}" @click="changeReposFilter('forks')">
|
|
||||||
{{.i18n.Tr "forks"}}
|
|
||||||
<div v-show="reposFilter === 'forks'" class="ui circular mini grey label">${repoTypeCount}</div>
|
|
||||||
</a>
|
|
||||||
<a class="item" :class="{active: reposFilter === 'mirrors'}" @click="changeReposFilter('mirrors')">
|
|
||||||
{{.i18n.Tr "mirrors"}}
|
|
||||||
<div v-show="reposFilter === 'mirrors'" class="ui circular mini grey label">${repoTypeCount}</div>
|
|
||||||
</a>
|
|
||||||
<a class="item" :class="{active: reposFilter === 'collaborative'}" @click="changeReposFilter('collaborative')">
|
|
||||||
{{.i18n.Tr "collaborative"}}
|
|
||||||
<div v-show="reposFilter === 'collaborative'" class="ui circular mini grey label">${repoTypeCount}</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="ui attached table segment">
|
|
||||||
<ul class="repo-owner-name-list">
|
|
||||||
<li v-for="repo in repos" :class="{'private': repo.private}" v-show="showRepo(repo, reposFilter)">
|
|
||||||
<a :href="suburl + '/' + repo.full_name">
|
|
||||||
<svg :class="'svg ' + repoClass(repo)" width="16" height="16" aria-hidden="true"><use :xlink:href="'#' + repoClass(repo)" /></svg>
|
|
||||||
<strong class="text truncate item-name">${repo.full_name}</strong>
|
|
||||||
<i v-if="repo.archived" class="archive icon archived-icon"></i>
|
|
||||||
<span class="ui right text light grey">
|
|
||||||
${repo.stars_count} <span class="rear">{{svg "octicon-star" 16}}</span>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li v-if="showMoreReposLink">
|
|
||||||
<a :href="moreReposLink">{{.i18n.Tr "home.show_more_repos"}}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list">
|
|
||||||
<h4 class="ui top attached header">
|
|
||||||
{{.i18n.Tr "home.my_orgs"}} <span class="ui grey label">${organizationsTotalCount}</span>
|
|
||||||
<div v-if="canCreateOrganization" class="ui right">
|
|
||||||
<a class="poping up" :href="suburl + '/org/create'" data-content="{{.i18n.Tr "new_org"}}" data-variation="tiny inverted" data-position="left center">
|
|
||||||
<i class="plus icon"></i>
|
|
||||||
<span class="sr-only">{{.i18n.Tr "new_org"}}</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</h4>
|
|
||||||
<div class="ui attached table segment">
|
|
||||||
<ul class="repo-owner-name-list">
|
|
||||||
<li v-for="org in organizations">
|
|
||||||
<a :href="suburl + '/' + org.name">
|
|
||||||
{{svg "octicon-organization" 16}}
|
|
||||||
<strong class="text truncate item-name">${org.name}</strong>
|
|
||||||
<span class="ui right text light grey">
|
|
||||||
${org.num_repos} <span class="rear">{{svg "octicon-repo" 16}}</span>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</repo-search>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
8
templates/user/dashboard/heatmap.tmpl
Normal file
8
templates/user/dashboard/heatmap.tmpl
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
<div id="user-heatmap" style="padding-right: 40px">
|
||||||
|
<activity-heatmap :locale="locale" :suburl="suburl" :user="heatmapUser">
|
||||||
|
<div slot="loading">
|
||||||
|
<div class="ui active centered inline indeterminate text loader" id="loading-heatmap">{{.i18n.Tr "user.heatmap.loading"}}</div>
|
||||||
|
</div>
|
||||||
|
</activity-heatmap>
|
||||||
|
<div class="ui divider"></div>
|
||||||
|
</div>
|
||||||
109
templates/user/dashboard/repolist.tmpl
Normal file
109
templates/user/dashboard/repolist.tmpl
Normal file
|
|
@ -0,0 +1,109 @@
|
||||||
|
<div id="app" class="six wide column">
|
||||||
|
<repo-search
|
||||||
|
:search-limit="searchLimit"
|
||||||
|
:suburl="suburl"
|
||||||
|
:uid="uid"
|
||||||
|
:more-repos-link="'{{.ContextUser.HomeLink}}'"
|
||||||
|
{{if not .ContextUser.IsOrganization}}
|
||||||
|
:organizations="[
|
||||||
|
{{range .ContextUser.Orgs}}
|
||||||
|
{name: '{{.Name}}', num_repos: '{{.NumRepos}}'},
|
||||||
|
{{end}}
|
||||||
|
]"
|
||||||
|
:is-organization="false"
|
||||||
|
:organizations-total-count="{{.ContextUser.GetOrganizationCount}}"
|
||||||
|
:can-create-organization="{{.SignedUser.CanCreateOrganization}}"
|
||||||
|
{{end}}
|
||||||
|
inline-template
|
||||||
|
v-cloak
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div v-if="!isOrganization" class="ui two item tabable menu">
|
||||||
|
<a :class="{item: true, active: tab === 'repos'}" @click="changeTab('repos')">{{.i18n.Tr "repository"}}</a>
|
||||||
|
<a :class="{item: true, active: tab === 'organizations'}" @click="changeTab('organizations')">{{.i18n.Tr "organization"}}</a>
|
||||||
|
</div>
|
||||||
|
<div v-show="tab === 'repos'" class="ui tab active list dashboard-repos">
|
||||||
|
<h4 class="ui top attached header">
|
||||||
|
{{.i18n.Tr "home.my_repos"}} <span class="ui grey label">${reposTotalCount}</span>
|
||||||
|
{{if or (not .ContextUser.IsOrganization) .IsOrganizationOwner}}
|
||||||
|
<div class="ui right">
|
||||||
|
<a class="poping up" :href="suburl + '/repo/create{{if .ContextUser.IsOrganization}}?org={{.ContextUser.ID}}{{end}}'" data-content="{{.i18n.Tr "new_repo"}}" data-variation="tiny inverted" data-position="left center">
|
||||||
|
<i class="plus icon"></i>
|
||||||
|
<span class="sr-only">{{.i18n.Tr "new_repo"}}</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
|
</h4>
|
||||||
|
<div class="ui attached secondary segment repos-search">
|
||||||
|
<div class="ui fluid icon input" :class="{loading: isLoading}">
|
||||||
|
<input @input="searchRepos(reposFilter)" v-model="searchQuery" ref="search" placeholder="{{.i18n.Tr "home.search_repos"}}">
|
||||||
|
<i class="search icon"></i>
|
||||||
|
</div>
|
||||||
|
<div class="ui secondary tiny pointing borderless menu center aligned grid repos-filter">
|
||||||
|
<a class="item" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">
|
||||||
|
{{.i18n.Tr "all"}}
|
||||||
|
<div v-show="reposFilter === 'all'" class="ui circular mini grey label">${repoTypeCount}</div>
|
||||||
|
</a>
|
||||||
|
<a class="item" :class="{active: reposFilter === 'sources'}" @click="changeReposFilter('sources')">
|
||||||
|
{{.i18n.Tr "sources"}}
|
||||||
|
<div v-show="reposFilter === 'sources'" class="ui circular mini grey label">${repoTypeCount}</div>
|
||||||
|
</a>
|
||||||
|
<a class="item" :class="{active: reposFilter === 'forks'}" @click="changeReposFilter('forks')">
|
||||||
|
{{.i18n.Tr "forks"}}
|
||||||
|
<div v-show="reposFilter === 'forks'" class="ui circular mini grey label">${repoTypeCount}</div>
|
||||||
|
</a>
|
||||||
|
<a class="item" :class="{active: reposFilter === 'mirrors'}" @click="changeReposFilter('mirrors')">
|
||||||
|
{{.i18n.Tr "mirrors"}}
|
||||||
|
<div v-show="reposFilter === 'mirrors'" class="ui circular mini grey label">${repoTypeCount}</div>
|
||||||
|
</a>
|
||||||
|
<a class="item" :class="{active: reposFilter === 'collaborative'}" @click="changeReposFilter('collaborative')">
|
||||||
|
{{.i18n.Tr "collaborative"}}
|
||||||
|
<div v-show="reposFilter === 'collaborative'" class="ui circular mini grey label">${repoTypeCount}</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ui attached table segment">
|
||||||
|
<ul class="repo-owner-name-list">
|
||||||
|
<li v-for="repo in repos" :class="{'private': repo.private}" v-show="showRepo(repo, reposFilter)">
|
||||||
|
<a :href="suburl + '/' + repo.full_name">
|
||||||
|
<svg :class="'svg ' + repoClass(repo)" width="16" height="16" aria-hidden="true"><use :xlink:href="'#' + repoClass(repo)" /></svg>
|
||||||
|
<strong class="text truncate item-name">${repo.full_name}</strong>
|
||||||
|
<i v-if="repo.archived" class="archive icon archived-icon"></i>
|
||||||
|
<span class="ui right text light grey">
|
||||||
|
${repo.stars_count} <span class="rear">{{svg "octicon-star" 16}}</span>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li v-if="showMoreReposLink">
|
||||||
|
<a :href="moreReposLink">{{.i18n.Tr "home.show_more_repos"}}</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list">
|
||||||
|
<h4 class="ui top attached header">
|
||||||
|
{{.i18n.Tr "home.my_orgs"}} <span class="ui grey label">${organizationsTotalCount}</span>
|
||||||
|
<div v-if="canCreateOrganization" class="ui right">
|
||||||
|
<a class="poping up" :href="suburl + '/org/create'" data-content="{{.i18n.Tr "new_org"}}" data-variation="tiny inverted" data-position="left center">
|
||||||
|
<i class="plus icon"></i>
|
||||||
|
<span class="sr-only">{{.i18n.Tr "new_org"}}</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</h4>
|
||||||
|
<div class="ui attached table segment">
|
||||||
|
<ul class="repo-owner-name-list">
|
||||||
|
<li v-for="org in organizations">
|
||||||
|
<a :href="suburl + '/' + org.name">
|
||||||
|
{{svg "octicon-organization" 16}}
|
||||||
|
<strong class="text truncate item-name">${org.name}</strong>
|
||||||
|
<span class="ui right text light grey">
|
||||||
|
${org.num_repos} <span class="rear">{{svg "octicon-repo" 16}}</span>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</repo-search>
|
||||||
|
</div>
|
||||||
Reference in a new issue