okooooooo/biliup
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
1,042 Commits 1 Branch 0 Tags
master
Commit Graph
7 Commits
Author SHA1 Message Date
Noah 20fe058b15 fix(ui): 修复 React Compiler lint 命中并恢复规则为 error (#1711) 
* fix(ui): 主题与侧栏偏好改用 useSyncExternalStore 读取，去掉 effect 内 setState

react-hooks/set-state-in-effect 命中 4 处，都是「挂载后在 effect 里读浏览器状态再 setState」：

- app/(app)/layout.tsx:117 侧栏折叠偏好、:136 主题模式：两者都是 localStorage 里的值。
  新增 useLocalStorageValue(key)，用 useSyncExternalStore 订阅：服务端与水合期快照固定为
  null（与 SSR 输出一致，不会水合不一致），水合完成后 React 自己用真实值重渲染一次；
  写入走 setter 并通知本页订阅者。localStorage 写失败时退回内存值，本页内仍可切换，
  与原先 try/catch 后照常 setState 的行为一致。
- app/lib/utils/index.tsx:66 useSystemTheme：matchMedia 是外部状态，改为 useSyncExternalStore
  订阅 change 事件，服务端快照 light，与原来 useState('light') 再 effect 校正的结果一致。
- app/ui/ThemeButton.tsx:30：原来点击后先置 switchTrigger，再在 effect 里读标志位切主题、
  setMode、清标志位，图标也在 effect 里 setState。改为点击事件里直接算出下一模式并
  applyThemeMode + setMode，图标由 mode 派生，不再有中间 state 与 effect；切换结果相同，
  少一轮渲染。setMode 的类型收窄为 (mode: string) => void，调用方只传字符串。

useTheme 未改：它的首次跳过逻辑仍然成立（首帧主题由 <head> 内联脚本设置）。

* fix(ui): 日志页、空间配置页、账号列表与模板表单去掉 effect 内同步 setState

react-hooks/set-state-in-effect 其余 5 处：

- app/(app)/logviewer/page.tsx:133：connectWebSocket() 开头同步 setIsLoading(true)/setLogs([])
  再建连接，effect 与「刷新」按钮共用。拆开：effect 只负责建立 WebSocket、把消息写进
  state、cleanup 时关闭（上一条连接不再靠 ref 手动 close）；清空日志 + 进入加载态移到触发
  重连的事件里（切 Tab 的 onChange、刷新按钮），刷新通过 connectSeq 计数器让 effect 重跑。
  首次挂载时两个 state 本来就是初始值，其余时序与原来一致；顺带删掉不再需要的
  exhaustive-deps 禁用注释。
- app/(app)/dashboard/page.tsx:101：校验失败后先切 Tab / 平台，再在 effect 里滚到出错字段并
  把 pendingField 清空。改为 flushSync 同步提交切面板的 state，随后直接 scrollIntoView +
  focus（React 文档推荐的「更新后读 DOM」写法），去掉 pendingField 这个中间 state。
  onSubmitFail 由 Semi 在 Promise.catch 里调用，不在渲染期，flushSync 合法。
- app/lib/use-streamers.ts:26 useBiliUsers：data 为空时同步 setList([])。改为返回值直接派生
  （无账号 → 空数组常量），effect 里只保留异步补全；data 为空数组时 Promise.all 解析为 []
  仍会把上一批结果清掉，之后再有账号不会先闪旧数据。
- app/ui/TemplateFields.tsx:183：挂载后从 formApi.getValue('dtime') 算滚轮初始选中值。
  Semi Form 在构造函数里就把 initValues 放进 store，首次渲染即可读到，改为 useState 的
  惰性初始值（换算逻辑抽成 delayFromDtime），结果与 effect 版本相同。
- app/(app)/components/BackgroundSetter.tsx:71：hasBg / opacity 挂载后从 localStorage 读。
  改为 useState 惰性初始值；两个值只在面板展开后渲染，SSR 首帧输出不受影响。

* fix(ui): 修复渲染期不纯写法：卡片实时时长、平台插件查找、time_range 转换

- react-hooks/purity  app/ui/StreamerCard.tsx:101：渲染期调 Date.now() 算「已直播多久」。
  新增共享时钟 useNowSec()（app/lib/use-dashboard.ts）：模块级 store 由定时器每秒推进，
  组件用 useSyncExternalStore 读取，首个订阅者接入时校准一次。时长拆成 LiveDuration 子组件，
  只有录制中的卡片挂载它，其余卡片不随时钟重渲染。显示值语义不变（开播至今，同一
  formatDuration），刷新节奏从「随 10 s 轮询重渲染时更新」变为每秒更新。timeAgo 内部也用
  Date.now() 但未被规则命中（在工具函数里），本次不动。
- react-hooks/static-components  app/ui/OverrideModal.tsx:297：JSX 里用 IIFE 调 platformSetting()
  拿到组件再渲染，规则把它当成「渲染期创建的组件」。实际是按 url 从模块级常量表
  SupportedPlatforms 取组件。改为先找出匹配的键，再按键从常量表取值，让「同一引用」这一点
  在代码上可见；匹配顺序与结果不变。
- react-hooks/immutability  app/ui/TemplateModal.tsx:121：把 props.entity.time_range 由 JSON
  字串就地改写成 Date[]。改为 useMemo 生成一份本地副本作为 Form 的 initValues，解析失败
  保持原样并 console.error（同原逻辑），不再修改上层传下来的对象。

* chore(lint): 恢复 React Compiler 系列规则为 eslint-plugin-react-hooks 的默认 error

#1710 升级 eslint-plugin-react-hooks 7 时把 set-state-in-effect / static-components /
purity / immutability 四条降为 warn，留给专门 PR 处理。命中的 12 处已在前三个 commit 修完，
这里删掉覆盖，回到插件 recommended 的 error 级别。

* fix(ui): useTheme 不再回写 localStorage，mode 只由 useLocalStorageValue 的 setter 持久化

mode 改由 useSyncExternalStore 从 localStorage 读取后，同一个键有了两个写入方。
StrictMode 下 effect 会在挂载时执行两次，useTheme 的「跳过首次」只能挡住第一次，
第二次会用水合期的默认值 auto 把用户刚保存的主题覆盖掉，再由 store 读回 auto——
`next dev` 里每次刷新主题都会丢（生产构建没有双次 effect，不受影响）。
去掉 useTheme 里的 setItem：切换主题时 setter 已经写过同一个值；系统配色变化时原来会
把 auto 写进去，去掉后键保持缺省，读出来同样按 auto 处理，行为一致。

* fix(ui): 登录页在手机宽度下卡片超出视口、两侧被裁切

review 意见（#1711 下 ForgQi）：手机尺寸下登录页两侧被裁切。
原因：三个输入框写死 style={{ width: 440 }}，卡片宽度由它们撑成 552px（440 + 56×2 内边距），
.main 居中放置、.frame 又是 overflow: hidden，窄于 552 的屏幕上卡片两侧直接被裁掉。
改法：去掉输入框的固定宽度，卡片定宽 552px 并允许 max-width: 100% 收窄到视口，
.inputs 改为 align-items: stretch 让字段撑满卡片内容区（Semi 的 .semi-input-wrapper 默认 width: 100%），
≤480px 时内边距收到 32px 24px。桌面 1440 浅 / 深色截图与修改前像素 0 差异；390px 下卡片 370px、
输入框 322px、无横向溢出，注册模式（三个输入框）同样。
 2026-09-22 08:27:12 +00:00
NoahandAluneu f06efbb3b9 feat(ui): 前端整体重设计与统一（接手 #1653） (#1704) 
* feat(ui): 前端整体重设计与统一（接手 #1653）

来自 Aluneu 的 PR #1653（head bdcfbea），在 master 4e156ac 上重新落地。
相对原 PR 的差异：
- 剔除 logo / favicon / logo.svg 品牌资产变更，侧栏与登录页仍用 public/logo.png
- 解决与 master 的三处冲突：upload-manager add/edit 的 studioEntity 补回 #1699 的 tid_v2；
  global.tsx 下载插件说明补上 mesio（9d02856）
- README.md 相关提交在原 PR 合并上游时已归零，此处不含

主要内容：
- PageHeader / SectionTitle / data-card 统一页头与卡片容器，status.tsx 作为状态视觉的唯一来源
- 侧栏自绘重写：5 组 9 项、服务状态指示、折叠偏好持久化、移动端抽屉
- 首页从外链 iframe 改为本地数据的控制台（KPI / 进行中 / 未开播 / 24h 事件流）
- 直播管理：搜索、平台筛选、网格/列表双视图、批量暂停/删除；接口失败不再被当作空列表
- 新增 /changelog 页，运行时拉取官方 CHANGELOG，带 localStorage 离线缓存
- 全局自定义背景：仅本地图片，canvas 重绘为 JPEG data URL，2MB 上限
- 修复：根 layout 与 (app)/layout 双重 <html>/<body>、主题水合闪烁、扫码登录无保护取值崩溃、
  弹窗内 width:1000 横向溢出、移动端抽屉被遮罩拦截
- 后处理 {cmd,value} ↔ HookStep 转换抽成 lib/postprocessor.ts
- 12 个平台插件文案精简

* fix(ui): 空间配置平台列表改为遍历插件注册表

dashboard 里硬编码的 PLATFORM_LIST 让新增平台插件要改第三个地方，漏了就在 UI 里静默消失。
把顺序与文案登记到 app/ui/plugins/index.ts 的 PlatformPanels，dashboard 只负责渲染。

* fix(ui): 控制台断连判定改为全部接口失败才触发，并放宽轮询频率

- /v1/status 单独失败时原先把整个控制台替换成「无法连接后端」，主播卡片全部消失；
  现在只有四个接口全部失败才判定断连，单个接口失败只显示对应提示条
- 主播状态 4s → 10s；streamer-info（全表）、videos（扫目录）、status（序列化整份配置）
  30s → 60s；侧栏与直播管理页共用同一组常量
- 事件流的平台名复用 status.tsx 的 platformName，删掉 use-dashboard 里的重复实现
- 首页「文档」链接对齐 README 里的 biliup.github.io 地址

* fix(ui): 直播状态文案与配色在卡片和列表视图保持一致

- 列表视图的「未开播」原是红底白字，与卡片的灰色徽章不一致；改为同一套三色
- 补回 Pending →「检测中」（原页面就有，重设计后被吞成「未开播」）
- OutOfSchedule 不再归到绿色录制组，绿色只留给 Working
- 删除无人引用的 statusMeta / platformTag

* fix(ui): 编辑投稿模板页在分区列表加载失败时给出原因而不是空白

/bili/archive/pre 需要可用的 B 站 cookie，没有账号时后端返回 500；原先 isError 为真但
error 为 undefined，页面渲染成一个空 div。现在保留页头并显示服务端返回的 message。

* fix(ui): 更新日志页不再把过时的最后一条标成「最新」

仓库里的 CHANGELOG.md 停在 1.2.1，而运行版本已是 1.2.5。页面现在读取 /v1/status 的版本号：
运行版本比日志最新一条还新时去掉「最新」标签并在顶部如实说明；日志里有当前版本时标「当前运行」。

* chore(ui): 清理重设计遗留的重复代码与死代码

- 直播管理页网格 / 列表两份完全相同的操作按钮合并为一处
- 去掉源码里面向评审工具的注释（「相对 PR 版本的增强」「保留 PR 逻辑」等）
- useGlobalBackground 删除 URL 模式残留的 validateBg / isRemoteUrl，遮罩透明度钳制与滑块范围对齐（0.05–0.8）
- 删除无人引用的 (app)/page.module.css 与 BiliupStatus 类型
- 移除 react-use（useWindowSize 已由 useIsMobile 替代，代码里已无引用）

* fix(ui): 全局设置里 sync_save_dir 输入框随下载插件下拉框即时显示

原先用 useFormApi().getValue() 做条件渲染，useFormApi 不订阅表单值变化，
选了 sync-downloader 之后输入框要先保存再刷新才出现。改用 useFormState 订阅 values。

* chore(ui): 删除原 PR 已移除的两个无人引用样式文件

app/page.module.css 与 app/styles/Home.module.css 是脚手架遗留，#1653 已删除；
接手时从合并树导入文件没有带上删除，这里补齐。

* fix(ui): 按 review 意见重审设置页文案，优先清晰无歧义

回应 #1704 的 review：设置页文案不再追求字数少，改为直观、清晰、无歧义。
逐条对照 master 原文与 Rust 实现重写，凡是精简后丢失默认值、单位、取值格式、
生效条件、依赖关系或风险提示的条目一律补回，用换行分点、加粗标出风险项。

- 12 个平台面板 + 全局「下载插件」说明：恢复多行结构，补回默认值 / 单位 / 格式 /
  生效条件（如 douyin_true_origin 需画质为原画且协议为 flv、twitch_disable_ads /
  twitch_cookie 仅 streamlink / ffmpeg 生效、youtube_cookie 填的是文件路径、
  日期格式 YYYYMMDD、大小格式 100M/5G、编码多选用 | 分隔）
- 与实现对齐并修正原文：bilibili 弹幕不再限定非 stream-gears、且随录像分段；
  bili_cookie 与 bili_cookie_file 同时填写时以文本为准；youtube_prefer_vcodec /
  acodec 是编码而非封装格式；streamlink 现可直接下载 FLV 直链；
  youtube_enable_download_playback「只想录直播的可以开启」笔误改为「关闭」；
  bili_qn 占位符改为 25000（原画），与实现默认值一致
- 空间配置页头描述改为准确描述三个 Tab 并提示需点「保存」
- 链接颜色改用 var(--semi-color-link)（原 rgb(var(...)) 为无效 CSS）

不涉及任何逻辑改动。

---------

Co-authored-by: Aluneu <19215190873@163.com>
 2026-09-21 13:46:15 +00:00
Monine Melolaris 694d05fac0 Style(webui): 执行前端代码格式化 (#1141) 
仅按照配置文件格式化，未进行任何逻辑更改。
 2025-01-14 06:35:54 +00:00
Monine Melolaris 4273edc6c7 Feat(webui): 深色模式添加自动跟随系统，添加格式化配置文件。 (#1109) 
* Style(webui): Add format config.

Add prettier config to confirm all developer have same code format style.

* Feat(WebUI): 深色模式行为优化

新增：
1、添加了「自动跟随系统主题」模式，并设置为默认行为，该模式将实时监控系统/浏览器主题，并同步变化；
2、添加了自动切换模式按钮。
修改：
1、修改按钮深色模式、浅色模式显示为对应当前模式；
2、修改默认主题为自动跟随系统。

* Update prettier config.

限定解析器的部分格式，避免影响其他语言的格式化功能。

* Disassemble some components.

1.move theme hooks to /lib folder;
2.disassemble ThemeButton component;
3.refactor ThemeButton related code.
 2024-12-09 02:34:38 +00:00
Kataick 6f64ac0bdf 优化webui处理时间的函数 (#753) 
* 优化webui处理时间的函数

* 进一步优化

* 优化

* 使用replaceAll实现替换
 2024-01-15 01:54:53 +00:00
ForgQi 16303af983 Bumping version 2024-01-12 00:54:14 +08:00
ForgQi 6d1695347c webui初版 2023-12-08 23:37:40 +08:00