Files
comfyui-deploy/web/src/components/SharePageSettings.tsx
T
2024-01-21 11:40:48 +08:00

92 lines
2.5 KiB
TypeScript

"use client";
import { ButtonAction } from "@/components/ButtonActionLoader";
import { UpdateModal } from "@/components/InsertModal";
import { LoadingPageWrapper } from "@/components/LoadingWrapper";
import { Button } from "@/components/ui/button";
import { publicShareDeployment } from "@/db/schema";
import {
findUserShareDeployment,
removePublicShareDeployment,
updateSharePageInfo,
} from "@/server/curdDeploments";
import { ExternalLink } from "lucide-react";
import Link from "next/link";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { useServerActionData } from "./useServerActionData";
export function SharePageSettings({
deployment_id,
}: {
deployment_id: string;
}) {
const {
data: deployment,
pending,
started,
} = useServerActionData(findUserShareDeployment, deployment_id);
const [_open, _setOpen] = useState(false);
const router = useRouter();
if (pending) return <LoadingPageWrapper className="h-full" tag="settings" />;
if (!deployment && started && !pending)
return (
<div className="h-full w-full flex items-center justify-center">
<p>Settings page not found.</p>
</div>
);
if (!deployment) return null;
return (
<>
<UpdateModal
dialogClassName="sm:max-w-[600px]"
open={true}
setOpen={() => {
router.back();
}}
extraButtons={
<>
<Button
asChild
className="gap-2 truncate"
variant="outline"
type="button"
>
<ButtonAction
routerAction="back"
action={removePublicShareDeployment.bind(null, deployment.id)}
>
Remove
</ButtonAction>
</Button>
<Button asChild className="gap-2 truncate" type="button">
<Link href={`/share/${deployment.share_slug ?? deployment.id}`} target="_blank">
View Share Page <ExternalLink size={14} />
</Link>
</Button>
</>
}
data={{
id: deployment.id,
description: deployment.description,
showcase_media: deployment.showcase_media ?? [],
}}
title="Share Page"
description="Edit share page details."
serverAction={updateSharePageInfo}
formSchema={publicShareDeployment}
fieldConfig={{
description: {
fieldType: "textarea",
},
}}
/>
</>
);
}