Skip to content

feat: 添加会话显示模式切换功能#97

Open
Jacky-li-li-li wants to merge 2 commits intoErlichLiu:mainfrom
Jacky-li-li-li:main
Open

feat: 添加会话显示模式切换功能#97
Jacky-li-li-li wants to merge 2 commits intoErlichLiu:mainfrom
Jacky-li-li-li:main

Conversation

@Jacky-li-li-li
Copy link

功能介绍

添加会话显示模式切换功能,支持两种消息布局模式:

1. 左对齐模式(默认)

  • 所有消息(用户和 AI)都左对齐显示

2. 左右分布模式

  • 用户消息右对齐(类似微信/QQ)
  • AI 消息左对齐
  • 用户消息气泡自适应内容宽度

主要改动

  • 类型定义: 添加 +ChatMessageLayout+ 类型(`'left-aligned' | 'left-right'+)
  • 状态管理: 新增 +chatMessageLayoutAtom+ 和 +useChatLayout+ Hook
  • Chat 模式: +ChatMessageItem+、+ChatMessages+ 支持布局切换
  • Agent 模式: +AgentMessages+ 支持布局切换
  • 设置界面: 卡片式布局选择器,带预览图
  • 持久化: 设置自动保存到 +~/.proma/settings.json+

截图

设置界面提供直观的卡片式选择器:

  • 预览图展示两种布局的区别
  • 圆形选择框 + 模式名称 + 描述文字
  • 点击卡片即可切换

测试

  • Chat 模式下切换布局实时生效
  • Agent 模式下切换布局实时生效
  • 设置持久化保存
  • 并排模式下强制左对齐
  • 用户消息自适应宽度

Closes #issue_number

- 支持左对齐和左右分布两种消息布局模式
- Chat 模式和 Agent 模式均支持该功能
- 在通用设置中添加卡片式布局选择器,带预览图
- 用户消息气泡自适应内容宽度
- 设置持久化保存到 ~/.proma/settings.json
- 新增 useChatLayout 和 useAgentLayout Hooks 统一管理布局样式
- 简化 ChatMessageItem 中的复杂条件判断
- 简化 AgentMessages 中的布局逻辑
- 移除 ChatMessages 中未使用的导入和变量
- 提高代码可读性和可维护性
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant