101 lines
2.7 KiB
TypeScript
101 lines
2.7 KiB
TypeScript
import { Suspense } from "react";
|
|
import { CanvasLogoLoadingView } from "@/components/canvas/canvas-logo-loading";
|
|
import { auth } from "@/app/(auth)/auth";
|
|
import { db } from "@/lib/db";
|
|
import { canvasProject } from "@/lib/db/schema";
|
|
import { getSiteSettings } from "@/lib/db/queries";
|
|
import { and, eq } from "drizzle-orm";
|
|
import type { CanvasInitialProject } from "@/types/canvas";
|
|
import { CanvasPageClientRouter } from "./CanvasPageClientRouter";
|
|
|
|
type CanvasEditorPageProps = {
|
|
params: Promise<{ id: string }>;
|
|
searchParams?: Promise<{
|
|
mode?: string | string[];
|
|
workspaceType?: string | string[];
|
|
}>;
|
|
};
|
|
|
|
function getFirstParamValue(value: string | string[] | undefined) {
|
|
return Array.isArray(value) ? value[0] || "" : value || "";
|
|
}
|
|
|
|
async function getInitialCanvasProject(id: string): Promise<CanvasInitialProject | null> {
|
|
const session = await auth();
|
|
if (!session?.user?.id) return null;
|
|
|
|
const [project] = await db
|
|
.select()
|
|
.from(canvasProject)
|
|
.where(
|
|
and(
|
|
eq(canvasProject.id, id),
|
|
eq(canvasProject.userId, session.user.id)
|
|
)
|
|
)
|
|
.limit(1);
|
|
|
|
if (!project) return null;
|
|
|
|
return {
|
|
...project,
|
|
createdAt: project.createdAt.toISOString(),
|
|
updatedAt: project.updatedAt.toISOString(),
|
|
};
|
|
}
|
|
|
|
export default async function CanvasEditorPage({
|
|
params,
|
|
searchParams,
|
|
}: CanvasEditorPageProps) {
|
|
const { id } = await params;
|
|
const resolvedSearchParams = searchParams ? await searchParams : {};
|
|
const bypassLocalDatabase = process.env.CANVAS_E2E_LOCAL === "true";
|
|
const [siteSettings, initialProject] = bypassLocalDatabase
|
|
? [null, null]
|
|
: await Promise.all([
|
|
getSiteSettings().catch(() => null),
|
|
getInitialCanvasProject(id).catch(() => null),
|
|
]);
|
|
const loadingBrand = {
|
|
siteLogo: siteSettings?.siteLogo,
|
|
siteLogoDark: siteSettings?.siteLogoDark,
|
|
siteName: siteSettings?.siteName,
|
|
};
|
|
|
|
return (
|
|
<Suspense fallback={<CanvasPageLoader {...loadingBrand} />}>
|
|
<CanvasPageClientRouter
|
|
initialId={id}
|
|
initialMode={getFirstParamValue(resolvedSearchParams.mode)}
|
|
initialSiteLogo={loadingBrand.siteLogo}
|
|
initialSiteLogoDark={loadingBrand.siteLogoDark}
|
|
initialSiteName={loadingBrand.siteName}
|
|
initialWorkspaceType={getFirstParamValue(
|
|
resolvedSearchParams.workspaceType
|
|
)}
|
|
initialProject={initialProject}
|
|
/>
|
|
</Suspense>
|
|
);
|
|
}
|
|
|
|
function CanvasPageLoader({
|
|
siteLogo,
|
|
siteLogoDark,
|
|
siteName,
|
|
}: {
|
|
siteLogo?: string | null;
|
|
siteLogoDark?: string | null;
|
|
siteName?: string | null;
|
|
}) {
|
|
return (
|
|
<CanvasLogoLoadingView
|
|
label="正在加载画布..."
|
|
siteLogo={siteLogo}
|
|
siteLogoDark={siteLogoDark}
|
|
siteName={siteName}
|
|
/>
|
|
);
|
|
}
|