From 72d9f964556bf9f1fdc42c783d6f9d5ceb19e184 Mon Sep 17 00:00:00 2001 From: brymut Date: Sat, 15 Nov 2025 11:54:28 +0300 Subject: [PATCH] enhance(repo): move delete to modal, add files to directory in file view and apply patch ui improvements. --- routers/web/repo/view_file.go | 6 ++ templates/repo/editor/common_breadcrumb.tmpl | 1 - templates/repo/editor/patch.tmpl | 5 +- templates/repo/view_content.tmpl | 18 +++- templates/repo/view_file.tmpl | 73 +++++++++++++++- web_src/css/index.css | 1 + web_src/css/repo/delete-file.css | 92 ++++++++++++++++++++ web_src/js/features/repo-delete-file.ts | 42 +++++++++ web_src/js/index-domready.ts | 2 + 9 files changed, 230 insertions(+), 10 deletions(-) create mode 100644 web_src/css/repo/delete-file.css create mode 100644 web_src/js/features/repo-delete-file.ts diff --git a/routers/web/repo/view_file.go b/routers/web/repo/view_file.go index ea3920439d..e37d0a576a 100644 --- a/routers/web/repo/view_file.go +++ b/routers/web/repo/view_file.go @@ -306,5 +306,11 @@ func prepareFileViewEditorButtons(ctx *context.Context) bool { ctx.Data["EditFileTooltip"] = util.Iif(isLFSLocked, ctx.Tr("repo.editor.this_file_locked"), ctx.Tr("repo.editor.edit_this_file")) ctx.Data["CanDeleteFile"] = !isLFSLocked ctx.Data["DeleteFileTooltip"] = util.Iif(isLFSLocked, ctx.Tr("repo.editor.this_file_locked"), ctx.Tr("repo.editor.delete_this_file")) + + // Generate unique branch name for delete modal + if ctx.Doer != nil { + ctx.Data["new_branch_name"] = getUniquePatchBranchName(ctx, ctx.Doer.LowerName, ctx.Repo.Repository) + } + return true } diff --git a/templates/repo/editor/common_breadcrumb.tmpl b/templates/repo/editor/common_breadcrumb.tmpl index 8cfbe09d3e..e91648d612 100644 --- a/templates/repo/editor/common_breadcrumb.tmpl +++ b/templates/repo/editor/common_breadcrumb.tmpl @@ -11,6 +11,5 @@ {{$v}} {{end}} {{end}} - {{ctx.Locale.Tr "repo.editor.or"}} {{ctx.Locale.Tr "repo.editor.cancel_lower"}} diff --git a/templates/repo/editor/patch.tmpl b/templates/repo/editor/patch.tmpl index 8cbb03ca09..72c23e3050 100644 --- a/templates/repo/editor/patch.tmpl +++ b/templates/repo/editor/patch.tmpl @@ -22,11 +22,8 @@ {{svg "octicon-sidebar-collapse"}}
- {{ctx.Locale.Tr "repo.editor.patching"}} - {{.Repository.FullName}} -
:
+ {{ctx.Locale.Tr "repo.editor.patching"}} {{.BranchName}} - {{ctx.Locale.Tr "repo.editor.or"}} {{ctx.Locale.Tr "repo.editor.cancel_lower"}}
diff --git a/templates/repo/view_content.tmpl b/templates/repo/view_content.tmpl index 1fff13ea7c..04a16543d6 100644 --- a/templates/repo/view_content.tmpl +++ b/templates/repo/view_content.tmpl @@ -66,24 +66,33 @@
- {{if and .RefFullName.IsBranch (not .IsViewFile)}} + {{if .RefFullName.IsBranch}} + {{$addFilePath := .TreePath}} + {{if .IsViewFile}} + {{if gt (len .TreeNames) 1}} + {{$addFilePath = StringUtils.Join (slice .TreeNames 0 (Eval (len .TreeNames) "-" 1)) "/"}} + {{else}} + {{$addFilePath = ""}} + {{end}} + {{end}} + {{if not .IsViewFile}} + {{end}} {{end}} {{if $isTreePathRoot}} diff --git a/templates/repo/view_file.tmpl b/templates/repo/view_file.tmpl index 8fce1b6f2c..a02c282dc6 100644 --- a/templates/repo/view_file.tmpl +++ b/templates/repo/view_file.tmpl @@ -74,7 +74,7 @@ {{svg "octicon-pencil"}} {{end}} {{if .CanDeleteFile}} - {{svg "octicon-trash"}} + {{svg "octicon-trash"}} {{else}} {{svg "octicon-trash"}} {{end}} @@ -148,4 +148,75 @@ {{ctx.Locale.Tr "repo.file_copy_permalink"}}
+ + {{/* Delete File Modal */}} + {{if .CanDeleteFile}} + + {{end}} diff --git a/web_src/css/index.css b/web_src/css/index.css index 53ed8c6909..c4d3a22157 100644 --- a/web_src/css/index.css +++ b/web_src/css/index.css @@ -65,6 +65,7 @@ @import "./repo/file-view.css"; @import "./repo/file-actions.css"; @import "./repo/editor-commit.css"; +@import "./repo/delete-file.css"; @import "./repo/wiki.css"; @import "./repo/header.css"; @import "./repo/home.css"; diff --git a/web_src/css/repo/delete-file.css b/web_src/css/repo/delete-file.css new file mode 100644 index 0000000000..be211434ce --- /dev/null +++ b/web_src/css/repo/delete-file.css @@ -0,0 +1,92 @@ +/* Delete file modal styling */ +#delete-file-modal { + max-width: 680px; +} + +#delete-file-modal .content { + padding: 1.5rem; +} + +#delete-file-modal .commit-form-wrapper { + padding-left: 48px; + position: relative; +} + +#delete-file-modal .commit-form-wrapper .commit-avatar { + float: left; + margin-left: -48px; +} + +#delete-file-modal .commit-form-wrapper .commit-form { + position: relative; + padding: 15px; + border: 1px solid var(--color-secondary); + border-radius: var(--border-radius); + background-color: var(--color-box-body); +} + +#delete-file-modal .commit-form h3 { + margin-top: 0; + margin-bottom: 1rem; +} + +#delete-file-modal .commit-form .field { + margin-bottom: 1rem; +} + +#delete-file-modal .commit-form input[name="commit_summary"] { + width: 100%; + padding: 10px 12px; + font-size: 14px; +} + +#delete-file-modal .commit-form textarea[name="commit_message"] { + width: 100%; + padding: 10px 12px; + font-size: 14px; +} + +#delete-file-modal .quick-pull-choice .field { + margin-bottom: 0.75rem; +} + +#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .new-branch-name-input { + position: relative; + margin-left: 25px; +} + +#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .new-branch-name-input input { + width: 240px !important; + padding-left: 26px !important; +} + +#delete-file-modal .commit-form-wrapper .commit-form .quick-pull-choice .octicon-git-branch { + position: absolute; + top: 9px; + left: 8px; +} + +/* Arrow pointing to avatar */ +#delete-file-modal .avatar-content-left-arrow::before, +#delete-file-modal .avatar-content-left-arrow::after { + right: 100%; + top: 20px; + border: solid transparent; + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; +} + +#delete-file-modal .avatar-content-left-arrow::before { + border-right-color: var(--color-secondary); + border-width: 9px; + margin-top: -9px; +} + +#delete-file-modal .avatar-content-left-arrow::after { + border-right-color: var(--color-box-body); + border-width: 8px; + margin-top: -8px; +} diff --git a/web_src/js/features/repo-delete-file.ts b/web_src/js/features/repo-delete-file.ts new file mode 100644 index 0000000000..08435966c6 --- /dev/null +++ b/web_src/js/features/repo-delete-file.ts @@ -0,0 +1,42 @@ +import $ from 'jquery'; + +export function initRepoDeleteFile() { + const deleteButton = document.querySelector('#delete-file-button'); + const deleteModal = document.querySelector('#delete-file-modal'); + const deleteForm = document.querySelector('#delete-file-form'); + + if (!deleteButton || !deleteModal || !deleteForm) { + return; + } + + deleteButton.addEventListener('click', (e) => { + e.preventDefault(); + $(deleteModal).modal('show'); + }); + + // Handle form submission + deleteForm.addEventListener('submit', () => { + $(deleteModal).modal('hide'); + }); + + // Handle commit choice radio buttons + const commitChoiceRadios = deleteForm.querySelectorAll('input[name="commit_choice"]'); + const newBranchNameContainer = deleteForm.querySelector('.quick-pull-branch-name'); + const newBranchNameInput = deleteForm.querySelector('input[name="new_branch_name"]'); + + for (const radio of commitChoiceRadios) { + radio.addEventListener('change', () => { + if (radio.value === 'commit-to-new-branch') { + newBranchNameContainer?.classList.remove('tw-hidden'); + if (newBranchNameInput) { + newBranchNameInput.required = true; + } + } else { + newBranchNameContainer?.classList.add('tw-hidden'); + if (newBranchNameInput) { + newBranchNameInput.required = false; + } + } + }); + } +} diff --git a/web_src/js/index-domready.ts b/web_src/js/index-domready.ts index 367a6736db..f44a844760 100644 --- a/web_src/js/index-domready.ts +++ b/web_src/js/index-domready.ts @@ -35,6 +35,7 @@ import {initUserAuthWebAuthn, initUserAuthWebAuthnRegister} from './features/use import {initRepoRelease, initRepoReleaseNew} from './features/repo-release.ts'; import {initRepoEditor} from './features/repo-editor.ts'; import {initRepoEditorCommit} from './features/repo-editor-commit.ts'; +import {initRepoDeleteFile} from './features/repo-delete-file.ts'; import {initCompSearchUserBox} from './features/comp/SearchUserBox.ts'; import {initInstall} from './features/install.ts'; import {initCompWebHookEditor} from './features/comp/WebHookEditor.ts'; @@ -125,6 +126,7 @@ const initPerformanceTracer = callInitFunctions([ initRepoDiffCommitBranchesAndTags, initRepoEditor, initRepoEditorCommit, + initRepoDeleteFile, initRepoGraphGit, initRepoIssueContentHistory, initRepoIssueList,