mirror of
https://github.com/go-gitea/gitea.git
synced 2026-04-01 08:55:58 +02:00
1. In dev mode, discover themes from source files in `web_src/css/themes/` instead of AssetFS. In prod, use AssetFS only. Extract shared `collectThemeFiles` helper to deduplicate theme file handling. 2. Implement `fs.ReadDirFS` on `LayeredFS` to support theme file discovery. 3. `IsViteDevMode` now performs an HTTP health check against the vite dev server instead of only checking the port file exists. Result is cached with a 1-second TTL. 4. Refactor theme caching from mutex to atomic pointer with time-based invalidation, allowing themes to refresh when vite dev mode state changes. 5. Move `ViteDevMiddleware` into `ProtocolMiddlewares` so it applies to both install and web routes. 6. Show a `ViteDevMode` label in the page footer when vite dev server is active. 7. Add `/__vite_dev_server_check` endpoint to vite dev server for the health check. 8. Ensure `.vite` directory exists before writing the dev-port file. 9. Minor CSS fixes: footer gap, navbar mobile alignment. --- This PR was written with the help of Claude Opus 4.6 --------- Signed-off-by: silverwind <me@silverwind.io> Co-authored-by: Claude (Opus 4.6) <noreply@anthropic.com> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
270 lines
8.0 KiB
Go
270 lines
8.0 KiB
Go
// Copyright 2024 The Gitea Authors. All rights reserved.
|
|
// SPDX-License-Identifier: MIT
|
|
|
|
package webtheme
|
|
|
|
import (
|
|
"io/fs"
|
|
"os"
|
|
"path"
|
|
"regexp"
|
|
"sort"
|
|
"strings"
|
|
"sync/atomic"
|
|
"time"
|
|
|
|
"code.gitea.io/gitea/modules/container"
|
|
"code.gitea.io/gitea/modules/log"
|
|
"code.gitea.io/gitea/modules/public"
|
|
"code.gitea.io/gitea/modules/setting"
|
|
"code.gitea.io/gitea/modules/util"
|
|
)
|
|
|
|
type themeCollectionStruct struct {
|
|
lastCheckTime time.Time
|
|
usingViteDevMode bool
|
|
|
|
themeList []*ThemeMetaInfo
|
|
themeMap map[string]*ThemeMetaInfo
|
|
}
|
|
|
|
var themeCollection atomic.Pointer[themeCollectionStruct]
|
|
|
|
const (
|
|
fileNamePrefix = "theme-"
|
|
fileNameSuffix = ".css"
|
|
)
|
|
|
|
type ThemeMetaInfo struct {
|
|
FileName string
|
|
InternalName string
|
|
DisplayName string
|
|
ColorblindType string
|
|
ColorScheme string
|
|
}
|
|
|
|
func (info *ThemeMetaInfo) GetDescription() string {
|
|
if info.ColorblindType == "red-green" {
|
|
return "Red-green colorblind friendly"
|
|
}
|
|
if info.ColorblindType == "blue-yellow" {
|
|
return "Blue-yellow colorblind friendly"
|
|
}
|
|
return ""
|
|
}
|
|
|
|
func (info *ThemeMetaInfo) GetExtraIconName() string {
|
|
if info.ColorblindType == "red-green" {
|
|
return "gitea-colorblind-redgreen"
|
|
}
|
|
if info.ColorblindType == "blue-yellow" {
|
|
return "gitea-colorblind-blueyellow"
|
|
}
|
|
return ""
|
|
}
|
|
|
|
func parseThemeMetaInfoToMap(cssContent string) map[string]string {
|
|
/*
|
|
The theme meta info is stored in the CSS file's variables of `gitea-theme-meta-info` element,
|
|
which is a privately defined and is only used by backend to extract the meta info.
|
|
Not using ":root" because it is difficult to parse various ":root" blocks when importing other files,
|
|
it is difficult to control the overriding, and it's difficult to avoid user's customized overridden styles.
|
|
*/
|
|
metaInfoContent := cssContent
|
|
if pos := strings.LastIndex(metaInfoContent, "gitea-theme-meta-info"); pos >= 0 {
|
|
metaInfoContent = metaInfoContent[pos:]
|
|
}
|
|
|
|
reMetaInfoItem := `
|
|
(
|
|
\s*(--[-\w]+)
|
|
\s*:
|
|
\s*(
|
|
("(\\"|[^"])*")
|
|
|('(\\'|[^'])*')
|
|
|([^'";]+)
|
|
)
|
|
\s*;?
|
|
\s*
|
|
)
|
|
`
|
|
reMetaInfoItem = strings.ReplaceAll(reMetaInfoItem, "\n", "")
|
|
reMetaInfoBlock := `\bgitea-theme-meta-info\s*\{(` + reMetaInfoItem + `+)\}`
|
|
re := regexp.MustCompile(reMetaInfoBlock)
|
|
matchedMetaInfoBlock := re.FindAllStringSubmatch(metaInfoContent, -1)
|
|
if len(matchedMetaInfoBlock) == 0 {
|
|
return nil
|
|
}
|
|
re = regexp.MustCompile(strings.ReplaceAll(reMetaInfoItem, "\n", ""))
|
|
matchedItems := re.FindAllStringSubmatch(matchedMetaInfoBlock[0][1], -1)
|
|
m := map[string]string{}
|
|
for _, item := range matchedItems {
|
|
v := item[3]
|
|
if after, ok := strings.CutPrefix(v, `"`); ok {
|
|
v = strings.TrimSuffix(after, `"`)
|
|
v = strings.ReplaceAll(v, `\"`, `"`)
|
|
} else if after, ok := strings.CutPrefix(v, `'`); ok {
|
|
v = strings.TrimSuffix(after, `'`)
|
|
v = strings.ReplaceAll(v, `\'`, `'`)
|
|
}
|
|
m[item[2]] = v
|
|
}
|
|
return m
|
|
}
|
|
|
|
func defaultThemeMetaInfoByFileName(fileName string) *ThemeMetaInfo {
|
|
internalName := strings.TrimSuffix(strings.TrimPrefix(fileName, fileNamePrefix), fileNameSuffix)
|
|
// For built-in themes, the manifest knows the unhashed entry name (e.g. "theme-gitea-dark")
|
|
// which lets us correctly strip the content hash without guessing.
|
|
// Custom themes are not in the manifest and never have content hashes.
|
|
if name := public.AssetNameFromHashedPath("css/" + fileName); name != "" {
|
|
internalName = strings.TrimPrefix(name, fileNamePrefix)
|
|
}
|
|
themeInfo := &ThemeMetaInfo{
|
|
FileName: fileName,
|
|
InternalName: internalName,
|
|
}
|
|
themeInfo.DisplayName = themeInfo.InternalName
|
|
return themeInfo
|
|
}
|
|
|
|
func defaultThemeMetaInfoByInternalName(fileName string) *ThemeMetaInfo {
|
|
return defaultThemeMetaInfoByFileName(fileNamePrefix + fileName + fileNameSuffix)
|
|
}
|
|
|
|
func parseThemeMetaInfo(fileName, cssContent string) *ThemeMetaInfo {
|
|
themeInfo := defaultThemeMetaInfoByFileName(fileName)
|
|
m := parseThemeMetaInfoToMap(cssContent)
|
|
if m == nil {
|
|
return themeInfo
|
|
}
|
|
themeInfo.DisplayName = m["--theme-display-name"]
|
|
themeInfo.ColorblindType = m["--theme-colorblind-type"]
|
|
themeInfo.ColorScheme = m["--theme-color-scheme"]
|
|
return themeInfo
|
|
}
|
|
|
|
func collectThemeFiles(dirFS fs.ReadDirFS, fsPath string) (themes []*ThemeMetaInfo, _ error) {
|
|
files, err := dirFS.ReadDir(fsPath)
|
|
if err != nil {
|
|
return nil, err
|
|
}
|
|
for _, file := range files {
|
|
fileName := file.Name()
|
|
if !strings.HasPrefix(fileName, fileNamePrefix) || !strings.HasSuffix(fileName, fileNameSuffix) {
|
|
continue
|
|
}
|
|
content, err := fs.ReadFile(dirFS, path.Join(fsPath, file.Name()))
|
|
if err != nil {
|
|
log.Error("Failed to read theme file %q: %v", fileName, err)
|
|
continue
|
|
}
|
|
themes = append(themes, parseThemeMetaInfo(fileName, util.UnsafeBytesToString(content)))
|
|
}
|
|
return themes, nil
|
|
}
|
|
|
|
func loadThemesFromAssets(isViteDevMode bool) (themeList []*ThemeMetaInfo, themeMap map[string]*ThemeMetaInfo) {
|
|
var themeDir fs.ReadDirFS
|
|
var themePath string
|
|
|
|
if isViteDevMode {
|
|
// In vite dev mode, Vite serves themes directly from source files.
|
|
themeDir, themePath = os.DirFS(setting.StaticRootPath).(fs.ReadDirFS), "web_src/css/themes"
|
|
} else {
|
|
// Without vite dev server, use built assets from AssetFS.
|
|
themeDir, themePath = public.AssetFS(), "assets/css"
|
|
}
|
|
|
|
foundThemes, err := collectThemeFiles(themeDir, themePath)
|
|
if err != nil {
|
|
log.Error("Failed to load theme files: %v", err)
|
|
return themeList, themeMap
|
|
}
|
|
|
|
themeList = foundThemes
|
|
if len(setting.UI.Themes) > 0 {
|
|
themeList = nil // only allow the themes specified in the setting
|
|
allowedThemes := container.SetOf(setting.UI.Themes...)
|
|
for _, theme := range foundThemes {
|
|
if allowedThemes.Contains(theme.InternalName) {
|
|
themeList = append(themeList, theme)
|
|
}
|
|
}
|
|
}
|
|
|
|
sort.Slice(themeList, func(i, j int) bool {
|
|
if themeList[i].InternalName == setting.UI.DefaultTheme {
|
|
return true
|
|
}
|
|
if themeList[i].ColorblindType != themeList[j].ColorblindType {
|
|
return themeList[i].ColorblindType < themeList[j].ColorblindType
|
|
}
|
|
return themeList[i].DisplayName < themeList[j].DisplayName
|
|
})
|
|
|
|
themeMap = map[string]*ThemeMetaInfo{}
|
|
for _, theme := range themeList {
|
|
themeMap[theme.InternalName] = theme
|
|
}
|
|
return themeList, themeMap
|
|
}
|
|
|
|
func getAvailableThemes() *themeCollectionStruct {
|
|
themes := themeCollection.Load()
|
|
|
|
now := time.Now()
|
|
if themes != nil && now.Sub(themes.lastCheckTime) < time.Second {
|
|
return themes
|
|
}
|
|
|
|
isViteDevMode := public.IsViteDevMode()
|
|
useLoadedThemes := themes != nil && (setting.IsProd || themes.usingViteDevMode == isViteDevMode)
|
|
if useLoadedThemes && len(themes.themeList) > 0 {
|
|
return themes
|
|
}
|
|
|
|
themeList, themeMap := loadThemesFromAssets(isViteDevMode)
|
|
hasAvailableThemes := len(themeList) > 0
|
|
if !hasAvailableThemes {
|
|
defaultTheme := defaultThemeMetaInfoByInternalName(setting.UI.DefaultTheme)
|
|
themeList = []*ThemeMetaInfo{defaultTheme}
|
|
themeMap = map[string]*ThemeMetaInfo{setting.UI.DefaultTheme: defaultTheme}
|
|
}
|
|
|
|
if setting.IsProd {
|
|
if !hasAvailableThemes {
|
|
setting.LogStartupProblem(1, log.ERROR, "No theme candidate in asset files, but Gitea requires there should be at least one usable theme")
|
|
}
|
|
if themeMap[setting.UI.DefaultTheme] == nil {
|
|
setting.LogStartupProblem(1, log.ERROR, "Default theme %q is not available, please correct the '[ui].DEFAULT_THEME' setting in the config file", setting.UI.DefaultTheme)
|
|
}
|
|
}
|
|
|
|
themes = &themeCollectionStruct{now, isViteDevMode, themeList, themeMap}
|
|
themeCollection.Store(themes)
|
|
return themes
|
|
}
|
|
|
|
func GetAvailableThemes() []*ThemeMetaInfo {
|
|
return getAvailableThemes().themeList
|
|
}
|
|
|
|
func GetThemeMetaInfo(internalName string) *ThemeMetaInfo {
|
|
return getAvailableThemes().themeMap[internalName]
|
|
}
|
|
|
|
// GuaranteeGetThemeMetaInfo guarantees to return a non-nil ThemeMetaInfo,
|
|
// to simplify the caller's logic, especially for templates.
|
|
// There are already enough warnings messages if the default theme is not available.
|
|
func GuaranteeGetThemeMetaInfo(internalName string) *ThemeMetaInfo {
|
|
info := GetThemeMetaInfo(internalName)
|
|
if info == nil {
|
|
info = GetThemeMetaInfo(setting.UI.DefaultTheme)
|
|
}
|
|
if info == nil {
|
|
info = &ThemeMetaInfo{DisplayName: "unavailable", InternalName: "unavailable", FileName: "unavailable"}
|
|
}
|
|
return info
|
|
}
|