feat: update main chat and system chat UI

This commit is contained in:
2026-05-25 17:26:37 +09:00
parent fb5ec649cd
commit f59522ffc4
120 changed files with 43262 additions and 3325 deletions

View File

@@ -1,6 +1,6 @@
import { CloseOutlined } from '@ant-design/icons';
import { CloseOutlined, MinusOutlined } from '@ant-design/icons';
import { Button, Modal } from 'antd';
import type { ReactNode } from 'react';
import type { CSSProperties, ReactNode } from 'react';
import './FullscreenPreviewModal.css';
type FullscreenPreviewModalProps = {
@@ -8,8 +8,17 @@ type FullscreenPreviewModalProps = {
title?: ReactNode;
meta?: ReactNode;
actions?: ReactNode;
hideHeader?: boolean;
className?: string;
contentClassName?: string;
fillContent?: boolean;
modalStyle?: CSSProperties;
shellStyle?: CSSProperties;
zIndex?: number;
getContainer?: HTMLElement | (() => HTMLElement) | false;
maskClosable?: boolean;
minimizeLabel?: string;
onMinimize?: (() => void) | null;
onClose: () => void;
children: ReactNode;
};
@@ -19,8 +28,17 @@ export function FullscreenPreviewModal({
title,
meta,
actions,
hideHeader = false,
className,
contentClassName,
fillContent = false,
modalStyle,
shellStyle,
zIndex = 1400,
getContainer,
maskClosable = true,
minimizeLabel = '최소화',
onMinimize,
onClose,
children,
}: FullscreenPreviewModalProps) {
@@ -30,27 +48,53 @@ export function FullscreenPreviewModal({
footer={null}
title={null}
width="100vw"
style={modalStyle}
zIndex={zIndex}
getContainer={getContainer}
maskClosable={maskClosable}
onCancel={onClose}
className={['fullscreen-preview-modal', className ?? ''].filter(Boolean).join(' ')}
>
<div className="fullscreen-preview-modal__shell">
<div className="fullscreen-preview-modal__header">
<div className="fullscreen-preview-modal__title-group">
{title ? <div className="fullscreen-preview-modal__title">{title}</div> : null}
{meta ? <div className="fullscreen-preview-modal__meta">{meta}</div> : null}
</div>
<div className="fullscreen-preview-modal__actions">
{actions}
<Button
type="text"
className="fullscreen-preview-modal__icon-button"
aria-label="닫기"
icon={<CloseOutlined />}
onClick={onClose}
/>
<div className="fullscreen-preview-modal__shell" style={shellStyle}>
{hideHeader ? null : (
<div className="fullscreen-preview-modal__header">
<div className="fullscreen-preview-modal__title-group">
{title ? <div className="fullscreen-preview-modal__title">{title}</div> : null}
{meta ? <div className="fullscreen-preview-modal__meta">{meta}</div> : null}
</div>
<div className="fullscreen-preview-modal__actions">
{actions}
{onMinimize ? (
<Button
type="text"
className="fullscreen-preview-modal__icon-button fullscreen-preview-modal__minimize-button"
aria-label={minimizeLabel}
onClick={onMinimize}
>
<MinusOutlined aria-hidden="true" />
</Button>
) : null}
<Button
type="text"
className="fullscreen-preview-modal__icon-button fullscreen-preview-modal__close-button"
aria-label="닫기"
icon={<CloseOutlined />}
onClick={onClose}
/>
</div>
</div>
)}
<div
className={[
'fullscreen-preview-modal__content',
fillContent ? 'fullscreen-preview-modal__content--fill' : '',
contentClassName ?? '',
]
.filter(Boolean)
.join(' ')}
>
{children}
</div>
<div className={['fullscreen-preview-modal__content', contentClassName ?? ''].filter(Boolean).join(' ')}>{children}</div>
</div>
</Modal>
);