import React from 'react';
import './PlaceholderPage.css';

const PLACEHOLDER_META = {
  studio: {
    title: '角色 / 世界书工作室',
    subtitle: '用途1 · Character & Worldbook Studio',
    icon: '🎭',
  },
  novel: {
    title: '爽文模式',
    subtitle: '用途3 · Novel Mode',
    icon: '📖',
  },
  room: {
    title: '多角色房间',
    subtitle: '用途4 · Multi-Character Room',
    icon: '🏠',
  },
};

function PlaceholderPage({ page }) {
  const meta = PLACEHOLDER_META[page] || {
    title: 'Coming Soon',
    subtitle: '',
    icon: '🚧',
  };

  return (
    <div className="placeholder-page">
      <div className="placeholder-card">
        <span className="placeholder-icon" aria-hidden="true">{meta.icon}</span>
        <h1 className="placeholder-title">{meta.title}</h1>
        {meta.subtitle && (
          <p className="placeholder-subtitle">{meta.subtitle}</p>
        )}
        <p className="placeholder-message">Coming soon</p>
      </div>
    </div>
  );
}

export default PlaceholderPage;