复用项目页错误提示组件
项目页读取失败提示改为复用 PlatformStatusMessage 删除项目页局部错误提示视觉样式 补充项目页错误状态测试和 TRACKING 记录
This commit is contained in:
@@ -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`,删除编辑器局部 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 组件复用修正:项目页读取失败提示改为复用 `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`。
|
||||
|
||||
@@ -67,6 +67,18 @@ describe('ProjectGalleryView', () => {
|
||||
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 () => {
|
||||
listEditorProjectsMock.mockResolvedValueOnce(projectItems);
|
||||
renameEditorProjectMock.mockResolvedValueOnce({
|
||||
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
PlatformFloatingMenuItem,
|
||||
} from '../common/PlatformFloatingMenu';
|
||||
import { PlatformIconButton } from '../common/PlatformIconButton';
|
||||
import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
|
||||
import { PlatformTextField } from '../common/PlatformTextField';
|
||||
import { UnifiedModal } from '../common/UnifiedModal';
|
||||
|
||||
@@ -307,9 +308,14 @@ export function ProjectGalleryView({ onOpenProject }: ProjectGalleryViewProps) {
|
||||
</header>
|
||||
|
||||
{errorMessage ? (
|
||||
<div className="project-gallery__error" role="alert">
|
||||
<PlatformStatusMessage
|
||||
tone="error"
|
||||
surface="platform"
|
||||
className="project-gallery__error"
|
||||
role="alert"
|
||||
>
|
||||
{errorMessage}
|
||||
</div>
|
||||
</PlatformStatusMessage>
|
||||
) : null}
|
||||
|
||||
{isLoading ? (
|
||||
|
||||
@@ -3220,13 +3220,6 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
|
||||
.project-gallery__error {
|
||||
flex-shrink: 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 {
|
||||
|
||||
Reference in New Issue
Block a user