[FEAT]Allow changing git notes (#4753)

Git has a cool feature called git notes. It allows adding a text to a commit without changing the commit itself. Forgejo already displays git notes. With this PR you can also now change git notes.

<details>
<summary>Screenshots</summary>

![grafik](/attachments/53a9546b-c4db-4b07-92ae-eb15b209b21d)
![grafik](/attachments/1bd96f2c-6178-45d2-93d7-d19c7cbe5898)
![grafik](/attachments/9ea73623-25d1-4628-a43f-f5ecbd431788)
![grafik](/attachments/efea0c9e-43c6-4441-bb7e-948177bf9021)

</details>

## Checklist

The [developer guide](https://forgejo.org/docs/next/developer/) contains information that will be helpful to first time contributors. There also are a few [conditions for merging Pull Requests in Forgejo repositories](https://codeberg.org/forgejo/governance/src/branch/main/PullRequestsAgreement.md). You are also welcome to join the [Forgejo development chatroom](https://matrix.to/#/#forgejo-development:matrix.org).

### Tests

- I added test coverage for Go changes...
  - [ ] in their respective `*_test.go` for unit tests.
  - [x] in the `tests/integration` directory if it involves interactions with a live Forgejo server.
- I added test coverage for JavaScript changes...
  - [ ] in `web_src/js/*.test.js` if it can be unit tested.
  - [ ] in `tests/e2e/*.test.e2e.js` if it requires interactions with a live Forgejo server (see also the [developer guide for JavaScript testing](https://codeberg.org/forgejo/forgejo/src/branch/forgejo/tests/e2e/README.md#end-to-end-tests)).

### Documentation

- [ ] I created a pull request [to the documentation](https://codeberg.org/forgejo/docs) to explain to Forgejo users how to use this change.
- [x] I did not document these changes and I do not expect someone else to do it.

### Release notes

- [ ] I do not want this change to show in the release notes.
- [x] I want the title to show in the release notes with a link to this pull request.
- [ ] I want the content of the `release-notes/<pull request number>.md` to be be used for the release notes instead of the title.

<!--start release-notes-assistant-->

## Release notes
<!--URL:https://codeberg.org/forgejo/forgejo-->
- Features
  - [PR](https://codeberg.org/forgejo/forgejo/pulls/4753): <!--number 4753 --><!--line 0 --><!--description QWxsb3cgY2hhbmdpbmcgZ2l0IG5vdGVz-->Allow changing git notes<!--description-->
<!--end release-notes-assistant-->

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/4753
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: JakobDev <jakobdev@gmx.de>
Co-committed-by: JakobDev <jakobdev@gmx.de>

2 files changed, 20 insertions, 1 deletions

diff --git a/web_src/js/features/repo-commit.js b/web_src/js/features/repo-commit.js
index f61ea08a42..88887d1110 100644
--- a/web_src/js/features/repo-commit.js
+++ b/web_src/js/features/repo-commit.js
@@ -25,3 +25,21 @@ export function initCommitStatuses() {
     });
   }
 }
+
+export function initCommitNotes() {
+  const notesEditButton = document.getElementById('commit-notes-edit-button');
+  if (notesEditButton !== null) {
+    notesEditButton.addEventListener('click', () => {
+      document.getElementById('commit-notes-display-area').classList.add('tw-hidden');
+      document.getElementById('commit-notes-edit-area').classList.remove('tw-hidden');
+    });
+  }
+
+  const notesAddButton = document.getElementById('commit-notes-add-button');
+  if (notesAddButton !== null) {
+    notesAddButton.addEventListener('click', () => {
+      notesAddButton.classList.add('tw-hidden');
+      document.getElementById('commit-notes-add-area').classList.remove('tw-hidden');
+    });
+  }
+}
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 80aff9e59e..bab1abfa36 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -33,7 +33,7 @@ import {
   initRepoPullRequestAllowMaintainerEdit,
   initRepoPullRequestReview, initRepoIssueSidebarList, initArchivedLabelHandler,
 } from './features/repo-issue.js';
-import {initRepoEllipsisButton, initCommitStatuses} from './features/repo-commit.js';
+import {initRepoEllipsisButton, initCommitStatuses, initCommitNotes} from './features/repo-commit.js';
 import {
   initFootLanguageMenu,
   initGlobalButtonClickOnEnter,
@@ -179,6 +179,7 @@ onDomReady(() => {
   initRepoMilestoneEditor();
 
   initCommitStatuses();
+  initCommitNotes();
   initCaptcha();
 
   initUserAuthOauth2();