"use client";

import { Suspense } from "react";
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { apiMe } from "@/lib/api";
import SnippetEditor from "@/components/SnippetEditor";

function NewSnippetInner() {
  const router = useRouter();
  const [ready, setReady] = useState(false);

  useEffect(() => {
    apiMe()
      .then((res) => {
        if (!res.user) {
          router.push("/login?redirect=/snippets/new");
          return;
        }
        setReady(true);
      })
      .catch(() => {
        router.push("/login?redirect=/snippets/new");
      });
  }, [router]);

  if (!ready) {
    return (
      <div className="j13-compose-stage is-studio px-8 py-16 text-center">
        <p className="meta">正在准备编辑器…</p>
      </div>
    );
  }

  return <SnippetEditor mode="create" />;
}

export default function NewSnippetPage() {
  return (
    <div className="j13-compose-page">
      <Suspense
        fallback={
          <div className="j13-compose-stage is-studio px-8 py-16 text-center">
            <p className="meta">正在准备编辑器…</p>
          </div>
        }
      >
        <NewSnippetInner />
      </Suspense>
    </div>
  );
}