Skip to content

Filter for default-branch selection #29388

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 16 commits into from
Mar 8, 2024
Merged

Filter for default-branch selection #29388

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
c890e82
feature: filter branch in select default-branch view
zokkis Feb 25, 2024
94663f7
Merge branch 'main' into feature/filter-branches
zokkis Feb 25, 2024
5fe3a3f
use tailwind
zokkis Feb 25, 2024
941a921
Merge branch 'main' into feature/filter-branches
silverwind Mar 4, 2024
44a9d72
Don't use old helpers
zokkis Mar 4, 2024
4b907da
style dropdown
zokkis Mar 4, 2024
76c3d51
Merge branch 'main' into feature/filter-branches
zokkis Mar 7, 2024
a6df81f
feature: use search
zokkis Mar 7, 2024
c5f57a3
Update templates/repo/settings/branches.tmpl
silverwind Mar 7, 2024
b8f7a6e
Update web_src/js/components/RepoBranchTagSelector.vue
silverwind Mar 7, 2024
2f24ac1
Update web_src/css/repo.css
silverwind Mar 7, 2024
ca230a9
reset templates/repo/branch_dropdown.tmpl
zokkis Mar 7, 2024
bc49c6a
Merge branch 'main' into feature/filter-branches
GiteaBot Mar 8, 2024
a6a611f
Merge branch 'main' into feature/filter-branches
GiteaBot Mar 8, 2024
c32722e
Merge branch 'main' into feature/filter-branches
GiteaBot Mar 8, 2024
64181ca
Merge branch 'main' into feature/filter-branches
GiteaBot Mar 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 7 additions & 11 deletions templates/repo/settings/branches.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,20 +12,16 @@
<p>
{{ctx.Locale.Tr "repo.settings.default_branch_desc"}}
</p>
<form class="gt-df" action="{{.Link}}" method="post">
<form id="js-default-branch" class="gt-df" action="{{.Link}}" method="post">
{{.CsrfTokenHtml}}
<input type="hidden" name="action" value="default_branch">
<input type="hidden" name="branch" value="{{.Repository.DefaultBranch}}">
{{if not .Repository.IsEmpty}}
<div class="ui dropdown selection gt-f1 gt-mr-3 gt-max-width-24rem">
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
<input type="hidden" name="branch" value="{{.Repository.DefaultBranch}}">
<div class="default text">{{.Repository.DefaultBranch}}</div>
<div class="menu">
{{range .Branches}}
<div class="item" data-value="{{.}}">{{.}}</div>
{{end}}
</div>
</div>
{{template "repo/branch_dropdown" dict "root" .
"ContainerClasses" "tw-w-96 gt-mr-4"
"branchForm" "js-default-branch"
"noTag" true
}}
<button class="ui primary button">{{ctx.Locale.Tr "repo.settings.branches.update_default_branch"}}</button>
{{end}}
</form>
Expand Down
12 changes: 7 additions & 5 deletions web_src/js/components/RepoBranchTagSelector.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,9 +91,11 @@ const sfc = {
if (item.tag) {
this.isViewTag = true;
$(`#${this.branchForm} input[name="refType"]`).val('tag');
$(`#${this.branchForm} input[name="tag"]`).val(item.name);
} else {
this.isViewBranch = true;
$(`#${this.branchForm} input[name="refType"]`).val('branch');
$(`#${this.branchForm} input[name="branch"]`).val(item.name);
}
if (this.submitForm) {
$(`#${this.branchForm}`).trigger('submit');
Expand Down Expand Up @@ -244,14 +246,14 @@ export function initRepoBranchTagSelector(selector) {
export default sfc; // activate IDE's Vue plugin
</script>
<template>
<div class="ui dropdown custom">
<button class="branch-dropdown-button gt-ellipsis ui basic small compact button gt-df gt-m-0" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
<span class="text gt-df gt-ac gt-mr-2">
<div class="ui dropdown custom gt-w-full gt-h-full">
<button type="button" class="branch-dropdown-button gt-ellipsis ui basic small compact button gt-df gt-sb gt-m-0 gt-w-full gt-h-full" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
<span class="text gt-df gt-ac gt-mr-2 gt-ellipsis">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TBH, I am not a fan of filling these fine-tuning helpers everywhere.

Personally I have no motivation to approve .... but I won't block.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Then what's the point of having helper-classes?
Or do you have another idea to Do it better?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some opinions in my mind:

  • What's the purpose of using CSS file and CSS classes? If the helpers should be used everywhere, then why there are CSS classes like ".my-button". Using one or two helpers to fine-tune something seems good, but using 5-7 helpers seems to be quite hacky IMO.
  • Should it encourage to write reusable code? If the same helpers are written for more than one time, then why not introducing a clearly defined CSS class for it.

There is a long argument in the frontend development, some people really like using helpers as much as possible, but I really dislike abusing them.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see your point, but there are ups and downs to each approach.
Because its a vue-component I like the helper-classes more then normal css

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are still new classes has prefix gt- introduced. Could you replace them with tailwind?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And it's better to use plain javascript instead of jquery because we are removing jquery.

Copy link
Member

@silverwind silverwind Mar 4, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't mind the old classes, it keeps the diff minimal and they will later be replaced in a find-replace action anyways. But if you can, use new classes because otherwise we might run into conflicts with the refactoring PRs.

jQuery removal in this PR is also not needed or wanted as it would better be done in a whole-file rewrite later.

<template v-if="release">{{ textReleaseCompare }}</template>
<template v-else>
<svg-icon v-if="isViewTag" name="octicon-tag"/>
<svg-icon v-else name="octicon-git-branch"/>
<strong ref="dropdownRefName" class="gt-ml-3">{{ refNameText }}</strong>
<strong ref="dropdownRefName" class="gt-ml-3 gt-ellipsis">{{ refNameText }}</strong>
</template>
</span>
<svg-icon name="octicon-triangle-down" :size="14" class-name="dropdown icon"/>
Expand All @@ -261,7 +263,7 @@ export default sfc; // activate IDE's Vue plugin
<i class="icon"><svg-icon name="octicon-filter" :size="16"/></i>
<input name="search" ref="searchField" autocomplete="off" v-model="searchTerm" @keydown="keydown($event)" :placeholder="searchFieldPlaceholder">
</div>
<div v-if="showBranchesInDropdown" class="branch-tag-tab">
<div v-if="showBranchesInDropdown && !noTag" class="branch-tag-tab">
<a class="branch-tag-item muted" :class="{active: mode === 'branches'}" href="#" @click="handleTabSwitch('branches')">
<svg-icon name="octicon-git-branch" :size="16" class-name="gt-mr-2"/>{{ textBranches }}
</a>
Expand Down