0
0
Fork 0
mirror of https://github.com/go-gitea/gitea synced 2024-11-21 22:21:16 +01:00
No description https://gitea.io
Find a file
Yarden Shoham 3e8414179c
Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908)
- Closes https://github.com/go-gitea/gitea/issues/28880

This change introduces htmx with the hope we could use it to make Gitea
more reactive while keeping our "HTML rendered on the server" approach.

- Add `htmx.js` that imports `htmx.org` and initializes error toasts
- Place `hx-headers='{"x-csrf-token": "{{.CsrfToken}}"}'` on the
`<body>` tag so every request that htmx sends is authenticated
- Place `hx-swap="outerHTML"` on the `<body>` tag so the response of
each htmx request replaces the tag it targets (as opposed to its inner
content)
- Place `hx-push-url="false"` on the `<body>` tag so no changes to the
URL happen in `<form>` tags
- Add the `is-loading` class during request

### Error toasts in action


![errors](https://github.com/go-gitea/gitea/assets/20454870/181a1beb-1cb8-4858-abe8-fa1fc3f5b8f3)

## Don't do a full page load when clicking the subscribe button
- Refactor the form around the subscribe button into its own template
- Use htmx to perform the form submission
- `hx-boost="true"` to prevent the default form submission behavior of a
full page load
- `hx-sync="this:replace"` to replace the current request (in case the
button is clicked again before the response is returned)
  - `hx-target="this"` to replace the form tag with the new form tag
- Change the backend response to return a `<form>` tag instead of a
redirect to the issue page

### Before


![subscribe_before](https://github.com/go-gitea/gitea/assets/20454870/cb2439a2-c3c0-425c-8d3c-5d646b1cdc28)

### After


![subscribe_after](https://github.com/go-gitea/gitea/assets/20454870/6fcd77d8-7b11-40b0-af4f-b152aaad787c)

## Don't do a full page load when clicking the follow button
- Use htmx to perform the button request
- `hx-post="{{.ContextUser.HomeLink}}?action=follow"` to send a POST
request to follow the user
- `hx-target="#profile-avatar-card"` to target the card div for
replacement
- `hx-indicator="#profile-avatar-card"` to place the loading indicator
on the card
- Change the backend response to return a `<div>` tag (the card) instead
of a redirect to the user page

### Before


![follow_before](https://github.com/go-gitea/gitea/assets/20454870/a210b643-6e74-4ff9-8e61-d658c62edf1f)

### After


![follow_after](https://github.com/go-gitea/gitea/assets/20454870/5bb19ae9-0d59-4ae3-b538-4c83334e4722)

---------

Signed-off-by: Yarden Shoham <git@yardenshoham.com>
Co-authored-by: 6543 <m.huber@kithara.com>
Co-authored-by: Giteabot <teabot@gitea.io>
2024-01-30 15:45:54 +01:00
.devcontainer
.gitea
.github
assets
build
cmd Simplify how git repositories are opened (#28937) 2024-01-27 21:09:51 +01:00
contrib
custom/conf Fixing small space missing in sample config file (#28967) 2024-01-28 14:58:00 +00:00
docker
docs Update golang links to use https (#28980) 2024-01-30 03:11:11 +02:00
models Fix joins in db.Find(AndCount) (#28978) 2024-01-30 02:37:24 +00:00
modules Also match weakly validated ETags (#28957) 2024-01-29 16:18:40 +00:00
options Update golang links to use https (#28980) 2024-01-30 03:11:11 +02:00
public Fix google logo in security page (#28982) 2024-01-30 02:54:52 +02:00
routers Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00
services Simplify how git repositories are opened (#28937) 2024-01-27 21:09:51 +01:00
snap
templates Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00
tests Simplify how git repositories are opened (#28937) 2024-01-27 21:09:51 +01:00
web_src Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00
.air.toml
.changelog.yml
.dockerignore
.editorconfig
.eslintrc.yaml
.gitattributes
.gitignore
.gitpod.yml
.golangci.yml
.ignore
.markdownlint.yaml
.npmrc
.spectral.yaml
.stylelintrc.yaml
.yamllint.yaml
BSDmakefile
build.go
CHANGELOG.md
CODE_OF_CONDUCT.md
CONTRIBUTING.md Update golang links to use https (#28980) 2024-01-30 03:11:11 +02:00
DCO
Dockerfile
Dockerfile.rootless
go.mod
go.sum
LICENSE
main.go
MAINTAINERS
Makefile
package-lock.json Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00
package.json Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00
playwright.config.js
poetry.lock
poetry.toml
pyproject.toml
README.md
README_ZH.md
SECURITY.md
vitest.config.js
webpack.config.js Introduce htmx and use it to avoid full page load on Subscribe and Follow (#28908) 2024-01-30 15:45:54 +01:00

Gitea

Gitea - Git with a cup of tea

Contribute with Gitpod

View this document in Chinese

Purpose

The goal of this project is to make the easiest, fastest, and most painless way of setting up a self-hosted Git service.

As Gitea is written in Go, it works across all the platforms and architectures that are supported by Go, including Linux, macOS, and Windows on x86, amd64, ARM and PowerPC architectures. This project has been forked from Gogs since November of 2016, but a lot has changed.

For online demonstrations, you can visit try.gitea.io.

For accessing free Gitea service (with a limited number of repositories), you can visit gitea.com.

To quickly deploy your own dedicated Gitea instance on Gitea Cloud, you can start a free trial at cloud.gitea.com.

Building

From the root of the source tree, run:

TAGS="bindata" make build

or if SQLite support is required:

TAGS="bindata sqlite sqlite_unlock_notify" make build

The build target is split into two sub-targets:

  • make backend which requires Go Stable, the required version is defined in go.mod.
  • make frontend which requires Node.js LTS or greater.

Internet connectivity is required to download the go and npm modules. When building from the official source tarballs which include pre-built frontend files, the frontend target will not be triggered, making it possible to build without Node.js.

Parallelism (make -j <num>) is not supported.

More info: https://docs.gitea.com/installation/install-from-source

Using

./gitea web

NOTE: If you're interested in using our APIs, we have experimental support with documentation.

Contributing

Expected workflow is: Fork -> Patch -> Push -> Pull Request

NOTES:

  1. YOU MUST READ THE CONTRIBUTORS GUIDE BEFORE STARTING TO WORK ON A PULL REQUEST.
  2. If you have found a vulnerability in the project, please write privately to security@gitea.io. Thanks!

Translating

Translations are done through Crowdin. If you want to translate to a new language ask one of the managers in the Crowdin project to add a new language there.

You can also just create an issue for adding a language or ask on discord on the #translation channel. If you need context or find some translation issues, you can leave a comment on the string or ask on Discord. For general translation questions there is a section in the docs. Currently a bit empty but we hope to fill it as questions pop up.

https://docs.gitea.com/contributing/localization

Crowdin

Further information

For more information and instructions about how to install Gitea, please look at our documentation. If you have questions that are not covered by the documentation, you can get in contact with us on our Discord server or create a post in the discourse forum.

We maintain a list of Gitea-related projects at gitea/awesome-gitea.

The official Gitea CLI is developed at gitea/tea.

Authors

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

FAQ

How do you pronounce Gitea?

Gitea is pronounced /ɡɪti:/ as in "gi-tea" with a hard g.

Why is this not hosted on a Gitea instance?

We're working on it.

License

This project is licensed under the MIT License. See the LICENSE file for the full license text.

Screenshots

Looking for an overview of the interface? Check it out!

Dashboard User Profile Global Issues
Branches Web Editor Activity
New Migration Migrating Pull Request View
Pull Request Dark Diff Review Dark Diff Dark