45 lines
1.1 KiB
TypeScript

"use client";
import dynamic from "next/dynamic";
import Loading from "@/components/editor/loading";
import { Sandbox, User } from "@/lib/types";
import { useEffect, useState } from "react";
import { startServer, stopServer } from "@/lib/utils";
import { toast } from "sonner";
const CodeEditor = dynamic(() => import("@/components/editor/editor"), {
ssr: false,
loading: () => <Loading />,
});
export default function Editor({
userData,
sandboxData,
}: {
userData: User;
sandboxData: Sandbox;
}) {
const [isServerRunning, setIsServerRunning] = useState(false);
const [didFail, setDidFail] = useState(false);
useEffect(() => {
startServer(sandboxData.id, userData.id, (success: boolean) => {
if (!success) {
toast.error("Failed to start server.");
setDidFail(true);
} else {
setIsServerRunning(true);
}
});
return () => {
stopServer(sandboxData.id, userData.id);
};
}, []);
if (!isServerRunning)
return <Loading didFail={didFail} text="Creating your sandbox resources" />;
return <CodeEditor userData={userData} sandboxData={sandboxData} />;
}