美化管理前端,修改服务端默认数据库为SQLite || Beautify the management front-end and modify the default database of the server to SQLite#3602
Closed
zjhcx wants to merge 4 commits into
Closed
美化管理前端,修改服务端默认数据库为SQLite || Beautify the management front-end and modify the default database of the server to SQLite#3602zjhcx wants to merge 4 commits into
zjhcx wants to merge 4 commits into
Conversation
github-actions
Bot
changed the title
Contributor
There was a problem hiding this comment.
Pull request overview
This PR modernizes Waline’s admin UI and improves local server development by auto-falling back to SQLite when no storage backend is configured.
Changes:
- Refactors admin UI routing to avoid hard-coded
/uipaths and refreshes the header/avatar UI styling. - Updates the server dashboard middleware to optionally serve a local admin bundle and adjusts avatar proxying to skip
data:URIs. - Enhances local dev (
server:dev) to default to SQLite + a dev JWT token, and updates docs/examples/ignores accordingly.
Reviewed changes
Copilot reviewed 28 out of 31 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| pnpm-lock.yaml | Lockfile updates (patchedDependencies structure + Node types peer changes). |
| packages/server/src/service/markdown/mathjax.js | Registers MathJax HTML handler for proper adaptor behavior. |
| packages/server/src/service/avatar.js | Changes default avatar generation and adds SVG data-URI fallback. |
| packages/server/src/service/akismet.js | Refactors Akismet export to a named function. |
| packages/server/src/middleware/dashboard.js | Adds local admin bundle serving and dynamic script injection. |
| packages/server/src/logic/base.js | Avoids proxying data: avatar URLs. |
| packages/server/src/controller/user.js | Avoids proxying data: avatar URLs in user listing paths. |
| packages/server/src/controller/token.js | Avoids proxying data: avatar URLs in token responses. |
| packages/server/src/controller/comment.js | Avoids proxying data: avatar URLs when formatting comments. |
| packages/server/development.js | Adds storage env detection + default SQLite/JWT_TOKEN for local dev. |
| packages/admin/vite.config.ts | Simplifies dev proxy to a unified /api backend and binds host. |
| packages/admin/src/utils/ui.js | Introduces getUiPath helper to compute UI base paths dynamically. |
| packages/admin/src/style/style.css | Tweaks legacy style rules used by admin UI. |
| packages/admin/src/style/index.css | Adds CSS entry file that imports normalize/grid/style/custom. |
| packages/admin/src/style/custom.css | Adds modernized admin UI styling (header/layout/forms/tables). |
| packages/admin/src/pages/user/index.jsx | Updates avatar rendering to use the new buildAvatar signature. |
| packages/admin/src/pages/register/index.jsx | Removes hard-coded /ui navigation/routes via getUiPath. |
| packages/admin/src/pages/profile/index.jsx | Uses buildAvatar for profile avatar and improves avatar button markup. |
| packages/admin/src/pages/manage-comments/utils.js | Replaces gravatar hashing with SVG fallback avatar builder. |
| packages/admin/src/pages/manage-comments/index.jsx | Updates comment avatar rendering to use new buildAvatar signature. |
| packages/admin/src/pages/login/index.jsx | Switches auth navigation links to getUiPath and adds captcha hook usage. |
| packages/admin/src/pages/forgot/index.jsx | Switches navigation links to getUiPath. |
| packages/admin/src/index.jsx | Switches style entry to CSS and adds root/body classes for layout. |
| packages/admin/src/components/icon/index.js | Replaces SVG React imports with inline SVG strings rendered via dangerouslySetInnerHTML. |
| packages/admin/src/components/Header.jsx | Rebuilds the top bar/nav, uses getUiPath, and adds avatar display. |
| packages/admin/src/App.jsx | Reworks routes to use getUiPath and improves auth redirect handling. |
| packages/admin/index.html | Sets default serverURL to /api/ and initializes oauthServices. |
| docs/src/en/advanced/contribution.md | Documents SQLite fallback behavior for server:dev. |
| docs/src/advanced/contribution.md | Documents SQLite fallback behavior for server:dev (ZH). |
| .gitignore | Ignores local data/ directory and error.log. |
| .env.example | Adds SQLite/JWT examples and fixes PostgreSQL env var typos. |
Files not reviewed (2)
- packages/admin/src/components/icon/index.js: Language not supported
- pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+1
to
+13
| const buildFallbackAvatarDataUri = (name = '', size = 40) => { | ||
| const label = (typeof name === 'string' ? name.trim().charAt(0) : '').toUpperCase() || 'W'; | ||
| const fontSize = Math.round(size * 0.42); | ||
| const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 ${size} ${size}"> | ||
| <defs> | ||
| <linearGradient id="walineAvatarGradient" x1="0%" y1="0%" x2="100%" y2="100%"> | ||
| <stop offset="0%" stop-color="#0f6bff" /> | ||
| <stop offset="100%" stop-color="#55b1ff" /> | ||
| </linearGradient> | ||
| </defs> | ||
| <circle cx="${size / 2}" cy="${size / 2}" r="${size / 2}" fill="url(#walineAvatarGradient)" /> | ||
| <text x="50%" y="50%" fill="#ffffff" font-family="Avenir Next, SF Pro Display, Segoe UI, PingFang SC, sans-serif" font-size="${fontSize}" font-weight="700" text-anchor="middle" dominant-baseline="central">${label}</text> | ||
| </svg>`; |
Comment on lines
+50
to
55
| if (GRAVATAR_STR) { | ||
| return env.renderString(GRAVATAR_STR, comment); | ||
| } | ||
|
|
||
| return env.renderString(gravatarStr, comment); | ||
| return buildFallbackAvatarDataUri(comment?.nick); | ||
| } |
| const adminBundlePath = path.resolve(__dirname, '../../../admin/dist/admin.js'); | ||
|
|
||
| const getUiBasePath = (requestPath = '') => | ||
| requestPath.match(/^(.*?\/ui)(?:\/.*)?$/u)?.[1] || '/ui'; |
Comment on lines
+12
to
+25
| const uiBasePath = getUiBasePath(ctx.path); | ||
| const localAdminAssetPath = `${uiBasePath}/assets/admin.js`; | ||
| const localAdminBundleAvailable = fs.existsSync(adminBundlePath); | ||
|
|
||
| if (ctx.path === localAdminAssetPath) { | ||
| if (!localAdminBundleAvailable) { | ||
| ctx.status = 404; | ||
| ctx.body = 'Local admin bundle not found'; | ||
| return; | ||
| } | ||
|
|
||
| ctx.type = 'js'; | ||
| ctx.body = fs.createReadStream(adminBundlePath); | ||
| return; |
| @@ -1,7 +1,11 @@ | |||
| SQLITE_PATH=./data | |||
| JWT_TOKEN=waline-dev-jwt-token | |||
Collaborator
|
建议这个 PR 能不能辛苦拆分一下，拆成：
拆分一下方便 CR，2和3的改造感觉需要待讨论。现在这个混在一起感觉 CR 的难度比较高 I suggest you split this PR into:
Split it to facilitate CR. The transformation of 2 and 3 feels like it needs to be discussed. Now it feels like CR is more difficult when mixed together |
Author
好的
Okay |
Author
已经将后台前端优化拆分到#3603 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
概述
美化 Waline 的管理前端，优化服务端的本地开发体验。本地未配置任何存储环境变量时，服务端会自动回退并使用本地 SQLite 数据库
详情
1. 美化管理前端
重构了管理后端的顶栏，加入了更现代的用户头像显示。移除了硬编码的
/ui前缀，引入getUiPath工具函数来动态计算基础路径，使管理前端更稳定。重构了头像构建逻辑，当检测到默认或无效头像时，会自动生成一个优雅的、带有用户首字母的 SVG 渐变数据占位图，提升视觉一致性。将原先的分散代理合并为统一的/api代理，切换样式引入方式（从.scss改为原生的.css）。2. 服务端默认数据库优化
在
packages/server/development.js中增加了环境变量检测。本地开发（pnpm run server:dev）若未检测到任何主流数据库配置，将默认启用本地 SQLite（路径为../../data），并自动提供默认的JWT_TOKEN。同步更新了中英文的贡献指南（contribution.md）提示信息，并在.env.example中补充了 SQLite 的配置示例，同时在.gitignore中忽略了本地自动生成的data/目录。3. 其他
akismet和mathjax服务中的部分插件加载与函数命名规范问题。截图
Overview
Beautify the management front-end of Waline and optimize the local development experience on the server side. When no storage environment variables are configured locally, the server will automatically fall back and use the local SQLite database.
Details
1. Beautify the management front-end
The top bar of the admin backend has been restructured and a more modern user avatar display has been added. The hard-coded
/uiprefix is removed, and thegetUiPathutility function is introduced to dynamically calculate the base path, making the management front-end more stable. The avatar construction logic has been restructured. When a default or invalid avatar is detected, an elegant SVG gradient data placeholder image with the user's initials will be automatically generated to improve visual consistency. Merge the original distributed agents into a unified/apiagent, and switch the style import method (from.scssto native.css).2. Server-side default database optimization
Added environment variable detection in
packages/server/development.js. If no mainstream database configuration is detected for local development (pnpm run server:dev), local SQLite will be enabled by default (path is../../data) and the defaultJWT_TOKENwill be automatically provided. Synchronously updated the Chinese and English contribution guide (contribution.md) prompt information, and added SQLite configuration examples in.env.example, while ignoring the locally automatically generateddata/directory in.gitignore.3. Others
akismetandmathjaxservices.Screenshot