import { FeatureMenuLayoutPage } from './feature-menu';
import { MemoLayoutPage } from './memo';
import { LayoutPlaygroundView } from '../../views/play/LayoutPlaygroundView';
import type { SavedLayoutRecord } from '../../views/play/layoutStorage';

type RenderSavedLayoutContentParams = {
  layoutId: string;
  layout: SavedLayoutRecord;
  savedLayouts: SavedLayoutRecord[];
  onSavedLayoutsChange?: (layouts: SavedLayoutRecord[]) => void;
};

function normalizeLayoutName(name: string) {
  return name.replace(/\s+/g, '').trim();
}

export function isMemoSavedLayout(layout: Pick<SavedLayoutRecord, 'name'>) {
  return normalizeLayoutName(layout.name).startsWith('메모');
}

export function isFeatureMenuSavedLayout(layout: Pick<SavedLayoutRecord, 'name'>) {
  return normalizeLayoutName(layout.name).startsWith('기능설명관리');
}

export function renderSavedLayoutContent({
  layoutId,
  layout,
  savedLayouts,
  onSavedLayoutsChange,
}: RenderSavedLayoutContentParams) {
  if (isMemoSavedLayout(layout)) {
    return <MemoLayoutPage layoutId={layoutId} />;
  }

  if (isFeatureMenuSavedLayout(layout)) {
    return (
      <FeatureMenuLayoutPage
        layoutId={layoutId}
        savedLayouts={savedLayouts}
        onSavedLayoutsChange={onSavedLayoutsChange ?? (() => undefined)}
      />
    );
  }

  return <LayoutPlaygroundView savedLayoutViewId={layoutId} onSavedLayoutsChange={onSavedLayoutsChange} />;
}
