65 lines
1.3 KiB
TypeScript
65 lines
1.3 KiB
TypeScript
|
import { ReactElement } from "react";
|
||
|
|
import hljs from "highlight.js";
|
||
|
|
import { ActionMenu } from "@/app/components/action-menu";
|
||
|
|
|
||
|
|
// Highlight.js theme
|
||
|
|
import "highlight.js/styles/github-dark-dimmed.css";
|
||
|
|
import { cn } from "@/app/common/utils";
|
||
|
|
import { jetbrainsMono } from "@/app/common/font/font";
|
||
|
|
|
||
|
|
type PasteProps = {
|
||
|
|
params: {
|
||
|
|
id: string;
|
||
|
|
};
|
||
|
|
};
|
||
|
|
|
||
|
|
type Paste = {
|
||
|
|
/**
|
||
|
|
* The paste content.
|
||
|
|
*/
|
||
|
|
content?: string;
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Whether an error occurred.
|
||
|
|
*/
|
||
|
|
error?: boolean;
|
||
|
|
};
|
||
|
|
|
||
|
|
async function getData(id: string): Promise<Paste> {
|
||
|
|
const response = await fetch(`${process.env.NEXT_PUBLIC_API_ENDPOINT}/${id}`);
|
||
|
|
const json = await response.json();
|
||
|
|
|
||
|
|
if (json.code && json.message) {
|
||
|
|
return {
|
||
|
|
error: true,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
return json as Paste;
|
||
|
|
}
|
||
|
|
|
||
|
|
export default async function Paste({
|
||
|
|
params: { id },
|
||
|
|
}: PasteProps): Promise<ReactElement> {
|
||
|
|
const { content, error } = await getData(id);
|
||
|
|
|
||
|
|
if (content == undefined || error) {
|
||
|
|
return <div>Not found</div>;
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="relative">
|
||
|
|
<ActionMenu />
|
||
|
|
|
||
|
|
<pre>
|
||
|
|
<code
|
||
|
|
className={cn("hljs !bg-transparent", jetbrainsMono.className)}
|
||
|
|
dangerouslySetInnerHTML={{
|
||
|
|
__html: hljs.highlightAuto(content).value,
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|