cleanup and add a raw page
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m4s

This commit is contained in:
Lee 2024-04-24 17:46:47 +01:00
parent a733af62db
commit f185270a5b
5 changed files with 130 additions and 59 deletions

@ -1,76 +1,27 @@
import React, { cache, ReactElement } from "react";
import React, { ReactElement } from "react";
import { ActionMenu } from "@/app/components/action-menu";
import { Metadata } from "next";
import moment from "moment";
import { notFound } from "next/navigation";
import { CodeBlock } from "@/app/components/code-block";
import { detectLanguage } from "@/app/common/lang-detection/detection";
import { Button } from "@/app/components/ui/button";
import Link from "next/link";
type PasteProps = {
params: {
id: string;
};
};
type Paste = {
/**
* The paste content.
*/
content: string;
/**
* The date the paste was created.
*/
created: string;
/**
* The detected language of the paste.
*/
language: string;
};
const getPaste = cache(async (id: string) => {
const response: Response = await fetch(
`${process.env.NEXT_PUBLIC_API_ENDPOINT}/${id}`,
{
next: {
revalidate: 300, // Keep this response cached for 5 minutes
},
},
);
const json = await response.json();
if (json.code && json.message) {
return undefined;
}
return {
content: json.content,
created: json.created,
language: await detectLanguage(json.content),
};
}) as (id: string) => Promise<Paste | undefined>;
import {
generatePasteMetadata,
getPaste,
type Paste,
} from "@/app/common/pastes";
import { PastePageProps } from "@/app/types/paste-page";
export async function generateMetadata({
params: { id },
}: PasteProps): Promise<Metadata> {
const data: Paste | undefined = await getPaste(id);
if (data == undefined) {
return {
description: "Not found",
};
}
return {
title: `Paste - ${id}.${data.language}`,
description: `Click to view the paste.`,
};
}: PastePageProps): Promise<Metadata> {
return generatePasteMetadata(id);
}
export default async function Paste({
params: { id },
}: PasteProps): Promise<ReactElement> {
}: PastePageProps): Promise<ReactElement> {
const data: Paste | undefined = await getPaste(id);
if (data == undefined) {
@ -87,6 +38,9 @@ export default async function Paste({
<Link href={"/"}>
<Button>New</Button>
</Link>
<Link href={`/raw/${id}`}>
<Button>Raw</Button>
</Link>
</ActionMenu>
<div className="absolute right-0 bottom-0 text-right p-1.5">

@ -17,6 +17,10 @@ export default function Home(): ReactElement {
async function createPaste() {
// Ignore empty pastes, we don't want to save them
if (!value || value.length == 0) {
toast({
title: "Paste",
description: "Paste is empty",
});
return;
}

@ -0,0 +1,45 @@
import React, { ReactElement } from "react";
import { ActionMenu } from "@/app/components/action-menu";
import { Metadata } from "next";
import { notFound } from "next/navigation";
import { Button } from "@/app/components/ui/button";
import Link from "next/link";
import {
generatePasteMetadata,
getPaste,
type Paste,
} from "@/app/common/pastes";
import { PastePageProps } from "@/app/types/paste-page";
export async function generateMetadata({
params: { id },
}: PastePageProps): Promise<Metadata> {
return generatePasteMetadata(id);
}
export default async function Paste({
params: { id },
}: PastePageProps): Promise<ReactElement> {
const data: Paste | undefined = await getPaste(id);
if (data == undefined) {
return notFound();
}
return (
<div className="relative h-full">
<ActionMenu>
<Link href={"/"}>
<Button>New</Button>
</Link>
<Link href={`/${id}`}>
<Button>Formated</Button>
</Link>
</ActionMenu>
<div className="p-1 hljs !bg-transparent text-sm">
<code>{data.content}</code>
</div>
</div>
);
}

63
src/app/common/pastes.ts Normal file

@ -0,0 +1,63 @@
import { cache } from "react";
import { detectLanguage } from "@/app/common/lang-detection/detection";
import { Metadata } from "next";
export type Paste = {
/**
* The paste content.
*/
content: string;
/**
* The date the paste was created.
*/
created: string;
/**
* The detected language of the paste.
*/
language: string;
};
/**
* Fetches a paste from the API.
*/
export const getPaste = cache(async (id: string) => {
const response: Response = await fetch(
`${process.env.NEXT_PUBLIC_API_ENDPOINT}/${id}`,
{
next: {
revalidate: 300, // Keep this response cached for 5 minutes
},
},
);
const json = await response.json();
if (json.code && json.message) {
return undefined;
}
return {
content: json.content,
created: json.created,
language: await detectLanguage(json.content),
};
}) as (id: string) => Promise<Paste | undefined>;
/**
* Generates metadata for a paste.
*
* @param id The ID of the paste.
*/
export async function generatePasteMetadata(id: string): Promise<Metadata> {
const data: Paste | undefined = await getPaste(id);
if (data == undefined) {
return {
description: "Not found",
};
}
return {
title: `Paste - ${id}.${data.language}`,
description: `Click to view the paste.`,
};
}

@ -0,0 +1,5 @@
export type PastePageProps = {
params: {
id: string;
};
};