64 lines
1.8 KiB
TypeScript
64 lines
1.8 KiB
TypeScript
|
"use client";
|
||
|
|
import { useMemo } from "react";
|
||
|
|
import dynamic from "next/dynamic";
|
||
|
|
import { Button } from "@/components/ui/button";
|
||
|
|
import { RiCloseFill } from "react-icons/ri";
|
||
|
|
import { Avatar, AvatarImage, AvatarFallback } from "@radix-ui/react-avatar";
|
||
|
|
import { useRouter } from "next/navigation";
|
||
|
|
const Viewer = dynamic(() => import("@/components/LongForm/Viewer"), {
|
||
|
|
ssr: false,
|
||
|
|
});
|
||
|
|
|
||
|
|
export default function ArticlePage({
|
||
|
|
params: { eventId },
|
||
|
|
}: {
|
||
|
|
params: {
|
||
|
|
eventId: string;
|
||
|
|
};
|
||
|
|
}) {
|
||
|
|
const router = useRouter();
|
||
|
|
const markdown = `This is a test
|
||
|
|
### test text
|
||
|
|
|
||
|
|
- First
|
||
|
|
- Second
|
||
|
|
1 nest`;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="relative">
|
||
|
|
<div className="absolute inset-x-0 top-0 flex items-center justify-between border-b pb-4 pt-4">
|
||
|
|
<div className="center gap-x-3">
|
||
|
|
<Avatar className="center h-8 w-8 overflow-hidden rounded-sm bg-muted">
|
||
|
|
<AvatarImage
|
||
|
|
src={
|
||
|
|
"https://images.unsplash.com/photo-1566492031773-4f4e44671857?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=4&w=256&h=256&q=60"
|
||
|
|
}
|
||
|
|
alt="user"
|
||
|
|
/>
|
||
|
|
<AvatarFallback className="text-xs">SC</AvatarFallback>
|
||
|
|
</Avatar>
|
||
|
|
<span className="text-xs uppercase text-muted-foreground">
|
||
|
|
Derek Seivers
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
<Button
|
||
|
|
onClick={() => {
|
||
|
|
if (sessionStorage.getItem("RichHistory")) {
|
||
|
|
void router.back();
|
||
|
|
} else {
|
||
|
|
void router.push("/");
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
size="icon"
|
||
|
|
variant={"outline"}
|
||
|
|
className=""
|
||
|
|
>
|
||
|
|
<RiCloseFill className="h-5 w-5" />
|
||
|
|
</Button>
|
||
|
|
</div>
|
||
|
|
<div className="h-[70px] w-full"></div>
|
||
|
|
<Viewer initialMarkdown={markdown} />
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|