import Link from "next/link";
import { Activity, ArrowLeft, RefreshCw } from "lucide-react";

export function AppShell({
  children,
  onRefresh,
  showBack,
  toolbarLeading
}: {
  children: React.ReactNode;
  onRefresh?: () => void;
  showBack?: boolean;
  toolbarLeading?: React.ReactNode;
}) {
  return (
    <main className="app-shell">
      <div className="workspace">
        <header className="topbar">
          <div className="topbar-left">
            {showBack ? (
              <Link className="back-link" href="/runs">
                <ArrowLeft size={15} />
                返回 Dashboard
              </Link>
            ) : null}
          </div>
          <Link className="brand" href="/runs">
            <strong>ContentFind 可视化工作台</strong>
          </Link>
          <div className="toolbar">
            {toolbarLeading}
            <Link className="back-link" href="/config">
              配置
            </Link>
            <span className="badge">
              <Activity size={13} />
              Douyin V1
            </span>
            {onRefresh ? (
              <button className="icon-button" onClick={onRefresh} type="button" title="刷新">
                <RefreshCw size={16} />
              </button>
            ) : null}
          </div>
        </header>
        {children}
      </div>
    </main>
  );
}