fix(dashboard): sync t2i template preview with text_base64 and add Shiki runtime support#7729
Open
fudengming wants to merge 2 commits intoAstrBotDevs:masterfrom
Open
fix(dashboard): sync t2i template preview with text_base64 and add Shiki runtime support#7729fudengming wants to merge 2 commits intoAstrBotDevs:masterfrom
fudengming wants to merge 2 commits intoAstrBotDevs:masterfrom
Conversation
…iki runtime support
- Update preview regex from {{ text | safe }} to {{ text_base64 }} with base64 encoding
- Add Shiki runtime variable support ({{ shiki_runtime | safe }}) and API endpoint
- Add migration warning alert when old {{ text | safe }} syntax is detected
- Update default template to use base64 decoding approach
- Sync i18n hints for zh-CN, en-US, ru-RU
- Add breaking change notice to changelog v4.23.2
Fixes AstrBotDevs#7713
Contributor
There was a problem hiding this comment.
Hey - I've found 1 issue, and left some high level feedback:
- The frontend Shiki runtime fetch uses
/api/t2i/shiki-runtimewhile the backend route is registered as/t2i/shiki_runtime, so the URL/path should be aligned or proxied consistently to avoid 404s. - The
previewContentregex forshiki_runtime(/\{\{\s*shiki_runtime\s*|\s*safe\s*\}\}/g) will treat|as an alternation operator instead of a literal pipe; consider grouping and escaping the pipe (e.g./\{\{\s*shiki_runtime\s*\|\s*safe\s*\}\}/g) so it matches the intended template syntax.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- The frontend Shiki runtime fetch uses `/api/t2i/shiki-runtime` while the backend route is registered as `/t2i/shiki_runtime`, so the URL/path should be aligned or proxied consistently to avoid 404s.
- The `previewContent` regex for `shiki_runtime` (`/\{\{\s*shiki_runtime\s*|\s*safe\s*\}\}/g`) will treat `|` as an alternation operator instead of a literal pipe; consider grouping and escaping the pipe (e.g. `/\{\{\s*shiki_runtime\s*\|\s*safe\s*\}\}/g`) so it matches the intended template syntax.
## Individual Comments
### Comment 1
<location path="dashboard/src/components/shared/T2ITemplateEditor.vue" line_range="335" />
<code_context>
- content = content.replace(/\{\{\s*text\s*\|\s*safe\s*\}\}/g, previewData.value.text)
+ content = content.replace(/\{\{\s*text_base64\s*\}\}/g, btoa(String.fromCharCode(...new TextEncoder().encode(previewData.value.text))))
content = content.replace(/\{\{\s*version\s*\}\}/g, previewData.value.version)
+ content = content.replace(/\{\{\s*shiki_runtime\s*|\s*safe\s*\}\}/g, previewData.value.shikiRuntime)
return content
} catch (error) {
</code_context>
<issue_to_address>
**issue (bug_risk):** The regex for `shiki_runtime | safe` is incorrect and will match unintended patterns.
Because of operator precedence, the pattern `/(\{\\s*shiki_runtime\\s*|\\s*safe\\s*\\}\\)/g` is interpreted as `({{ shiki_runtime ...)` **or** `(safe }})`, so it can replace partial fragments instead of the full `{{ shiki_runtime | safe }}` expression. This risks corrupting unrelated template content.
To align with the existing `text | safe` handling and only match the full expression, use:
```js
content = content.replace(/\{\{\s*shiki_runtime\s*\|\s*safe\s*\}\}/g, previewData.value.shikiRuntime)
```
</issue_to_address>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
Contributor
There was a problem hiding this comment.
Code Review
This pull request implements a breaking change in the Text-to-Image (T2I) template system, transitioning from text | safe to text_base64 to handle text rendering via base64 encoding. It adds a new backend endpoint for the Shiki runtime, updates the frontend editor with migration alerts, and adjusts the preview rendering logic. Two high-severity issues were identified: a path mismatch between the frontend API call and the backend route, and a regex error in the template preview logic where the pipe character was not properly escaped, leading to incorrect variable replacement.
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.
修复 #7501 引入的 t2i 模板变量变更未同步到 WebUI 预览、i18n文案和更新日志的问题。(#7713)
Modifications / 改动点
更新
T2ITemplateEditor.vue预览逻辑,支持{{ text_base64 }}和{{ shiki_runtime | safe }}新增迁移提示,检测到旧语法
{{ text | safe }}时提示用户更新默认模板为新 base64 解码方式
同步 zh-CN / en-US / ru-RU 的 i18n 变量说明
在 v4.23.2 CHANGELOG 中补充模板变量变更说明
新增
/api/t2i/shiki_runtime接口支持 Shiki 运行时获取This is NOT a breaking change. / 这不是一个破坏性变更。
Screenshots or Test Results / 运行截图或测试结果
在使用旧语法时:


在使用新语法时:
Checklist / 检查清单
😊 If there are new features added in the PR, I have discussed it with the authors through issues/emails, etc.
/ 如果 PR 中有新加入的功能,已经通过 Issue / 邮件等方式和作者讨论过。
👀 My changes have been well-tested, and "Verification Steps" and "Screenshots" have been provided above.
/ 我的更改经过了良好的测试,并已在上方提供了“验证步骤”和“运行截图”。
🤓 I have ensured that no new dependencies are introduced, OR if new dependencies are introduced, they have been added to the appropriate locations in
requirements.txtandpyproject.toml./ 我确保没有引入新依赖库,或者引入了新依赖库的同时将其添加到
requirements.txt和pyproject.toml文件相应位置。😮 My changes do not introduce malicious code.
/ 我的更改没有引入恶意代码。
Summary by Sourcery
Sync t2i template editor preview and backend with the new text_base64 and Shiki runtime-based templating, and add migration guidance for existing templates.
New Features:
Bug Fixes:
Documentation: