mirror of
				https://codeberg.org/forgejo/forgejo.git
				synced 2025-11-04 00:11:04 +00:00 
			
		
		
		
	Remove (almost) server side data rendering from repo-search component (#2317)
* Rename some shorthands * Remove (almost) server side data rendering from repo-search component template
This commit is contained in:
		
					parent
					
						
							
								2c6a0fdca8
							
						
					
				
			
			
				commit
				
					
						7455604f0c
					
				
			
		
					 2 changed files with 74 additions and 46 deletions
				
			
		| 
						 | 
					@ -1687,13 +1687,33 @@ function initVueComponents(){
 | 
				
			||||||
                type: Number,
 | 
					                type: Number,
 | 
				
			||||||
                required: true
 | 
					                required: true
 | 
				
			||||||
            },
 | 
					            },
 | 
				
			||||||
 | 
					            organizations: {
 | 
				
			||||||
 | 
					                type: Array,
 | 
				
			||||||
 | 
					                default: []
 | 
				
			||||||
 | 
					            },
 | 
				
			||||||
 | 
					            isOrganization: {
 | 
				
			||||||
 | 
					                type: Boolean,
 | 
				
			||||||
 | 
					                default: true
 | 
				
			||||||
 | 
					            },
 | 
				
			||||||
 | 
					            canCreateOrganization: {
 | 
				
			||||||
 | 
					                type: Boolean,
 | 
				
			||||||
 | 
					                default: false
 | 
				
			||||||
 | 
					            },
 | 
				
			||||||
 | 
					            organizationsTotalCount: {
 | 
				
			||||||
 | 
					                type: Number,
 | 
				
			||||||
 | 
					                default: 0
 | 
				
			||||||
 | 
					            },
 | 
				
			||||||
 | 
					            moreReposLink: {
 | 
				
			||||||
 | 
					                type: String,
 | 
				
			||||||
 | 
					                default: ''
 | 
				
			||||||
 | 
					            }
 | 
				
			||||||
        },
 | 
					        },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        data: function() {
 | 
					        data: function() {
 | 
				
			||||||
            return {
 | 
					            return {
 | 
				
			||||||
                tab: 'repos',
 | 
					                tab: 'repos',
 | 
				
			||||||
                repos: [],
 | 
					                repos: [],
 | 
				
			||||||
                reposTotal: 0,
 | 
					                reposTotalCount: 0,
 | 
				
			||||||
                reposFilter: 'all',
 | 
					                reposFilter: 'all',
 | 
				
			||||||
                searchQuery: '',
 | 
					                searchQuery: '',
 | 
				
			||||||
                isLoading: false
 | 
					                isLoading: false
 | 
				
			||||||
| 
						 | 
					@ -1741,7 +1761,7 @@ function initVueComponents(){
 | 
				
			||||||
                    if (searchedQuery == self.searchQuery) {
 | 
					                    if (searchedQuery == self.searchQuery) {
 | 
				
			||||||
                        self.repos = result.data;
 | 
					                        self.repos = result.data;
 | 
				
			||||||
                        if (searchedQuery == "") {
 | 
					                        if (searchedQuery == "") {
 | 
				
			||||||
                            self.reposTotal = request.getResponseHeader('X-Total-Count');
 | 
					                            self.reposTotalCount = request.getResponseHeader('X-Total-Count');
 | 
				
			||||||
                        }
 | 
					                        }
 | 
				
			||||||
                    }
 | 
					                    }
 | 
				
			||||||
                }).always(function() {
 | 
					                }).always(function() {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -8,19 +8,34 @@
 | 
				
			||||||
				{{template "user/dashboard/feeds" .}}
 | 
									{{template "user/dashboard/feeds" .}}
 | 
				
			||||||
			</div>
 | 
								</div>
 | 
				
			||||||
			<div id="app" class="six wide column">
 | 
								<div id="app" class="six wide column">
 | 
				
			||||||
				<repo-search :search-limit="searchLimit" :suburl="suburl" :uid="uid" inline-template v-cloak>
 | 
									<repo-search
 | 
				
			||||||
					<div>
 | 
										:search-limit="searchLimit"
 | 
				
			||||||
						{{if not .ContextUser.IsOrganization}}
 | 
										:suburl="suburl"
 | 
				
			||||||
						<div class="ui two item stackable tabable menu">
 | 
										:uid="uid"
 | 
				
			||||||
							<a :class="{item: true, active: tab === 'repos'}" @click="changeTab('repos')">{{.i18n.Tr "repository"}}</a>
 | 
										:more-repos-link="'{{.ContextUser.HomeLink}}'"
 | 
				
			||||||
							<a :class="{item: true, active: tab === 'orgs'}" @click="changeTab('orgs')">{{.i18n.Tr "organization"}}</a>
 | 
										{{if not .ContextUser.IsOrganization}}
 | 
				
			||||||
						</div>
 | 
										:organizations="[
 | 
				
			||||||
 | 
											{{range .ContextUser.Orgs}}
 | 
				
			||||||
 | 
											{name: '{{.Name}}', num_repos: '{{.NumRepos}}'},
 | 
				
			||||||
						{{end}}
 | 
											{{end}}
 | 
				
			||||||
						<div v-if="tab === 'repos'" class="ui tab active list">
 | 
										]"
 | 
				
			||||||
 | 
										: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 stackable 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">
 | 
				
			||||||
							<h4 class="ui top attached header">
 | 
												<h4 class="ui top attached header">
 | 
				
			||||||
								{{.i18n.Tr "home.my_repos"}} <span class="ui grey label">${ reposTotal }</span>
 | 
													{{.i18n.Tr "home.my_repos"}} <span class="ui grey label">${reposTotalCount}</span>
 | 
				
			||||||
								<div class="ui right">
 | 
													<div class="ui right">
 | 
				
			||||||
									<a class="poping up" href="{{AppSubUrl}}/repo/create" data-content="{{.i18n.Tr "new_repo"}}" data-variation="tiny inverted" data-position="left center">
 | 
														<a class="poping up" :href="suburl + '/repo/create>'" data-content="{{.i18n.Tr "new_repo"}}" data-variation="tiny inverted" data-position="left center">
 | 
				
			||||||
										<i class="plus icon"></i>
 | 
															<i class="plus icon"></i>
 | 
				
			||||||
										<span class="sr-only">{{.i18n.Tr "new_repo"}}</span>
 | 
															<span class="sr-only">{{.i18n.Tr "new_repo"}}</span>
 | 
				
			||||||
									</a>
 | 
														</a>
 | 
				
			||||||
| 
						 | 
					@ -42,51 +57,44 @@
 | 
				
			||||||
							<div class="ui attached table segment">
 | 
												<div class="ui attached table segment">
 | 
				
			||||||
								<ul class="repo-owner-name-list">
 | 
													<ul class="repo-owner-name-list">
 | 
				
			||||||
									<li v-for="repo in repos" :class="{'private': repo.private}" v-show="showRepo(repo, reposFilter)">
 | 
														<li v-for="repo in repos" :class="{'private': repo.private}" v-show="showRepo(repo, reposFilter)">
 | 
				
			||||||
										<a :href="'{{AppSubUrl}}/' + repo.full_name">
 | 
															<a :href="suburl + '/' + repo.full_name">
 | 
				
			||||||
											<i :class="repoClass(repo)"></i>
 | 
																<i :class="repoClass(repo)"></i>
 | 
				
			||||||
											<strong class="text truncate item-name">${ repo.full_name }</strong>
 | 
																<strong class="text truncate item-name">${repo.full_name}</strong>
 | 
				
			||||||
											<span class="ui right text light grey">
 | 
																<span class="ui right text light grey">
 | 
				
			||||||
												${ repo.stars_count } <i class="octicon octicon-star rear"></i>
 | 
																	${repo.stars_count} <i class="octicon octicon-star rear"></i>
 | 
				
			||||||
											</span>
 | 
																</span>
 | 
				
			||||||
										</a>
 | 
															</a>
 | 
				
			||||||
									</li>
 | 
														</li>
 | 
				
			||||||
									<li v-if="repos.length < reposTotal">
 | 
														<li v-if="repos.length < reposTotalCount">
 | 
				
			||||||
										<a href="{{.ContextUser.HomeLink}}">{{.i18n.Tr "home.show_more_repos"}}</a>
 | 
															<a :href="moreReposLink">{{.i18n.Tr "home.show_more_repos"}}</a>
 | 
				
			||||||
									</li>
 | 
														</li>
 | 
				
			||||||
								</ul>
 | 
													</ul>
 | 
				
			||||||
							</div>
 | 
												</div>
 | 
				
			||||||
						</div>
 | 
											</div>
 | 
				
			||||||
 | 
											<div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list">
 | 
				
			||||||
						{{if not .ContextUser.IsOrganization}}
 | 
												<h4 class="ui top attached header">
 | 
				
			||||||
							<div v-if="tab === 'orgs'" class="ui tab active list">
 | 
													{{.i18n.Tr "home.my_orgs"}} <span class="ui grey label">${organizationsTotalCount}</span>
 | 
				
			||||||
								<h4 class="ui top attached header">
 | 
													<div v-if="canCreateOrganization" class="ui right">
 | 
				
			||||||
									{{.i18n.Tr "home.my_orgs"}} <span class="ui grey label">{{.ContextUser.GetOrganizationCount}}</span>
 | 
														<a class="poping up" :href="suburl + '/org/create'" data-content="{{.i18n.Tr "new_org"}}" data-variation="tiny inverted" data-position="left center">
 | 
				
			||||||
									<div class="ui right">
 | 
															<i class="plus icon"></i>
 | 
				
			||||||
										{{if .SignedUser.CanCreateOrganization}}
 | 
															<span class="sr-only">{{.i18n.Tr "new_org"}}</span>
 | 
				
			||||||
										<a class="poping up" href="{{AppSubUrl}}/org/create" data-content="{{.i18n.Tr "new_org"}}" data-variation="tiny inverted" data-position="left center">
 | 
														</a>
 | 
				
			||||||
											<i class="plus icon"></i>
 | 
					 | 
				
			||||||
											<span class="sr-only">{{.i18n.Tr "new_org"}}</span>
 | 
					 | 
				
			||||||
										</a>
 | 
					 | 
				
			||||||
										{{end}}
 | 
					 | 
				
			||||||
									</div>
 | 
					 | 
				
			||||||
								</h4>
 | 
					 | 
				
			||||||
								<div class="ui attached table segment">
 | 
					 | 
				
			||||||
									<ul class="repo-owner-name-list">
 | 
					 | 
				
			||||||
										{{range .ContextUser.Orgs}}
 | 
					 | 
				
			||||||
											<li>
 | 
					 | 
				
			||||||
												<a href="{{AppSubUrl}}/{{.Name}}">
 | 
					 | 
				
			||||||
													<i class="octicon octicon-organization"></i>
 | 
					 | 
				
			||||||
													<strong class="text truncate item-name">{{.Name}}</strong>
 | 
					 | 
				
			||||||
													<span class="ui right text light grey">
 | 
					 | 
				
			||||||
														{{.NumRepos}} <i class="octicon octicon-repo rear"></i>
 | 
					 | 
				
			||||||
													</span>
 | 
					 | 
				
			||||||
												</a>
 | 
					 | 
				
			||||||
											</li>
 | 
					 | 
				
			||||||
										{{end}}
 | 
					 | 
				
			||||||
									</ul>
 | 
					 | 
				
			||||||
								</div>
 | 
													</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">
 | 
				
			||||||
 | 
																<i class="octicon octicon-organization"></i>
 | 
				
			||||||
 | 
																<strong class="text truncate item-name">${org.name}</strong>
 | 
				
			||||||
 | 
																<span class="ui right text light grey">
 | 
				
			||||||
 | 
																	${org.num_repos} <i class="octicon octicon-repo rear"></i>
 | 
				
			||||||
 | 
																</span>
 | 
				
			||||||
 | 
															</a>
 | 
				
			||||||
 | 
														</li>
 | 
				
			||||||
 | 
													</ul>
 | 
				
			||||||
							</div>
 | 
												</div>
 | 
				
			||||||
						{{end}}
 | 
											</div>
 | 
				
			||||||
					</div>
 | 
										</div>
 | 
				
			||||||
				</repo-search>
 | 
									</repo-search>
 | 
				
			||||||
			</div>
 | 
								</div>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue