继续补齐个人中心弹窗底部插槽

扩展 PlatformProfileModalShell 透传共享 footer 插槽能力
将昵称修改弹窗改为使用标准 profile modal footer
补充 modal shell 与昵称弹窗的 footer 接法回归测试
更新 PlatformUiKit 收口计划与共享决策记录
This commit is contained in:
2026-06-11 03:45:06 +08:00
parent fe951a8819
commit 7431b1b9a4
6 changed files with 61 additions and 8 deletions

View File

@@ -0,0 +1,39 @@
/* @vitest-environment jsdom */
import { render, screen } from '@testing-library/react';
import { expect, test, vi } from 'vitest';
import { PlatformActionButton } from '../common/PlatformActionButton';
import { PlatformProfileModalShell } from './PlatformProfileModalShell';
test('PlatformProfileModalShell forwards footer content into shared modal footer chrome', () => {
render(
<PlatformProfileModalShell
title="修改昵称"
onClose={vi.fn()}
panelClassName="platform-remap-surface !max-w-sm rounded-[1.4rem]"
bodyClassName="px-5 py-5"
footerClassName="grid grid-cols-2 gap-3 px-5 pb-5 pt-0 sm:px-5"
footer={
<>
<PlatformActionButton tone="secondary"></PlatformActionButton>
<PlatformActionButton></PlatformActionButton>
</>
}
>
<div></div>
</PlatformProfileModalShell>,
);
const dialog = screen.getByRole('dialog', { name: '修改昵称' });
const body = screen.getByText('昵称输入区').parentElement;
const footerButton = screen.getByRole('button', { name: '保存' });
const footer = footerButton.closest('div');
expect(dialog).toBeTruthy();
expect(body?.className).toContain('px-5');
expect(body?.className).toContain('py-5');
expect(footer?.className).toContain('border-t');
expect(footer?.className).toContain('grid');
expect(footer?.className).toContain('pt-0');
});

View File

@@ -8,6 +8,7 @@ type PlatformProfileModalShellProps = {
description?: ReactNode;
onClose: () => void;
children: ReactNode;
footer?: ReactNode;
closeLabel?: string;
closeVariant?: 'profile' | 'profileCompact';
closeDisabled?: boolean;
@@ -18,6 +19,7 @@ type PlatformProfileModalShellProps = {
panelClassName: string;
bodyClassName?: string;
descriptionClassName?: string;
footerClassName?: string;
};
type PlatformProfileSecondaryModalShellProps = {
@@ -56,6 +58,7 @@ export function PlatformProfileModalShell({
description,
onClose,
children,
footer,
closeLabel,
closeVariant = 'profile',
closeDisabled = false,
@@ -66,6 +69,7 @@ export function PlatformProfileModalShell({
panelClassName,
bodyClassName = 'px-5 py-5',
descriptionClassName = PROFILE_MODAL_DESCRIPTION_CLASS,
footerClassName,
}: PlatformProfileModalShellProps) {
return (
<UnifiedModal
@@ -89,6 +93,8 @@ export function PlatformProfileModalShell({
titleClassName={PROFILE_MODAL_TITLE_CLASS}
descriptionClassName={descriptionClassName}
bodyClassName={bodyClassName}
footer={footer}
footerClassName={footerClassName}
>
{children}
</UnifiedModal>