51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
/**
|
|
* 전략 평가 — 전략편집기 전체 화면 팝업
|
|
*/
|
|
import React, { Suspense, lazy, useEffect } from 'react';
|
|
import type { Theme } from '../../types';
|
|
|
|
const StrategyEditorPage = lazy(() => import('../StrategyEditorPage'));
|
|
|
|
interface Props {
|
|
theme: Theme;
|
|
initialStrategyId?: number | null;
|
|
onClose: () => void;
|
|
onStrategiesChanged?: () => void;
|
|
}
|
|
|
|
export default function StrategyEditorModal({
|
|
theme,
|
|
initialStrategyId = null,
|
|
onClose,
|
|
onStrategiesChanged,
|
|
}: Props) {
|
|
useEffect(() => {
|
|
const prev = document.body.style.overflow;
|
|
document.body.style.overflow = 'hidden';
|
|
const onKey = (e: KeyboardEvent) => {
|
|
if (e.key === 'Escape') onClose();
|
|
};
|
|
window.addEventListener('keydown', onKey);
|
|
return () => {
|
|
document.body.style.overflow = prev;
|
|
window.removeEventListener('keydown', onKey);
|
|
};
|
|
}, [onClose]);
|
|
|
|
return (
|
|
<div className="seval-editor-modal-overlay" role="dialog" aria-modal aria-label="전략 편집">
|
|
<div className="seval-editor-modal-shell">
|
|
<Suspense fallback={<div className="seval-editor-modal-loading">전략 편집기 불러오는 중…</div>}>
|
|
<StrategyEditorPage
|
|
theme={theme}
|
|
variant="modal"
|
|
initialStrategyId={initialStrategyId}
|
|
onClose={onClose}
|
|
onStrategiesChanged={onStrategiesChanged}
|
|
/>
|
|
</Suspense>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|