Add svg linter and fix incorrect svgs (#30086)

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

Adds a new linter that searches for non-existant SVG images in
templates. Output before the fix was:

```
$ make lint-templates
SVG "octicon-warning" not found, used in templates/devtest/flex-list.tmpl
SVG "octicon-warning" not found, used in templates/devtest/flex-list.tmpl
SVG "octicon-markup" not found, used in templates/repo/diff/comment_form.tmpl
make: *** [Makefile:438: lint-templates] Error 1
```

<img width="306" alt="Screenshot 2024-03-25 at 23 31 05"
src="https://github.com/go-gitea/gitea/assets/115237/1052d1a9-bfec-4d5a-9cae-f895f78f7c93">

(cherry picked from commit 2ab5f05f40d93224f73e211e84de50a88a6ecf03)

Conflicts:
	.github/workflows/files-changed.yml
	.github/workflows/pull-compliance.yml
	do not exist in Forgejo and the Forgejo workflows
	already contain the changes
This commit is contained in:
silverwind 2024-03-26 12:19:15 +01:00 committed by Earl Warren
parent e93e29822d
commit 72a3a6fde7
No known key found for this signature in database
GPG key ID: 0579CB2928A78A00
4 changed files with 31 additions and 4 deletions

View file

@ -458,7 +458,8 @@ lint-actions:
$(GO) run $(ACTIONLINT_PACKAGE) $(GO) run $(ACTIONLINT_PACKAGE)
.PHONY: lint-templates .PHONY: lint-templates
lint-templates: .venv lint-templates: .venv node_modules
@node tools/lint-templates-svg.js
@poetry run djlint $(shell find templates -type f -iname '*.tmpl') @poetry run djlint $(shell find templates -type f -iname '*.tmpl')
.PHONY: lint-yaml .PHONY: lint-yaml

View file

@ -25,7 +25,7 @@
</div> </div>
<div class="flex-item-trailing"> <div class="flex-item-trailing">
<button class="ui tiny red button"> <button class="ui tiny red button">
{{svg "octicon-warning" 14}} CJK文本测试 {{svg "octicon-alert" 14}} CJK文本测试
</button> </button>
<button class="ui tiny primary button"> <button class="ui tiny primary button">
{{svg "octicon-info" 14}} Button {{svg "octicon-info" 14}} Button
@ -54,7 +54,7 @@
</div> </div>
<div class="flex-item-trailing"> <div class="flex-item-trailing">
<button class="ui tiny red button"> <button class="ui tiny red button">
{{svg "octicon-warning" 12}} CJK文本测试 <!-- single CJK text test, it shouldn't be horizontal --> {{svg "octicon-alert" 12}} CJK文本测试 <!-- single CJK text test, it shouldn't be horizontal -->
</button> </button>
</div> </div>
</div> </div>

View file

@ -26,7 +26,7 @@
{{end}} {{end}}
<div class="field footer tw-mx-2"> <div class="field footer tw-mx-2">
<span class="markup-info">{{svg "octicon-markup"}} {{ctx.Locale.Tr "repo.diff.comment.markdown_info"}}</span> <span class="markup-info">{{svg "octicon-markdown"}} {{ctx.Locale.Tr "repo.diff.comment.markdown_info"}}</span>
<div class="tw-text-right"> <div class="tw-text-right">
{{if $.reply}} {{if $.reply}}
<button class="ui submit primary tiny button btn-reply" type="submit">{{ctx.Locale.Tr "repo.diff.comment.reply"}}</button> <button class="ui submit primary tiny button btn-reply" type="submit">{{ctx.Locale.Tr "repo.diff.comment.reply"}}</button>

26
tools/lint-templates-svg.js Executable file
View file

@ -0,0 +1,26 @@
#!/usr/bin/env node
import {readdirSync, readFileSync} from 'node:fs';
import {parse, relative} from 'node:path';
import {fileURLToPath} from 'node:url';
import {exit} from 'node:process';
import fastGlob from 'fast-glob';
const knownSvgs = new Set();
for (const file of readdirSync(new URL('../public/assets/img/svg', import.meta.url))) {
knownSvgs.add(parse(file).name);
}
const rootPath = fileURLToPath(new URL('..', import.meta.url));
let hadErrors = false;
for (const file of fastGlob.sync(fileURLToPath(new URL('../templates/**/*.tmpl', import.meta.url)))) {
const content = readFileSync(file, 'utf8');
for (const [_, name] of content.matchAll(/svg ["'`]([^"'`]+)["'`]/g)) {
if (!knownSvgs.has(name)) {
console.info(`SVG "${name}" not found, used in ${relative(rootPath, file)}`);
hadErrors = true;
}
}
}
exit(hadErrors ? 1 : 0);