继续收口拼图运行态阻断层
新增拼图下一关阻断层薄壳并接入 PlatformEntryFlowShellImpl 补充 PlatformUiKit 收口文档与共享决策记录
This commit is contained in:
@@ -1,4 +1,3 @@
|
||||
import { Loader2 } from 'lucide-react';
|
||||
import { AnimatePresence, motion } from 'motion/react';
|
||||
import {
|
||||
type Dispatch,
|
||||
@@ -514,6 +513,7 @@ import {
|
||||
type PuzzleOnboardingPhase,
|
||||
PuzzleOnboardingView,
|
||||
} from './PlatformEntryFlowShellImpl/PuzzleOnboardingView';
|
||||
import { PuzzleRuntimeBlockingOverlay } from './PlatformEntryFlowShellImpl/PuzzleRuntimeBlockingOverlay';
|
||||
import {
|
||||
PlatformEntryHomeView,
|
||||
type PlatformHomeTab,
|
||||
@@ -16561,15 +16561,10 @@ export function PlatformEntryFlowShellImpl({
|
||||
/>
|
||||
</Suspense>
|
||||
{isPuzzleNextLevelGenerating ? (
|
||||
<div className="fixed inset-0 z-[120] flex items-center justify-center bg-slate-950/62 px-5 backdrop-blur-sm">
|
||||
<div className="flex max-w-[18rem] flex-col items-center gap-3 rounded-[1.5rem] border border-white/12 bg-slate-950/92 px-6 py-5 text-center text-white shadow-[0_28px_80px_rgba(0,0,0,0.35)]">
|
||||
<Loader2 className="h-6 w-6 animate-spin text-amber-200" />
|
||||
<div className="text-sm font-bold">正在准备下一关</div>
|
||||
<div className="text-xs leading-5 text-white/68">
|
||||
广场暂无可接续作品,正在生成新的候选图。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<PuzzleRuntimeBlockingOverlay
|
||||
title="正在准备下一关"
|
||||
description="广场暂无可接续作品,正在生成新的候选图。"
|
||||
/>
|
||||
) : null}
|
||||
{puzzleOnboardingDraft &&
|
||||
puzzleRun?.currentLevel?.status === 'cleared' ? (
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
/* @vitest-environment jsdom */
|
||||
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { describe, expect, test } from 'vitest';
|
||||
|
||||
import { PuzzleRuntimeBlockingOverlay } from './PuzzleRuntimeBlockingOverlay';
|
||||
|
||||
describe('PuzzleRuntimeBlockingOverlay', () => {
|
||||
test('展示阻断标题与说明,并关闭背景与 Escape 关闭', () => {
|
||||
render(
|
||||
<PuzzleRuntimeBlockingOverlay
|
||||
title="正在准备下一关"
|
||||
description="广场暂无可接续作品,正在生成新的候选图。"
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(screen.getByRole('dialog', { name: '正在准备下一关' })).toBeTruthy();
|
||||
expect(screen.getByText('正在准备下一关')).toBeTruthy();
|
||||
expect(
|
||||
screen.getByText('广场暂无可接续作品,正在生成新的候选图。'),
|
||||
).toBeTruthy();
|
||||
expect(screen.queryByRole('button', { name: '关闭' })).toBeNull();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,39 @@
|
||||
import { Loader2 } from 'lucide-react';
|
||||
|
||||
import { UnifiedModal } from '../../common/UnifiedModal';
|
||||
|
||||
type PuzzleRuntimeBlockingOverlayProps = {
|
||||
title: string;
|
||||
description: string;
|
||||
};
|
||||
|
||||
/**
|
||||
* 拼图运行态局部阻断层壳子。
|
||||
* 仅承接平台入口里拼图运行态的短暂等待态,不把玩法局部视觉强行上推到 common。
|
||||
*/
|
||||
export function PuzzleRuntimeBlockingOverlay({
|
||||
title,
|
||||
description,
|
||||
}: PuzzleRuntimeBlockingOverlayProps) {
|
||||
return (
|
||||
<UnifiedModal
|
||||
open
|
||||
title={title}
|
||||
onClose={() => undefined}
|
||||
portal={false}
|
||||
showHeader={false}
|
||||
showCloseButton={false}
|
||||
closeOnBackdrop={false}
|
||||
closeOnEscape={false}
|
||||
size="sm"
|
||||
zIndexClassName="z-[120]"
|
||||
overlayClassName="!items-center bg-slate-950/62 !px-5 !py-6 text-white backdrop-blur-sm"
|
||||
panelClassName="!max-w-[18rem] !rounded-[1.5rem] border border-white/12 bg-slate-950/92 text-white shadow-[0_28px_80px_rgba(0,0,0,0.35)]"
|
||||
bodyClassName="flex flex-col items-center gap-3 !px-6 !py-5 text-center"
|
||||
>
|
||||
<Loader2 className="h-6 w-6 animate-spin text-amber-200" />
|
||||
<div className="text-sm font-bold">{title}</div>
|
||||
<div className="text-xs leading-5 text-white/68">{description}</div>
|
||||
</UnifiedModal>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user