复用项目页错误提示组件

项目页读取失败提示改为复用 PlatformStatusMessage

删除项目页局部错误提示视觉样式

补充项目页错误状态测试和 TRACKING 记录
This commit is contained in:
2026-06-14 02:26:59 +08:00
parent 83ebda4dc2
commit 53b12b4cda
4 changed files with 21 additions and 9 deletions

View File

@@ -80,3 +80,4 @@
- 2026-06-14 组件复用修正:编辑器生成图元数据弹窗改为复用 `UnifiedModal`不再手写元数据弹窗遮罩、dialog role 和关闭按钮;验证命令:`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/UnifiedModal.test.tsx``npm run typecheck``npm run check:encoding``git diff --check` - 2026-06-14 组件复用修正:编辑器生成图元数据弹窗改为复用 `UnifiedModal`不再手写元数据弹窗遮罩、dialog role 和关闭按钮;验证命令:`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/UnifiedModal.test.tsx``npm run typecheck``npm run check:encoding``git diff --check`
- 2026-06-14 组件复用修正:编辑器“修改图片”弹窗改为复用 `UnifiedModal`,删除编辑器局部 modal backdrop、dialog role、header 和关闭按钮样式;验证命令:`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/UnifiedModal.test.tsx``npm run typecheck``npm run check:encoding``git diff --check` - 2026-06-14 组件复用修正:编辑器“修改图片”弹窗改为复用 `UnifiedModal`,删除编辑器局部 modal backdrop、dialog role、header 和关闭按钮样式;验证命令:`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/UnifiedModal.test.tsx``npm run typecheck``npm run check:encoding``git diff --check`
- 2026-06-14 组件复用修正:新增 `PlatformBatchActionToolbar`,项目页选择模式底部批量操作栏改为复用平台批量工具栏原语;验证命令:`npm run test -- src/components/common/PlatformBatchActionToolbar.test.tsx src/components/project/ProjectGalleryView.test.tsx``npm run typecheck``npm run check:encoding``git diff --check` - 2026-06-14 组件复用修正:新增 `PlatformBatchActionToolbar`,项目页选择模式底部批量操作栏改为复用平台批量工具栏原语;验证命令:`npm run test -- src/components/common/PlatformBatchActionToolbar.test.tsx src/components/project/ProjectGalleryView.test.tsx``npm run typecheck``npm run check:encoding``git diff --check`
- 2026-06-14 组件复用修正:项目页读取失败提示改为复用 `PlatformStatusMessage`,页面局部错误样式只保留布局间距;验证命令:`npm run test -- src/components/project/ProjectGalleryView.test.tsx src/components/common/PlatformStatusMessage.test.tsx``npm run typecheck``npm run check:encoding``git diff --check`

View File

@@ -67,6 +67,18 @@ describe('ProjectGalleryView', () => {
expect(onOpenProject).toHaveBeenCalledWith('editor-project-1'); expect(onOpenProject).toHaveBeenCalledWith('editor-project-1');
}); });
it('renders project loading errors through the shared status message', async () => {
listEditorProjectsMock.mockRejectedValueOnce(new Error('读取项目失败'));
render(<ProjectGalleryView onOpenProject={vi.fn()} />);
const alert = await screen.findByRole('alert');
expect(alert.textContent).toContain('读取项目失败');
expect(alert.className).toContain('platform-status-message');
expect(alert.className).toContain('project-gallery__error');
});
it('renames and deletes a project from the hover menu', async () => { it('renames and deletes a project from the hover menu', async () => {
listEditorProjectsMock.mockResolvedValueOnce(projectItems); listEditorProjectsMock.mockResolvedValueOnce(projectItems);
renameEditorProjectMock.mockResolvedValueOnce({ renameEditorProjectMock.mockResolvedValueOnce({

View File

@@ -24,6 +24,7 @@ import {
PlatformFloatingMenuItem, PlatformFloatingMenuItem,
} from '../common/PlatformFloatingMenu'; } from '../common/PlatformFloatingMenu';
import { PlatformIconButton } from '../common/PlatformIconButton'; import { PlatformIconButton } from '../common/PlatformIconButton';
import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
import { PlatformTextField } from '../common/PlatformTextField'; import { PlatformTextField } from '../common/PlatformTextField';
import { UnifiedModal } from '../common/UnifiedModal'; import { UnifiedModal } from '../common/UnifiedModal';
@@ -307,9 +308,14 @@ export function ProjectGalleryView({ onOpenProject }: ProjectGalleryViewProps) {
</header> </header>
{errorMessage ? ( {errorMessage ? (
<div className="project-gallery__error" role="alert"> <PlatformStatusMessage
tone="error"
surface="platform"
className="project-gallery__error"
role="alert"
>
{errorMessage} {errorMessage}
</div> </PlatformStatusMessage>
) : null} ) : null}
{isLoading ? ( {isLoading ? (

View File

@@ -3220,13 +3220,6 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
.project-gallery__error { .project-gallery__error {
flex-shrink: 0; flex-shrink: 0;
margin: 1rem 1.5rem 0; margin: 1rem 1.5rem 0;
border: 1px solid #fecdd3;
border-radius: 0.5rem;
background: #fff1f2;
padding: 0.75rem 0.9rem;
color: #be123c;
font-size: 0.85rem;
font-weight: 760;
} }
.image-canvas-editor { .image-canvas-editor {