Skip to content

Commit 72d9f96

Browse files
committed
enhance(repo): move delete to modal, add files to directory in file view and apply patch ui improvements.
1 parent 57782c3 commit 72d9f96

File tree

9 files changed

+230
-10
lines changed

9 files changed

+230
-10
lines changed

routers/web/repo/view_file.go

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -306,5 +306,11 @@ func prepareFileViewEditorButtons(ctx *context.Context) bool {
306306
ctx.Data["EditFileTooltip"] = util.Iif(isLFSLocked, ctx.Tr("repo.editor.this_file_locked"), ctx.Tr("repo.editor.edit_this_file"))
307307
ctx.Data["CanDeleteFile"] = !isLFSLocked
308308
ctx.Data["DeleteFileTooltip"] = util.Iif(isLFSLocked, ctx.Tr("repo.editor.this_file_locked"), ctx.Tr("repo.editor.delete_this_file"))
309+
310+
// Generate unique branch name for delete modal
311+
if ctx.Doer != nil {
312+
ctx.Data["new_branch_name"] = getUniquePatchBranchName(ctx, ctx.Doer.LowerName, ctx.Repo.Repository)
313+
}
314+
309315
return true
310316
}

templates/repo/editor/common_breadcrumb.tmpl

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,5 @@
1111
<span class="section"><a href="{{$.BranchLink}}/{{index $.TreePaths $i | PathEscapeSegments}}">{{$v}}</a></span>
1212
{{end}}
1313
{{end}}
14-
<span>{{ctx.Locale.Tr "repo.editor.or"}} <a href="{{or .ReturnURI (print $.BranchLink "/" (PathEscapeSegments .TreePath))}}">{{ctx.Locale.Tr "repo.editor.cancel_lower"}}</a></span>
1514
<input type="hidden" id="tree_path" name="tree_path" value="{{.TreePath}}">
1615
</div>

templates/repo/editor/patch.tmpl

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,11 +22,8 @@
2222
{{svg "octicon-sidebar-collapse"}}
2323
</button>
2424
<div class="breadcrumb">
25-
{{ctx.Locale.Tr "repo.editor.patching"}}
26-
<a class="section" href="{{$.RepoLink}}">{{.Repository.FullName}}</a>
27-
<div class="breadcrumb-divider">:</div>
25+
<span>{{ctx.Locale.Tr "repo.editor.patching"}}</span>
2826
<a class="section" href="{{$.BranchLink}}">{{.BranchName}}</a>
29-
<span>{{ctx.Locale.Tr "repo.editor.or"}} <a href="{{$.BranchLink}}">{{ctx.Locale.Tr "repo.editor.cancel_lower"}}</a></span>
3027
<input type="hidden" name="tree_path" value="__dummy_for_EditRepoFileForm.TreePath(Required)__">
3128
<input id="file-name" type="hidden" value="diff.patch">
3229
</div>

templates/repo/view_content.tmpl

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -66,24 +66,33 @@
6666
</div>
6767

6868
<div class="repo-button-row-right">
69-
{{if and .RefFullName.IsBranch (not .IsViewFile)}}
69+
{{if .RefFullName.IsBranch}}
70+
{{$addFilePath := .TreePath}}
71+
{{if .IsViewFile}}
72+
{{if gt (len .TreeNames) 1}}
73+
{{$addFilePath = StringUtils.Join (slice .TreeNames 0 (Eval (len .TreeNames) "-" 1)) "/"}}
74+
{{else}}
75+
{{$addFilePath = ""}}
76+
{{end}}
77+
{{end}}
7078
<button class="ui dropdown basic compact jump button repo-add-file" {{if not .Repository.CanEnableEditor}}disabled{{end}}>
7179
{{ctx.Locale.Tr "repo.editor.add_file"}}
7280
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
7381
<div class="menu">
74-
<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
82+
<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{$addFilePath | PathEscapeSegments}}">
7583
{{svg "octicon-file-added" 16 "tw-mr-2"}}{{ctx.Locale.Tr "repo.editor.new_file"}}
7684
</a>
7785
{{if .RepositoryUploadEnabled}}
78-
<a class="item" href="{{.RepoLink}}/_upload/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
86+
<a class="item" href="{{.RepoLink}}/_upload/{{.BranchName | PathEscapeSegments}}/{{$addFilePath | PathEscapeSegments}}">
7987
{{svg "octicon-upload" 16 "tw-mr-2"}}{{ctx.Locale.Tr "repo.editor.upload_file"}}
8088
</a>
8189
{{end}}
82-
<a class="item" href="{{.RepoLink}}/_diffpatch/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
90+
<a class="item" href="{{.RepoLink}}/_diffpatch/{{.BranchName | PathEscapeSegments}}/{{$addFilePath | PathEscapeSegments}}">
8391
{{svg "octicon-diff" 16 "tw-mr-2"}}{{ctx.Locale.Tr "repo.editor.patch"}}
8492
</a>
8593
</div>
8694
</button>
95+
{{if not .IsViewFile}}
8796
<button class="ui dropdown basic compact jump button icon repo-file-actions-dropdown" data-tooltip-content="{{ctx.Locale.Tr "repo.more_operations"}}">
8897
{{svg "octicon-kebab-horizontal"}}
8998
<div class="menu">
@@ -101,6 +110,7 @@
101110
{{end}}
102111
</div>
103112
</button>
113+
{{end}}
104114
{{end}}
105115
<!-- Only show clone panel in repository home page -->
106116
{{if $isTreePathRoot}}

templates/repo/view_file.tmpl

Lines changed: 72 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@
7474
<span class="btn-octicon disabled" data-tooltip-content="{{.EditFileTooltip}}">{{svg "octicon-pencil"}}</span>
7575
{{end}}
7676
{{if .CanDeleteFile}}
77-
<a class="btn-octicon btn-octicon-danger" data-tooltip-content="{{.DeleteFileTooltip}}" href="{{.RepoLink}}/_delete/{{PathEscapeSegments .BranchName}}/{{PathEscapeSegments .TreePath}}">{{svg "octicon-trash"}}</a>
77+
<a type="button" class="btn-octicon btn-octicon-danger" data-tooltip-content="{{.DeleteFileTooltip}}" id="delete-file-button">{{svg "octicon-trash"}}</a>
7878
{{else}}
7979
<span class="btn-octicon disabled" data-tooltip-content="{{.DeleteFileTooltip}}">{{svg "octicon-trash"}}</span>
8080
{{end}}
@@ -148,4 +148,75 @@
148148
<a class="item copy-line-permalink" role="menuitem" data-url="{{.Repository.Link}}/src/commit/{{PathEscape .CommitID}}/{{PathEscapeSegments .TreePath}}{{if $.HasSourceRenderedToggle}}?display=source{{end}}">{{ctx.Locale.Tr "repo.file_copy_permalink"}}</a>
149149
</div>
150150
</div>
151+
152+
{{/* Delete File Modal */}}
153+
{{if .CanDeleteFile}}
154+
<div class="ui modal" id="delete-file-modal">
155+
<i class="close icon"></i>
156+
<div class="content">
157+
<form id="delete-file-form" class="ui form form-fetch-action" method="post" action="{{.RepoLink}}/_delete/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
158+
{{.CsrfTokenHtml}}
159+
<input type="hidden" name="last_commit" value="{{.CommitID}}">
160+
<input type="hidden" name="tree_path" value="{{.TreePath}}">
161+
<div class="commit-form-wrapper">
162+
{{ctx.AvatarUtils.Avatar .SignedUser 40 "commit-avatar"}}
163+
<div class="commit-form avatar-content-left-arrow">
164+
<h3>
165+
<span>{{svg "octicon-unlock" 24}}</span>
166+
{{ctx.Locale.Tr "repo.editor.commit_changes"}}
167+
</h3>
168+
<div class="field">
169+
<input name="commit_summary" maxlength="100" placeholder="Delete {{.TreePath}}" value="Delete {{.TreePath}}" autofocus>
170+
</div>
171+
<div class="field">
172+
<textarea name="commit_message" placeholder="{{ctx.Locale.Tr "repo.editor.commit_message_desc"}}" rows="5"></textarea>
173+
</div>
174+
<div class="inline field">
175+
<div class="ui checkbox">
176+
<input name="signoff" type="checkbox">
177+
<label>{{ctx.Locale.Tr "repo.editor.signoff_desc"}}</label>
178+
</div>
179+
</div>
180+
<div class="quick-pull-choice">
181+
<div class="field">
182+
<div class="ui radio checkbox">
183+
<input type="radio" name="commit_choice" value="direct" checked>
184+
<label>
185+
{{svg "octicon-git-commit"}}
186+
{{ctx.Locale.Tr "repo.editor.commit_directly_to_this_branch" .BranchName}}
187+
</label>
188+
</div>
189+
</div>
190+
{{if not .Repository.IsEmpty}}
191+
<div class="field">
192+
<div class="ui radio checkbox">
193+
<input type="radio" name="commit_choice" value="commit-to-new-branch">
194+
<label>
195+
{{svg "octicon-git-pull-request"}}
196+
{{ctx.Locale.Tr "repo.editor.create_new_branch_np"}}
197+
</label>
198+
</div>
199+
</div>
200+
<div class="quick-pull-branch-name tw-hidden">
201+
<div class="new-branch-name-input field">
202+
{{svg "octicon-git-branch"}}
203+
<input type="text" name="new_branch_name" maxlength="100" value="{{.new_branch_name}}" class="input-contrast tw-mr-1" placeholder="{{ctx.Locale.Tr "repo.editor.new_branch_name_desc"}}" title="{{ctx.Locale.Tr "repo.editor.new_branch_name"}}">
204+
<span class="text-muted"></span>
205+
</div>
206+
</div>
207+
{{end}}
208+
</div>
209+
</div>
210+
</div>
211+
<div class="tw-text-right tw-mt-4">
212+
<button type="button" class="ui button" onclick="$('#delete-file-modal').modal('hide')">{{ctx.Locale.Tr "cancel"}}</button>
213+
<button type="submit" class="ui red button">
214+
{{svg "octicon-trash" 16}}
215+
{{ctx.Locale.Tr "repo.editor.delete_this_file"}}
216+
</button>
217+
</div>
218+
</form>
219+
</div>
220+
</div>
221+
{{end}}
151222
</div>

web_src/css/index.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@
6565
@import "./repo/file-view.css";
6666
@import "./repo/file-actions.css";
6767
@import "./repo/editor-commit.css";
68+
@import "./repo/delete-file.css";
6869
@import "./repo/wiki.css";
6970
@import "./repo/header.css";
7071
@import "./repo/home.css";

web_src/css/repo/delete-file.css

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
/* Delete file modal styling */
2+
#delete-file-modal {
3+
max-width: 680px;
4+
}
5+
6+
#delete-file-modal .content {
7+
padding: 1.5rem;
8+
}
9+
10+
#delete-file-modal .commit-form-wrapper {
11+
padding-left: 48px;
12+
position: relative;
13+
}
14+
15+
#delete-file-modal .commit-form-wrapper .commit-avatar {
16+
float: left;
17+
margin-left: -48px;
18+
}
19+
20+
#delete-file-modal .commit-form-wrapper .commit-form {
21+
position: relative;
22+
padding: 15px;
23+
border: 1px solid var(--color-secondary);
24+
border-radius: var(--border-radius);
25+
background-color: var(--color-box-body);
26+
}
27+
28+
#delete-file-modal .commit-form h3 {
29+
margin-top: 0;
30+
margin-bottom: 1rem;
31+
}
32+
33+
#delete-file-modal .commit-form .field {
34+
margin-bottom: 1rem;
35+
}
36+
37+
#delete-file-modal .commit-form input[name="commit_summary"] {
38+
width: 100%;
39+
padding: 10px 12px;
40+
font-size: 14px;
41+
}
42+
43+
#delete-file-modal .commit-form textarea[name="commit_message"] {
44+
width: 100%;
45+
padding: 10px 12px;
46+
font-size: 14px;
47+
}
48+
49+
#delete-file-modal .quick-pull-choice .field {
50+
margin-bottom: 0.75rem;
51+
}
52+
53+
#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .new-branch-name-input {
54+
position: relative;
55+
margin-left: 25px;
56+
}
57+
58+
#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .new-branch-name-input input {
59+
width: 240px !important;
60+
padding-left: 26px !important;
61+
}
62+
63+
#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .octicon-git-branch {
64+
position: absolute;
65+
top: 9px;
66+
left: 8px;
67+
}
68+
69+
/* Arrow pointing to avatar */
70+
#delete-file-modal .avatar-content-left-arrow::before,
71+
#delete-file-modal .avatar-content-left-arrow::after {
72+
right: 100%;
73+
top: 20px;
74+
border: solid transparent;
75+
content: " ";
76+
height: 0;
77+
width: 0;
78+
position: absolute;
79+
pointer-events: none;
80+
}
81+
82+
#delete-file-modal .avatar-content-left-arrow::before {
83+
border-right-color: var(--color-secondary);
84+
border-width: 9px;
85+
margin-top: -9px;
86+
}
87+
88+
#delete-file-modal .avatar-content-left-arrow::after {
89+
border-right-color: var(--color-box-body);
90+
border-width: 8px;
91+
margin-top: -8px;
92+
}
Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import $ from 'jquery';
2+
3+
export function initRepoDeleteFile() {
4+
const deleteButton = document.querySelector('#delete-file-button');
5+
const deleteModal = document.querySelector('#delete-file-modal');
6+
const deleteForm = document.querySelector<HTMLFormElement>('#delete-file-form');
7+
8+
if (!deleteButton || !deleteModal || !deleteForm) {
9+
return;
10+
}
11+
12+
deleteButton.addEventListener('click', (e) => {
13+
e.preventDefault();
14+
$(deleteModal).modal('show');
15+
});
16+
17+
// Handle form submission
18+
deleteForm.addEventListener('submit', () => {
19+
$(deleteModal).modal('hide');
20+
});
21+
22+
// Handle commit choice radio buttons
23+
const commitChoiceRadios = deleteForm.querySelectorAll<HTMLInputElement>('input[name="commit_choice"]');
24+
const newBranchNameContainer = deleteForm.querySelector('.quick-pull-branch-name');
25+
const newBranchNameInput = deleteForm.querySelector<HTMLInputElement>('input[name="new_branch_name"]');
26+
27+
for (const radio of commitChoiceRadios) {
28+
radio.addEventListener('change', () => {
29+
if (radio.value === 'commit-to-new-branch') {
30+
newBranchNameContainer?.classList.remove('tw-hidden');
31+
if (newBranchNameInput) {
32+
newBranchNameInput.required = true;
33+
}
34+
} else {
35+
newBranchNameContainer?.classList.add('tw-hidden');
36+
if (newBranchNameInput) {
37+
newBranchNameInput.required = false;
38+
}
39+
}
40+
});
41+
}
42+
}

web_src/js/index-domready.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ import {initUserAuthWebAuthn, initUserAuthWebAuthnRegister} from './features/use
3535
import {initRepoRelease, initRepoReleaseNew} from './features/repo-release.ts';
3636
import {initRepoEditor} from './features/repo-editor.ts';
3737
import {initRepoEditorCommit} from './features/repo-editor-commit.ts';
38+
import {initRepoDeleteFile} from './features/repo-delete-file.ts';
3839
import {initCompSearchUserBox} from './features/comp/SearchUserBox.ts';
3940
import {initInstall} from './features/install.ts';
4041
import {initCompWebHookEditor} from './features/comp/WebHookEditor.ts';
@@ -125,6 +126,7 @@ const initPerformanceTracer = callInitFunctions([
125126
initRepoDiffCommitBranchesAndTags,
126127
initRepoEditor,
127128
initRepoEditorCommit,
129+
initRepoDeleteFile,
128130
initRepoGraphGit,
129131
initRepoIssueContentHistory,
130132
initRepoIssueList,

0 commit comments

Comments
 (0)