Commit graph

88 commits

Author SHA1 Message Date
silverwind
4a722c9a45
Make Issue/PR/projects more compact, misc CSS tweaks (#24459)
- Remove various horizontal dividers on repo pages that didn't provide
visual benefit
- Remove label/milestone pills on single issue/pr page
- Remove issue-related pill buttons on projects page
- Increase contrast of color-secondary on arc-green
- Improve notifications icon, make circle bigger
- Remove some inline styles
- Fix focus in issue/pr title edit and select all text on button click

### Issue and PR before and after

<img width="1249" alt="Screenshot 2023-05-01 at 11 44 22"
src="https://user-images.githubusercontent.com/115237/235436662-a708288e-84fb-4b2e-a5a2-3a1c17d28f6c.png">
<img width="1248" alt="Screenshot 2023-05-01 at 11 58 51"
src="https://user-images.githubusercontent.com/115237/235437992-f863e483-f3cc-4cc1-8204-fd223647a0c9.png">



### Projects before and after

<img width="1255" alt="Screenshot 2023-05-01 at 11 41 02"
src="https://user-images.githubusercontent.com/115237/235436433-0deb85d6-4e7d-4e74-847f-254cc70a0cf9.png">
<img width="1267" alt="Screenshot 2023-05-01 at 11 40 03"
src="https://user-images.githubusercontent.com/115237/235436431-715b13cb-f78c-4d86-b27a-9229f9738c5b.png">


### Releases before and after

<img width="1243" alt="Screenshot 2023-05-01 at 11 41 12"
src="https://user-images.githubusercontent.com/115237/235436457-b655ee6f-03b8-4595-8d8c-b15ea469e988.png">
<img width="1240" alt="Screenshot 2023-05-01 at 11 40 10"
src="https://user-images.githubusercontent.com/115237/235436456-05a2a0dd-7cbb-4f26-b0d3-4f667df4bb95.png">

### Misc

<img width="58" alt="Screenshot 2023-05-01 at 10 49 13"
src="https://user-images.githubusercontent.com/115237/235432494-936ce995-6e22-47bc-ab2d-c9e93d31987d.png">
<img width="57" alt="Screenshot 2023-05-01 at 18 57 08"
src="https://user-images.githubusercontent.com/115237/235492430-1d32cfe0-0f2c-467c-b2fa-925b27e30e0e.png">


Issue title edit and wrap:

<img width="1238" alt="Screenshot 2023-05-01 at 12 34 40"
src="https://user-images.githubusercontent.com/115237/235441407-d5067a57-e586-4865-a652-282e5944abb4.png">
<img width="1232" alt="Screenshot 2023-05-01 at 12 06 24"
src="https://user-images.githubusercontent.com/115237/235438710-1a543dda-220f-4d87-8f93-f1710c0695f0.png">

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-05-03 17:58:59 -04:00
yp05327
5987f00523
Add rerun workflow button and refactor to use SVG octicons (#24350)
Changes:
- Add rerun workflow button. Then users can rerun the whole workflow by
only one-click.
- Refactor to use SVG octicons in RepoActionView.vue

![image](https://user-images.githubusercontent.com/18380374/234736083-dea9b333-ec11-4095-a113-763f3716fba7.png)

![image](https://user-images.githubusercontent.com/18380374/234736107-d657d19c-f70a-42f4-985f-156a8c7efb7a.png)

![image](https://user-images.githubusercontent.com/18380374/234736160-9ad372df-7089-4d18-9bab-48bca3f01878.png)

---------

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-05-01 22:14:20 +08:00
wxiaoguang
59d060622d
Improve RSS (#24335)
Follow  #22719

### Major changes

1. `ServerError` doesn't do format, so remove the `%s`
2. Simplify `RenderBranchFeed` (slightly)
3. Remove unused `BranchFeedRSS`
4. Make `feed.RenderBranchFeed` respect `EnableFeed` config
5. Make `RepoBranchTagSelector.vue` respect `EnableFeed` setting,
otherwise there is always RSS icon
6. The `(branchURLPrefix + item.url).replace('src', 'rss')` doesn't seem
right for all cases, for example, the string `src` could appear in
`branchURLPrefix`, so we need a separate `rssURLPrefix`
7. The `<a>` in Vue menu needs `@click.stop`, otherwise the menu itself
would be triggered at the same time
8. Change `<a><button></button></a>` to `<a role=button>`
9. Use `{{PathEscapeSegments .TreePath}}` instead of `{{range $i, $v :=
.TreeNames}}/{{$v}}{{end}}`


Screenshot of changed parts:

<details>


![image](https://user-images.githubusercontent.com/2114189/234315538-66603694-9093-48a8-af33-83575fd7a018.png)


![image](https://user-images.githubusercontent.com/2114189/234315786-f1efa60b-012e-490b-8ce2-d448dc6fe5c9.png)


![image](https://user-images.githubusercontent.com/2114189/234334941-446941bc-1baa-4256-8850-ccc439476cda.png)

</details>


### Other thoughts

Should we remove the RSS icon from the branch dropdown list? It seems
too complex for a list UI, and users already have the chance to get the
RSS feed URL from "branches" page.

---------

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: silverwind <me@silverwind.io>
2023-04-25 22:53:44 -04:00
yp05327
5f21e0f8eb
Automatically select the org when click create repo from org dashboard (#24325)
![image](https://user-images.githubusercontent.com/18380374/234209941-d661b07f-e963-427b-a673-78c46043a792.png)

In org dashboard, the create repo link will be `repo/create?org={orgId}`
2023-04-25 22:25:29 -04:00
silverwind
ee6fa8d633
Restore bold on repolist (#24337)
Looking at it again, it does look a bit "odd" without bold, so revert
the repolist change done in
https://github.com/go-gitea/gitea/pull/24307.

<img width="141" alt="image"
src="https://user-images.githubusercontent.com/115237/234331813-c6e2402f-e099-43b3-aed6-46a0e24e3899.png">
2023-04-25 17:19:22 -04:00
jladbrook
56d4893b2a
Add RSS Feeds for branches and files (#22719)
Fix #22228 adding RSS feeds for branches and files. 

RSS feeds are accessed through:

* [gitea]/src/branch/{branch}.rss
* [gitea]/src/branch/{branch}/{file_name}.rss

No changes have been made to the UI to expose the feed urls for branches
and files.
2023-04-25 22:08:29 +08:00
wxiaoguang
20a3b03fe5
Add --font-weight-bold and set previous bold to 601 (#24307)
Fix #24305

According to MDN, "bold" starts from 700, some fonts do not provide
"bolding" for weight 600

https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight

---------

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: Giteabot <teabot@gitea.io>
2023-04-24 13:46:00 -04:00
Hester Gong
5e7543fcf4
Use same action status svg icons on actions list as on action page (#24178)
Close #24020 

After:

These icons are the same now:

<img width="1287" alt="截屏2023-04-18 13 52 11"
src="https://user-images.githubusercontent.com/17645053/232684252-05ddc101-dc5b-41b5-b374-132c3d853a41.png">

<img width="1141" alt="截屏2023-04-18 13 54 48"
src="https://user-images.githubusercontent.com/17645053/232684261-6ebd864a-a9aa-4982-af32-2cea91c35be8.png">


In this PR, didn't use `ActionRunStatus.vue` because the mounting of the
component will cause flash of the icons like below:

https://user-images.githubusercontent.com/17645053/232682646-713202dc-9023-4b9c-a849-c3a1ae6dd155.mov

Instead, modified and used `status.tmpl` to make it the same as
`ActionRunStatus.vue` to avoid the ui flash (Welcomed to show how to use
`ActionRunStatus.vue` without flashing if there is a way).
Added comments to both of them for reminding synchronization of these
two files.

---------

Co-authored-by: Jason Song <i@wolfogre.com>
2023-04-19 13:42:53 +08:00
Yarden Shoham
f045e58cc7
Localize activity heatmap (except tooltip) (#24131)
The calculation of the total sum is moved to the backend so a full HTML
string could be sent.


![image](https://user-images.githubusercontent.com/20454870/232112381-c11d896b-ba47-40f8-b2a3-71cf4b3208de.png)

- Closes #10669
- 2nd attempt (the first was in #21570)

---------

Signed-off-by: Yarden Shoham <git@yardenshoham.com>
Co-authored-by: Giteabot <teabot@gitea.io>
2023-04-17 14:26:01 -04:00
sillyguodong
3753ecd583
Update the value of the diffEnd when click Show More btn in the DiffFileTree (#24069)
In the component `DiffFileTree`,if don't update the value of the
`diffEnd` in the callback of ajax request, click `Show More` btn will
always return the same response, duplicate files are appended to the
file list.


Before:


https://user-images.githubusercontent.com/33891828/231371188-82d169af-10bb-47e2-8aca-83ced2597f2d.mov



After:


https://user-images.githubusercontent.com/33891828/231369805-39a5a4d0-662c-4f08-bc5a-7d31e8782453.mov

---------

Co-authored-by: Giteabot <teabot@gitea.io>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-04-12 15:11:23 +02:00
sillyguodong
e03e827dcb
Expand selected file when clicking file tree (#24041)
Auto expand the selected file when clicking the file item of the file
tree.
This is consistent with Github's behavior.

https://user-images.githubusercontent.com/33891828/231048124-61f180af-adba-42d7-9ffa-626e1de04aed.mov
2023-04-12 15:06:39 +08:00
wxiaoguang
6892e2b8ef
Use reactive store to share data between components (#23996)
Follow #23947

* Use reactive store to share data between components
* Remove no-op `this.hashListener = window.addEventListener()` because
`addEventListener` returns void/undefined.

Reference:


https://vuejs.org/guide/scaling-up/state-management.html#simple-state-management-with-reactivity-api


Screenshot (the same as before):

<details>

<img width="565" alt="image"
src="https://user-images.githubusercontent.com/2114189/230701282-bd61bfa3-7786-433b-9ad8-a88591112a02.png">


</details>

---------

Co-authored-by: silverwind <me@silverwind.io>
2023-04-11 20:44:26 -04:00
yp05327
68aac691c1
Add job.duration in web ui (#23963)
![image](https://user-images.githubusercontent.com/18380374/230532947-271ac389-8134-4c5e-8f2f-ced4a4fd0ebe.png)

![image](https://user-images.githubusercontent.com/18380374/230532963-e76532c5-7ca1-4b01-ae77-cc1223350fe7.png)

Maybe we can change the location of it.
2023-04-07 18:20:50 -04:00
yusifeng
395c716735
Highlight selected file in the PR file tree (#23947)
before

![before](https://user-images.githubusercontent.com/36984894/230327904-6e712ca2-f777-4cad-99f3-53bc20008180.gif)

after

![after](https://user-images.githubusercontent.com/36984894/230327966-6e5dd971-f0df-427a-a80b-6a9b6db6065d.gif)
2023-04-07 14:27:10 -04:00
Jonathan Tran
8c3cee7a72
Update eslints for Vue 3 (#23935)
I found that some lint warnings in my editor are conflicting, and I
believe the root cause is using lints designed for Vue 2 instead of Vue
3. We moved to Vue 3 in #20044.

I verified that the explicitly disabled rules in the changed file are
still part of the `vue/vue3-recommended` set.

See [Available rules -
eslint-plugin-vue](https://eslint.vuejs.org/rules/) for a full list of
lints.
2023-04-05 16:59:40 -04:00
wxiaoguang
aa9c920980
Improve action log display with control chars (#23820)
Close #23680

Some CLI programs use "\r" and control chars to print new content in
current line.

So, the strings in one line are actually from
`\rReading...1%\rReading...5%\rReading...100%`

This PR tries to make the output better.
2023-04-01 20:57:05 +08:00
Jason Song
964a057a76
Fix checks for needs in Actions (#23789)
Fix:
- https://gitea.com/gitea/act_runner/issues/77
- https://gitea.com/gitea/act_runner/issues/81

Before:
<img width="1489" alt="image"
src="https://user-images.githubusercontent.com/9418365/228501567-f752cf87-a7ed-42c6-8f3d-ba741795c1fe.png">

Highlights:
- Upgrade act to make things doable, related to
  - https://gitea.com/gitea/act/pulls/32
  - https://gitea.com/gitea/act/pulls/33
  - https://gitea.com/gitea/act/pulls/35
- Make `needs` works
- Sort jobs in the original order in the workflow files
2023-03-30 22:33:17 +08:00
silverwind
aa4d1d94f7
Diff improvements (#23553)
- Avoid flash of wrong tree toggle icon on page load by setting icon
based on sync state
- Avoid "pop-in" of tree on page load by leaving space based on sync
state
- Use the same border/box-shadow combo used on comment `:target` also
for file `:target`.
- Refactor `DiffFileTree.vue` to use `toggleElem` instead of hardcoded
class name.
- Left-align inline comment boxes and make them fit the same amount of
markup content on a line as GitHub.
- Fix height of `diff-file-list`

Fixes: https://github.com/go-gitea/gitea/issues/23593

<img width="1250" alt="Screenshot 2023-03-18 at 00 52 04"
src="https://user-images.githubusercontent.com/115237/226071392-6789a644-aead-4756-a77e-aba3642150a0.png">
<img width="1246" alt="Screenshot 2023-03-18 at 00 59 43"
src="https://user-images.githubusercontent.com/115237/226071443-8bcba924-458b-48bd-b2f0-0de59cb180ac.png">
<img width="1250" alt="Screenshot 2023-03-18 at 01 27 14"
src="https://user-images.githubusercontent.com/115237/226073121-ccb99f9a-d3ac-40b7-9589-43580c4a01c9.png">
<img width="1231" alt="Screenshot 2023-03-19 at 21 44 16"
src="https://user-images.githubusercontent.com/115237/226207951-81bcae1b-6b41-4e39-83a7-0f37951df6be.png">

(Yes I'm aware the border-radius in bottom corners is suboptimal, but
this would be notorously hard to fix without relying on `overflow:
hidden`).
2023-03-30 20:06:10 +08:00
yp05327
22fec1650a
Add commit info in action page (#23210)
Add more commit info in action detail page.

![image](https://user-images.githubusercontent.com/18380374/222069905-a5ab28b1-1cea-4eec-b3b9-f1c74145cb82.png)
2023-03-27 18:34:09 +08:00
wxiaoguang
12fff36d05
Fine tune more downdrop settings, use SVG for labels, improve Repo Topic Edit form (#23626)
Although it seems that some different purposes are mixed in this PR,
however, they are all related, and can be tested together, so I put them
together to save everyone's time.

Diff: `+79 −84`, everything becomes much better.

### Improve the dropdown settings.

Move all fomantic-init related code into our `fomantic.js`

Fine-tune some dropdown global settings, see the comments.

Also help to fix the first problem in #23625 , cc: @yp05327 

The "language" menu has been simplified, and it works with small-height
window better.

### Use SVG instead of `<i class="delete icon">`

It's also done by `$.fn.dropdown.settings.templates.label` , cc:
@silverwind

### Remove incorrect `tabable` CSS class

It doesn't have CSS styles, and it was only in Vue. So it's totally
unnecessary, remove it by the way.

### Improve the Repo Topic Edit form

* Simplify the code
* Add a "Cancel" button
* Align elements

Before:

<details>

![image](https://user-images.githubusercontent.com/2114189/223325782-f09532de-0c38-4742-ba86-ed35cc9a858d.png)

</details>

After:

![image](https://user-images.githubusercontent.com/2114189/226796347-207feb0a-b3cd-4820-8a3e-01930bab1069.png)
2023-03-26 19:31:26 +08:00
wxiaoguang
8d5fbeb7a2
Use data-tooltip-content for tippy tooltip (#23649)
Follow:
* #23574
* Remove all ".tooltip[data-content=...]"

Major changes:

* Remove "tooltip" class, use "[data-tooltip-content=...]" instead of
".tooltip[data-content=...]"
* Remove legacy `data-position`, it's dead code since last Fomantic
Tooltip -> Tippy Tooltip refactoring
* Rename reaction attribute from `data-content` to
`data-reaction-content`
* Add comments for some `data-content`: `{{/* used by the form */}}`
* Remove empty "ui" class
* Use "text color" for SVG icons (a few)
2023-03-24 18:35:38 +08:00
wxiaoguang
9be90a5875
Use a general approach to show tooltip, fix temporary tooltip bug (#23574)
## TLDR

* Improve performance: lazy creating the tippy instances.
* Transparently support all "tooltip" elements, no need to call
`initTooltip` again and again.
* Fix a temporary tooltip re-entrance bug, which causes showing temp
content forever.
* Upgrade vue3-calendar-heatmap to 2.0.2 with lazy tippy init
(initHeatmap time decreases from 100ms to 50ms)

## Details

### The performance

Creating a lot of tippy tooltip instances is expensive. This PR doesn't
create all tippy tooltip instances, instead, it only adds "mouseover"
event listener to necessary elements, and then switches to the tippy
tooltip

### The general approach for all tooltips

Before, dynamically generated tooltips need to be called with
`initTooltip`.

After, use MutationObserver to:

* Attach the event listeners to newly created tooltip elements, work for
Vue (easier than before)
* Catch changed attributes and update the tooltip content (better than
before)

It does help a lot, eg:

1a4efa0ee9/web_src/js/components/PullRequestMergeForm.vue (L33-L36)

### Temporary tooltip re-entrance bug

To reproduce, on try.gitea.io, click the "copy clone url" quickly, then
the tooltip will be "Copied!" forever.

After this PR, with the help of `attachTippyTooltip`, the tooltip
content could be reset to the default correctly.

### Other changes

* `data-tooltip-content` is preferred from now on, the old
`data-content` may cause conflicts with other modules.
* `data-placement` was only used for tooltip, so it's renamed to
`data-tooltip-placement`, and removed from `createTippy`.
2023-03-23 17:56:15 +08:00
wxiaoguang
389e83f7eb
Improve <SvgIcon> to make it output svg node and optimize performance (#23570)
Before, the Vue `<SvgIcon>` always outputs DOM nodes like: 

```html
<span class="outer-class">
    <svg class="class-name-defined" ...></svg>
</span>
```

The `span` is redundant and I guess such layout and the inconsistent
`class/class-name` attributes would cause bugs sooner or later.

This PR makes the `<SvgIcon>` clear, and it's faster than before,
because it doesn't need to parse the whole SVG string.

Before: 

<details>

![image](https://user-images.githubusercontent.com/2114189/226156474-ce2c57cd-b869-486a-b75b-1eebdac8cdf7.png)

</details>

After:

![image](https://user-images.githubusercontent.com/2114189/226155774-108f49ed-7512-40c3-94a2-a6e8da18063d.png)

---------

Co-authored-by: silverwind <me@silverwind.io>
2023-03-23 11:24:16 +08:00
yp05327
06c067bb0f
Remove stars in dashboard repo list (#23530)
Discussion is here: https://github.com/go-gitea/gitea/pull/22816
2023-03-17 00:43:58 -04:00
silverwind
202803fc69
Replace Less with CSS (#23481)
Ran most of the Less files through the Less compiler and Prettier and
then followed up with a round of manual fixes.

The Less compiler had unfortunately stripped all `//` style comments
that I had to restore (It did preserve `/* */` comments). Other fixes
include duplicate selector removal which were revealed after the
transpilation and which weren't caught by stylelint before but now are.

Fixes: https://github.com/go-gitea/gitea/issues/15565
2023-03-14 22:20:19 -04:00
wxiaoguang
ac8d71ff07
Refactor branch/tag selector to Vue SFC (#23421)
Follow #23394

There were many bad smells in old code. This PR only moves the code into
Vue SFC, doesn't touch the unrelated logic.

update: after
5f23218c85
, there should be no usage of the vue-rumtime-compiler anymore
(hopefully), so I think this PR could close #19851

---------

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-14 17:51:20 +08:00
wxiaoguang
e82f1b15c7
Refactor dashboard repo list to Vue SFC (#23405)
Similar to #23394

The dashboard repo list mixes jQuery/Fomantic UI/Vue together, it's very
diffcult to maintain and causes unfixable a11y problems.

This PR uses two steps to refactor the repo list:

1. move `data-` attributes to JS object and use Vue data as much as
possible
d3adc0dcac
2. move the code into a Vue SFC
7ebe55df6e

Total: +516 −585

Screenshots:

<details>

![image](https://user-images.githubusercontent.com/2114189/224271457-a23e05be-d7d3-4247-a803-f0ee30c36f44.png)

![image](https://user-images.githubusercontent.com/2114189/224271504-76fbd3da-4d7a-4725-b0d1-fbff83caac63.png)

![image](https://user-images.githubusercontent.com/2114189/224271845-f007cadf-6c49-46bd-a65c-a3fc75bdba3b.png)

</details>

---------

Co-authored-by: John Olheiser <john.olheiser@gmail.com>
2023-03-14 12:09:06 +08:00
Hester Gong
f521e88240
Fix actions frontend bugs (pagination, long name alignment) and small simplify (#23370)
1 Right now on actions page, the action list will not be aligned if
commit message is long. In this PR, the changes are:
- The branch tag is moved to bottom row
- Width percentage is given to make them aligned
- Show "..." if commit is longer than two lines.
- Align the status icon with the commit message with baseline

 Before:
<img width="1068" alt="截屏2023-03-08 12 23 22"
src="https://user-images.githubusercontent.com/17645053/223628534-6b9472cb-29f5-40a3-9714-c5152553049e.png">
  
 After:
<img width="756" alt="截屏2023-03-08 13 34 28"
src="https://user-images.githubusercontent.com/17645053/223628571-da94698b-0e0a-43e3-ae82-34d8c780e5ba.png">


2 Right now the actions list's pagination is not working properly
because Param is not passed to pagination template, in this PR Param
Strings are passed to the pager

Before:
<img width="1176" alt="截屏2023-03-08 12 23 50"
src="https://user-images.githubusercontent.com/17645053/223629207-8b67ce74-2342-4259-bc81-036e37752716.png">

After:
<img width="1343" alt="截屏2023-03-08 13 11 54"
src="https://user-images.githubusercontent.com/17645053/223629321-4f538f8a-45dc-4d6f-ae60-2c82680ae3e7.png">

3 A small simplify in `RepoActionView.vue` .

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-13 13:31:06 +08:00
wxiaoguang
75022f8b1a
Refactor branch/tag selector dropdown (first step) (#23394)
Follow: 
* #23345

The branch/tag selector dropdown mixes jQuery/Fomantic UI/Vue together,
it's very diffcult to maintain and causes unfixable a11y problems. It
also causes problems like #19851 #21314 #21952

This PR is the first step for the refactoring, move `data-` attributes
to JS object and use Vue data as much as possible.

The old selector `'.choose.reference .dropdown'` was also wrong, it hits
`<div class="choose reference"><svg class="dropdown icon">` and would
cause undefined behaviors.

I have done some quick tests and it works. After this PR gets merged, I
will move the code into a Vue SFC in next PR.



![image](https://user-images.githubusercontent.com/2114189/224099638-378a8a86-0865-47d1-bcba-f972506374c7.png)


![image](https://user-images.githubusercontent.com/2114189/224099690-70276cf5-b1e4-404a-b0c6-582448abf40e.png)

---------

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2023-03-11 12:47:09 +02:00
yp05327
f0b0f22aed
Add ActionRunStatus component (#23259)
Related to:
https://github.com/go-gitea/gitea/pull/23212#discussion_r1122856231

Decrease duplication of SvgIcon when display a run status svg.

---------

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-06 22:35:24 +08:00
wxiaoguang
21a1d76911
Improve the frontend guideline (#23298)
### The CustomEvent prefix

There was already `ce-quick-submit`, the `ce-` prefix seems better than
`us-`. Rename the only `us-` prefixed `us-load-context-popup` to `ce-`
prefixed.

### Styles and Attributes in Go HTML Template

https://github.com/go-gitea/gitea/pull/21855#issuecomment-1429643073

Suggest to stick to `class="c1 {{if $var}}c2{{end}}"`

The readability and maintainability should be applied to the code which
is read by developers, but not for the generated outputs.

The template code is the code for developers, while the generated HTML
are only for browsers.

The `class="c1 {{if $var}}c2{{end}}"` style is clearer for developers
and more intuitive, and the generated HTML also makes browsers happy (a
few spaces do not affect anything)

Think about a more complex case:

* `class="{{if $active}}active{{end}} menu item {{if $show}}show{{end}}
{{if $warn}}warn{{end}}"`
* --vs--
* `class="{{if $active}}active {{end}}menu item{{if $show}}
show{{end}}{{if $warn}} warn{{end}}"`

The first style make it clearer to see each CSS class name with its
`{{if}}` block.

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-05 22:23:42 +08:00
yp05327
ca84a61761
Add run status in action view page (#23212)
Before:

![image](https://user-images.githubusercontent.com/18380374/222084932-a7643fbe-2d9f-48db-b25d-74ace49e03f4.png)

![image](https://user-images.githubusercontent.com/18380374/222084887-fde3500d-dad3-4902-9c82-c4f71f23f83b.png)

After:

![image](https://user-images.githubusercontent.com/18380374/222084565-eeef1110-9d9d-40b4-a26b-fbd5a307f14e.png)

![image](https://user-images.githubusercontent.com/18380374/222084728-6c96d7c1-a399-43d5-8369-392ad5017b7f.png)

---------

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2023-03-04 00:41:37 -05:00
wxiaoguang
7a5af25592
Fix incorrect checkbox behaviors in the dashboard repolist's filter (#23147)
Co-author: yp05327 , this PR is based on yp05327's #22813.

The problems of the old DashboardRepoList / repolist.tmpl: 

* It mixes many different frameworks together
* It "just works", bug on bug
* It uses many anti-pattern of Vue

This PR:

* Fix bugs and close #22800
* Decouple the "checkbox" elements from Fomantic UI (only use CSS
styles)
* Simplify the HTML layout
* Simplify JS logic
* Make it easier to refactor the DashboardRepoList into a pure Vue
component in the future.

### Screenshots

#### Default

![image](https://user-images.githubusercontent.com/2114189/221355768-a3eb5b23-85b4-4e3d-b906-844d8b15539d.png)

####  Click "Archived" to make it checked

![image](https://user-images.githubusercontent.com/2114189/221355777-9a104ddf-52a7-4504-869a-43a73827d802.png)

####  Click "Archived" to make it intermediate

![image](https://user-images.githubusercontent.com/2114189/221355802-0f67a073-67ad-4e92-84a6-558c432103a5.png)

####  Click "Archived" to make it unchecked

![image](https://user-images.githubusercontent.com/2114189/221355810-acf1d9d8-ccce-47fe-a02e-70cf4e666331.png)

---------

Co-authored-by: yp05327 <576951401@qq.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-01 10:22:14 +08:00
Brecht Van Lommel
f4920c9c7f
Add pagination for dashboard and user activity feeds (#22937)
Previously only the last few activities where available. This works for
all activity and for activity on a date chosen on the heatmap.
2023-02-24 16:15:10 -05:00
Jason Song
edf98a2dc3
Require approval to run actions for fork pull request (#22803)
Currently, Gitea will run actions automatically which are triggered by
fork pull request. It's a security risk, people can create a PR and
modify the workflow yamls to execute a malicious script.

So we should require approval for first-time contributors, which is the
default strategy of a public repo on GitHub, see [Approving workflow
runs from public
forks](https://docs.github.com/en/actions/managing-workflow-runs/approving-workflow-runs-from-public-forks).

Current strategy:

- don't need approval if it's not a fork PR;
- always need approval if the user is restricted;
- don't need approval if the user can write;
- don't need approval if the user has been approved before;
- otherwise, need approval.

https://user-images.githubusercontent.com/9418365/217207121-badf50a8-826c-4425-bef1-d82d1979bc81.mov

GitHub has an option for that, you can see that at
`/<owner>/<repo>/settings/actions`, and we can support that later.

<img width="835" alt="image"
src="https://user-images.githubusercontent.com/9418365/217199990-2967e68b-e693-4e59-8186-ab33a1314a16.png">

---------

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-02-24 15:58:49 +08:00
Jason Song
c8c2a31818
Add force_merge to merge request and fix checking mergable (#23010)
Fix #23000.
2023-02-21 08:42:07 -06:00
wxiaoguang
e7b560f3fe
Fix the Manually Merged form (#23015)
Regression bug of #19650

Close #20983
Close #21912

### The "Manually Merged" form

![image](https://user-images.githubusercontent.com/2114189/220170503-32638994-b509-4251-8aa1-d8393dda7184.png)

### Mark a PR as Manually Merged and close it

![image](https://user-images.githubusercontent.com/2114189/220170537-25c91b2c-7a9a-44d1-9e6a-ebe3f1dfc26a.png)

---------

Co-authored-by: Jason Song <i@wolfogre.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-02-21 18:03:41 +08:00
wxiaoguang
d32af84a10
Refactor hiding-methods, remove jQuery show/hide, remove .hide class, remove inline style=display:none (#22950)
Close #22847

This PR:

* introduce Gitea's own `showElem` and related functions
* remove jQuery show/hide
* remove .hide class
* remove inline style=display:none 

From now on:

do not use:
* "[hidden]" attribute: it's too weak, can not be applied to an element
with "display: flex"
* ".hidden" class: it has been polluted by Fomantic UI in many cases
* inline style="display: none": it's difficult to tweak
* jQuery's show/hide/toggle: it can not show/hide elements with
"display: xxx !important"

only use:
* this ".gt-hidden" class
* showElem/hideElem/toggleElem functions in "utils/dom.js"

cc: @silverwind , this is the all-in-one PR
2023-02-19 12:06:14 +08:00
Brecht Van Lommel
6221a6fd54
Scoped labels (#22585)
Add a new "exclusive" option per label. This makes it so that when the
label is named `scope/name`, no other label with the same `scope/`
prefix can be set on an issue.

The scope is determined by the last occurence of `/`, so for example
`scope/alpha/name` and `scope/beta/name` are considered to be in
different scopes and can coexist.

Exclusive scopes are not enforced by any database rules, however they
are enforced when editing labels at the models level, automatically
removing any existing labels in the same scope when either attaching a
new label or replacing all labels.

In menus use a circle instead of checkbox to indicate they function as
radio buttons per scope. Issue filtering by label ensures that only a
single scoped label is selected at a time. Clicking with alt key can be
used to remove a scoped label, both when editing individual issues and
batch editing.

Label rendering refactor for consistency and code simplification:

* Labels now consistently have the same shape, emojis and tooltips
everywhere. This includes the label list and label assignment menus.
* In label list, show description below label same as label menus.
* Don't use exactly black/white text colors to look a bit nicer.
* Simplify text color computation. There is no point computing luminance
in linear color space, as this is a perceptual problem and sRGB is
closer to perceptually linear.
* Increase height of label assignment menus to show more labels. Showing
only 3-4 labels at a time leads to a lot of scrolling.
* Render all labels with a new RenderLabel template helper function.

Label creation and editing in multiline modal menu:

* Change label creation to open a modal menu like label editing.
* Change menu layout to place name, description and colors on separate
lines.
* Don't color cancel button red in label editing modal menu.
* Align text to the left in model menu for better readability and
consistent with settings layout elsewhere.

Custom exclusive scoped label rendering:

* Display scoped label prefix and suffix with slightly darker and
lighter background color respectively, and a slanted edge between them
similar to the `/` symbol.
* In menus exclusive labels are grouped with a divider line.

---------

Co-authored-by: Yarden Shoham <hrsi88@gmail.com>
Co-authored-by: Lauris BH <lauris@nix.lv>
2023-02-18 21:17:39 +02:00
delvh
3361bbf058
Add title to PR file tree items (#22918)
Previously, a file/directory name was simply cut when it was too long.
Now, we display the browser-native tooltip (`title`) instead, so you can
still see it when hovering over it.
In this case, we don't use the normal `tippy` tooltips for three
reasons:
1. Vue components are not included in the global tooltip initialization
2. Vue components would need to initialize their tooltips themselves
whenever their content is changed
3. The tooltips are shown too long under the default configuration (the
tooltip one element above is still shown when hovering on the element
below)

Fixes #22915

## Appearance


![image](https://user-images.githubusercontent.com/51889757/219049642-43668a38-0e86-42bf-a1d0-3742c4dc7fd9.png)

## Room for future improvement

We could think about displaying the whole file path in the title, not
just its name.
This is not done at the moment:

![image](https://user-images.githubusercontent.com/51889757/219050689-1e6e3d57-f2bf-48be-8553-415e744a6e10.png)

---------

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2023-02-16 00:57:25 -05:00
wxiaoguang
e314c9e866
Fix the full-height problem for all pages (#22905)
Really fix #22883, close #22901

I made a mistake that the global styles in RepoActionView.vue could
still pollute global styles (I forgot that the code of this component is
still loaded on every page, instead of loaded on demand)

This PR makes a complete fix: only change the page's full-height
behavior if the component is used.

Screenshot after the fix:

<details>

![image](https://user-images.githubusercontent.com/2114189/218664776-0dbcd469-2c36-4e17-972f-e44fa3b81ba6.png)

</details>

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-02-14 21:04:22 +08:00
zeripath
51383ec084
Move helpers to be prefixed with gt- (#22879)
As discussed in #22847 the helpers in helpers.less need to have a
separate prefix as they are causing conflicts with fomantic styles

This will allow us to have the `.gt-hidden { display:none !important; }`
style that is needed to for the reverted PR.

Of note in doing this I have noticed that there was already a conflict
with at least one chroma style which this PR now avoids.

I've also added in the `gt-hidden` style that matches the tailwind one
and switched the code that needed it to use that.

Signed-off-by: Andrew Thornton <art27@cantab.net>

---------

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-02-13 17:59:59 +00:00
Jason Song
00b18ab42f
Remove _actions.less (#22885)
Fix #22883.

Revert commit 59beb2dba6b35b88dae5ac5c3d094bc6c1bba19c.
2023-02-13 08:33:33 -06:00
Jason Song
a354636966
Fix style of actions rerun button (#22835)
Authored by @a1012112796 at
https://github.com/go-gitea/gitea/pull/22798#issuecomment-1421820001

Avoid putting `button` in `a`.

A patch for #22798 .

Now it looks like:

<img width="393" alt="image"
src="https://user-images.githubusercontent.com/9418365/217791913-b491fc86-ee9b-4672-80ea-7286eef2d11f.png">
<img width="389" alt="image"
src="https://user-images.githubusercontent.com/9418365/217791967-d8c09c8b-4cea-4011-b01e-db0d1333e7f6.png">

---------

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-02-12 19:19:50 +08:00
gempir
e460b6ef4d
Fix PR file tree folders no longer collapsing (#22864)
Collapsing folders currently just throws a console error

```
index.js?v=1.19.0~dev-403-gb6b8feb3d:10 TypeError: this.$set is not a function
    at Proxy.handleClick (index.js?v=1.19.0~dev-403-gb6b8feb3d:58:7159)
    at index.js?v=1.19.0~dev-403-gb6b8feb3d:58:6466
    at index.js?v=1.19.0~dev-403-gb6b8feb3d:10:93922
    at ce (index.js?v=1.19.0~dev-403-gb6b8feb3d:10:1472)
    at Q (index.js?v=1.19.0~dev-403-gb6b8feb3d:10:1567)
    at HTMLDivElement.$e (index.js?v=1.19.0~dev-403-gb6b8feb3d:10:79198)
```

This PR fixes this and allows folders to be collapsed again.

Also:
- better cursor interaction with folders
- added some color to the diff detail stats
- remove green link color from all the file names

Screenshots:

![image](https://user-images.githubusercontent.com/9765622/218269712-2f3dda55-6d70-407f-8d34-2a5d9c8df548.png)

![image](https://user-images.githubusercontent.com/9765622/218269714-6ce8a954-daea-4ed6-9eea-8b2323db4d8f.png)

---------

Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-02-12 10:34:46 +08:00
Jason Song
7d3c4c3e8a
Fix rerun button of Actions (#22798)
When clicking the return button, the page should be refreshed. However,
the browser may cancel the previous fetch request, and it fails to rerun
the job. It's easier to reproduce the bug in Safari or Firefox than
Chrome for some reason.

<img width="384" alt="image"
src="https://user-images.githubusercontent.com/9418365/217142792-a783f9a1-7089-44db-b7d8-46c46c72d284.png">


<img width="752" alt="image"
src="https://user-images.githubusercontent.com/9418365/217132406-b8381b63-b323-474e-935b-2596b1b5c046.png">
2023-02-08 15:55:57 +08:00
Jason Song
b6145bfaa3
Use relative url in actions view (#22675)
Use relative url in actions view.
2023-01-31 22:46:10 +00:00
Jason Song
4011821c94
Implement actions (#21937)
Close #13539.

Co-authored by: @lunny @appleboy @fuxiaohei and others.

Related projects:
- https://gitea.com/gitea/actions-proto-def
- https://gitea.com/gitea/actions-proto-go
- https://gitea.com/gitea/act
- https://gitea.com/gitea/act_runner

### Summary

The target of this PR is to bring a basic implementation of "Actions",
an internal CI/CD system of Gitea. That means even though it has been
merged, the state of the feature is **EXPERIMENTAL**, and please note
that:

- It is disabled by default;
- It shouldn't be used in a production environment currently;
- It shouldn't be used in a public Gitea instance currently;
- Breaking changes may be made before it's stable.

**Please comment on #13539 if you have any different product design
ideas**, all decisions reached there will be adopted here. But in this
PR, we don't talk about **naming, feature-creep or alternatives**.

### ⚠️ Breaking

`gitea-actions` will become a reserved user name. If a user with the
name already exists in the database, it is recommended to rename it.

### Some important reviews

- What is `DEFAULT_ACTIONS_URL` in `app.ini` for?
  - https://github.com/go-gitea/gitea/pull/21937#discussion_r1055954954
- Why the api for runners is not under the normal `/api/v1` prefix?
  - https://github.com/go-gitea/gitea/pull/21937#discussion_r1061173592
- Why DBFS?
  - https://github.com/go-gitea/gitea/pull/21937#discussion_r1061301178
- Why ignore events triggered by `gitea-actions` bot?
  - https://github.com/go-gitea/gitea/pull/21937#discussion_r1063254103
- Why there's no permission control for actions?
  - https://github.com/go-gitea/gitea/pull/21937#discussion_r1090229868

### What it looks like

<details>

#### Manage runners

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205870657-c72f590e-2e08-4cd4-be7f-2e0abb299bbf.png">

#### List runs

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205872794-50fde990-2b45-48c1-a178-908e4ec5b627.png">


#### View logs

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205872501-9b7b9000-9542-4991-8f55-18ccdada77c3.png">



</details>

### How to try it

<details>

#### 1. Start Gitea

Clone this branch and [install from
source](https://docs.gitea.io/en-us/install-from-source).

Add additional configurations in `app.ini` to enable Actions:

```ini
[actions]
ENABLED = true
```

Start it.

If all is well, you'll see the management page of runners:

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205877365-8e30a780-9b10-4154-b3e8-ee6c3cb35a59.png">


#### 2. Start runner

Clone the [act_runner](https://gitea.com/gitea/act_runner), and follow
the
[README](https://gitea.com/gitea/act_runner/src/branch/main/README.md)
to start it.

If all is well, you'll see a new runner has been added:

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205878000-216f5937-e696-470d-b66c-8473987d91c3.png">

#### 3. Enable actions for a repo

Create a new repo or open an existing one, check the `Actions` checkbox
in settings and submit.

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205879705-53e09208-73c0-4b3e-a123-2dcf9aba4b9c.png">
<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205879383-23f3d08f-1a85-41dd-a8b3-54e2ee6453e8.png">

If all is well, you'll see a new tab "Actions":

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205881648-a8072d8c-5803-4d76-b8a8-9b2fb49516c1.png">

#### 4. Upload workflow files

Upload some workflow files to `.gitea/workflows/xxx.yaml`, you can
follow the [quickstart](https://docs.github.com/en/actions/quickstart)
of GitHub Actions. Yes, Gitea Actions is compatible with GitHub Actions
in most cases, you can use the same demo:

```yaml
name: GitHub Actions Demo
run-name: ${{ github.actor }} is testing out GitHub Actions 🚀
on: [push]
jobs:
  Explore-GitHub-Actions:
    runs-on: ubuntu-latest
    steps:
      - run: echo "🎉 The job was automatically triggered by a ${{ github.event_name }} event."
      - run: echo "🐧 This job is now running on a ${{ runner.os }} server hosted by GitHub!"
      - run: echo "🔎 The name of your branch is ${{ github.ref }} and your repository is ${{ github.repository }}."
      - name: Check out repository code
        uses: actions/checkout@v3
      - run: echo "💡 The ${{ github.repository }} repository has been cloned to the runner."
      - run: echo "🖥️ The workflow is now ready to test your code on the runner."
      - name: List files in the repository
        run: |
          ls ${{ github.workspace }}
      - run: echo "🍏 This job's status is ${{ job.status }}."
```

If all is well, you'll see a new run in `Actions` tab:

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205884473-79a874bc-171b-4aaf-acd5-0241a45c3b53.png">

#### 5. Check the logs of jobs

Click a run and you'll see the logs:

<img width="1792" alt="image"
src="https://user-images.githubusercontent.com/9418365/205884800-994b0374-67f7-48ff-be9a-4c53f3141547.png">

#### 6. Go on

You can try more examples in [the
documents](https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions)
of GitHub Actions, then you might find a lot of bugs.

Come on, PRs are welcome.

</details>

See also: [Feature Preview: Gitea
Actions](https://blog.gitea.io/2022/12/feature-preview-gitea-actions/)

---------

Co-authored-by: a1012112796 <1012112796@qq.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: ChristopherHX <christopher.homberger@web.de>
Co-authored-by: John Olheiser <john.olheiser@gmail.com>
2023-01-31 09:45:19 +08:00
zeripath
c0da3638e7
Restore function to "Show more" buttons (#22399)
There was a serious regression in #21012 which broke the Show More
button on the diff page, and the show more button was also broken on the
file tree too.

This PR fixes this by resetting the pageData.diffFiles as the vue
watched value and reattachs a function to the show more button outside
of the file tree view.

Fix #22380

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: John Olheiser <john.olheiser@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-01-13 13:50:32 +08:00
silverwind
2cf0cf0de1
JS refactors (#22227)
- Replace all default exports with named exports, except for Vue SFCs
- Remove names from Vue SFCs, they are automatically inferred from the
filename
- Misc whitespace-related tweaks
2022-12-24 00:03:11 +08:00