forgejo/templates/shared/quota_overview.tmpl
Gusted 77a1af5ab8 feat(ui): add quota overview (#6602)
Add UI to the quota feature to see what quotas applies to you and if you're exceeding any quota, it's designed to be a general size overview although it's exclusively filled with quota features for now. There's also no UI to see what item is actually taking in the most size. Purely an quota overview.

Screenshots:
![](https://codeberg.org/attachments/9f7480f2-4c31-4d70-8aec-61db79282a1e)
![](https://codeberg.org/attachments/0bd45bf3-28c5-47bf-8fff-c4ae9f38cb28)

With inspiration from concept by 0ko:
![](https://codeberg.org/attachments/b8154a52-6fba-42fc-a4a8-b3ab1527fb33)

Co-authored-by: Otto Richter <git@otto.splvs.net>
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6602
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
2025-02-26 14:36:53 +00:00

32 lines
1.6 KiB
Go HTML Template
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<h4 class="ui top attached header">
{{ctx.Locale.Tr "settings.quota"}}
</h4>
<div class="ui attached segment">
<p>{{if .ContextUser.IsOrganization}}{{ctx.Locale.Tr "settings.quota.applies_to_org"}}{{else}}{{ctx.Locale.Tr "settings.quota.applies_to_user"}}{{end}}:</p>
{{range $group := .QuotaGroups}}
<p class="tw-my-4"><strong>{{$group.Name}}</strong></p>
<div class="tw-ml-4">
{{range $rule := .Rules}}
<div class="tw-flex tw-justify-between">
<span class="tw-flex tw-items-center tw-gap-2{{if eq $rule.Limit -1}} tw-mb-5{{end}}">
{{if $rule.Acceptable ($.SizeUsed)}}
{{svg "octicon-check-circle-fill" 16 "text green"}}
{{$rule.Name}}
{{else}}
{{svg "octicon-alert-fill" 16 "text red"}}
<span data-tooltip-content="{{ctx.Locale.Tr "settings.quota.rule.exceeded.helper"}}" data-tooltip-placement="top">
{{$rule.Name}} {{ctx.Locale.Tr "settings.quota.rule.exceeded"}}
</span>
{{end}}
</span>
<span>{{ctx.Locale.TrSize ($rule.Sum $.SizeUsed)}} / {{if eq $rule.Limit -1 -}}{{ctx.Locale.Tr "settings.quota.rule.no_limit"}}{{else}}{{ctx.Locale.TrSize $rule.Limit}}{{end}}</span>
</div>
<div class="ui segment">
{{range $idx, $subject := .Subjects}}
<div class="bar" style="width: calc(max(1%, {{Eval 100.0 "*" ($.SizeUsed.CalculateFor $subject) "/" $rule.Limit}}%)); background-color: oklch(80% 30% {{call $.Color $subject}}deg)" data-tooltip-placement="top" data-tooltip-content="{{call $.PrettySubject $subject}} {{ctx.Locale.TrSize ($.SizeUsed.CalculateFor $subject)}}" data-tooltip-follow-cursor="horizontal"></div>
{{end}}
</div>
{{end}}
</div>
{{end}}
</div>