fix: 修复空会话返回 null 导致前端崩溃的问题 #194

Merged

huanghaosheng merged 3 commits from develop into v2

2026-06-22 12:40:38 +08:00

Author	SHA1	Message	Date
huanghaosheng	f2a883bda8	Merge pull request 'fix: 修复空会话返回 null 导致前端崩溃的问题' (#193 ) from fix/frontend into develop Reviewed-on: http://8.161.227.145:3000/XEngineers/CamTalk/pulls/193	2026-06-22 12:40:18 +08:00
hhs	4cc0713459	fix: 修复空会话返回 null 导致前端崩溃的问题 ## 问题描述当用户创建新会话但未发送任何消息就切换到其他会话时，前端控制台报错： "TypeError: Cannot read properties of null (reading 'map')" 根本原因：Go 后端未初始化的切片序列化为 JSON 时会变成 `null` 而非 `[]`，前端尝试对 `null` 调用 `.map()` 导致崩溃。 ## 修复方案采用多层防御策略，同时修复后端和前端： ### 后端修复（确保 API 契约正确） 1. message_pg.go:93 - 将 `var messages []StoredMessage` 改为 `messages := make([]StoredMessage, 0)`，确保空结果序列化为 `[]` 2. conversation.go - 在两个响应路径（PG 查询 + 内存回退）添加防御性 nil 检查 ### 前端防御（多层保护） 1. useSessionList.ts - 在 loadMessages 和 loadSessions 中添加 null 合并操作 `(res.data.messages \|\| [])` 确保即使后端退化也不会崩溃 ## 影响范围 - 所有空会话（新建后未发送消息的对话）现在可以正常切换 - API 响应符合 JSON 最佳实践（数组字段永远是 `[]` 而非 `null`）	2026-06-22 12:39:37 +08:00
hhs	2180751a9b	fix: 修复前端侧边栏双重展开动画问题移除条件渲染和 CSS animation 的冲突，改用纯 CSS transition 控制显示/隐藏。问题根源： - 组件使用 `if (!open) return null;` 条件渲染，导致挂载时立即出现 - CSS 同时使用 `animation: slideInLeft`，触发从 -100% 的二次滑入 - 两个独立显示机制叠加，造成双重动画闪烁修复方案： - SessionSidebar: 移除条件渲染，始终保持 DOM 存在，通过动态 className 控制状态 - App.css: 移除 `animation` 和 `@keyframes`，改用 `transition: transform` - 新增 `.sidebar--collapsed` / `.sidebar--open` 类控制 `translateX` - 新增 `.sidebar-backdrop--visible` 类控制背景遮罩淡入淡出 - 添加 `pointer-events: none` 确保隐藏状态不响应交互影响范围： - frontend/src/components/SessionSidebar/index.tsx - frontend/src/App.css	2026-06-22 12:05:54 +08:00

Author

SHA1

Message

Date

huanghaosheng

f2a883bda8

Merge pull request 'fix: 修复空会话返回 null 导致前端崩溃的问题' (#193 ) from fix/frontend into develop

Reviewed-on: http://8.161.227.145:3000/XEngineers/CamTalk/pulls/193

2026-06-22 12:40:18 +08:00

hhs

4cc0713459

fix: 修复空会话返回 null 导致前端崩溃的问题

## 问题描述
当用户创建新会话但未发送任何消息就切换到其他会话时，前端控制台报错：
"TypeError: Cannot read properties of null (reading 'map')"

根本原因：Go 后端未初始化的切片序列化为 JSON 时会变成 `null` 而非 `[]`，
前端尝试对 `null` 调用 `.map()` 导致崩溃。

## 修复方案
采用多层防御策略，同时修复后端和前端：

### 后端修复（确保 API 契约正确）
1. message_pg.go:93 - 将 `var messages []StoredMessage` 改为
   `messages := make([]StoredMessage, 0)`，确保空结果序列化为 `[]`
2. conversation.go - 在两个响应路径（PG 查询 + 内存回退）添加防御性 nil 检查

### 前端防御（多层保护）
1. useSessionList.ts - 在 loadMessages 和 loadSessions 中添加 null 合并操作
   `(res.data.messages || [])` 确保即使后端退化也不会崩溃

## 影响范围
- 所有空会话（新建后未发送消息的对话）现在可以正常切换
- API 响应符合 JSON 最佳实践（数组字段永远是 `[]` 而非 `null`）

2026-06-22 12:39:37 +08:00

hhs

2180751a9b

fix: 修复前端侧边栏双重展开动画问题

移除条件渲染和 CSS animation 的冲突，改用纯 CSS transition 控制显示/隐藏。

**问题根源：**
- 组件使用 `if (!open) return null;` 条件渲染，导致挂载时立即出现
- CSS 同时使用 `animation: slideInLeft`，触发从 -100% 的二次滑入
- 两个独立显示机制叠加，造成双重动画闪烁

**修复方案：**
- SessionSidebar: 移除条件渲染，始终保持 DOM 存在，通过动态 className 控制状态
- App.css: 移除 `animation` 和 `@keyframes`，改用 `transition: transform`
- 新增 `.sidebar--collapsed` / `.sidebar--open` 类控制 `translateX`
- 新增 `.sidebar-backdrop--visible` 类控制背景遮罩淡入淡出
- 添加 `pointer-events: none` 确保隐藏状态不响应交互

影响范围：
- frontend/src/components/SessionSidebar/index.tsx
- frontend/src/App.css

2026-06-22 12:05:54 +08:00

fix: 修复空会话返回 null 导致前端崩溃的问题 #194

3 Commits