maybe fix the first time upload error?
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m1s
Publish Docker Image / docker (ubuntu-latest) (push) Successful in 51s

This commit is contained in:
Lee 2024-04-23 03:49:14 +01:00
parent d5029706ad
commit 78bb457f22
4 changed files with 34 additions and 39 deletions

@ -1,13 +1,14 @@
import { ReactElement } from "react"; import { ReactElement } from "react";
import hljs from "highlight.js"; import hljs from "highlight.js";
import { ActionMenu } from "@/app/components/action-menu"; 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 { cn } from "@/app/common/utils";
import { jetbrainsMono } from "@/app/common/font/font"; import { jetbrainsMono } from "@/app/common/font/font";
import { Metadata } from "next"; import { Metadata } from "next";
import moment from "moment"; import moment from "moment";
import { notFound } from "next/navigation";
// Highlight.js theme
import "highlight.js/styles/github-dark-dimmed.css";
type PasteProps = { type PasteProps = {
params: { params: {
@ -19,55 +20,46 @@ type Paste = {
/** /**
* The paste content. * The paste content.
*/ */
content?: string; content: string;
/** /**
* The date the paste was created. * The date the paste was created.
*/ */
created?: number; created: number;
/**
* Whether an error occurred.
*/
error?: boolean;
}; };
export async function generateMetadata({ export async function generateMetadata({
params: { id }, params: { id },
}: PasteProps): Promise<Metadata> { }: PasteProps): Promise<Metadata> {
const { content, created, error } = await getData(id); const data = await getData(id);
if (data == undefined) {
if (content == undefined || error) {
return { return {
description: "Not found", description: "Not found",
}; };
} }
return { return {
description: `Created: ${moment(created)}\n\nClick to view the paste.`, description: `Created: ${moment(data.created)}\n\nClick to view the paste.`,
}; };
} }
async function getData(id: string): Promise<Paste> { async function getData(id: string): Promise<Paste | undefined> {
const response = await fetch(`${process.env.NEXT_PUBLIC_API_ENDPOINT}/${id}`); const response = await fetch(`${process.env.NEXT_PUBLIC_API_ENDPOINT}/${id}`);
const json = await response.json(); const json = await response.json();
if (json.code && json.message) { if (json.code && json.message) {
return { return undefined;
error: true,
};
} }
return json as Paste; return json as Paste;
} }
export default async function Paste({ export default async function Paste({
params: { id }, params: { id },
}: PasteProps): Promise<ReactElement> { }: PasteProps): Promise<ReactElement> {
const { content, error } = await getData(id); const data = await getData(id);
if (content == undefined || error) { if (data == undefined) {
return <div>Not found</div>; return notFound();
} }
return ( return (
@ -76,9 +68,12 @@ export default async function Paste({
<pre> <pre>
<code <code
className={cn("hljs !bg-transparent", jetbrainsMono.className)} className={cn(
"hljs !bg-transparent text-sm",
jetbrainsMono.className,
)}
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: hljs.highlightAuto(content).value, __html: hljs.highlightAuto(data.content).value,
}} }}
/> />
</pre> </pre>

@ -1,6 +1,6 @@
import { type ClassValue, clsx } from "clsx" import { type ClassValue, clsx } from "clsx";
import { twMerge } from "tailwind-merge" import { twMerge } from "tailwind-merge";
export function cn(...inputs: ClassValue[]) { export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs)) return twMerge(clsx(inputs));
} }

@ -1,8 +1,8 @@
"use client" "use client";
import * as React from "react" import * as React from "react";
import { ThemeProvider as NextThemesProvider } from "next-themes" import { ThemeProvider as NextThemesProvider } from "next-themes";
import { type ThemeProviderProps } from "next-themes/dist/types" import { type ThemeProviderProps } from "next-themes/dist/types";
export function ThemeProvider({ children, ...props }: ThemeProviderProps) { export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
return <NextThemesProvider {...props}>{children}</NextThemesProvider> return <NextThemesProvider {...props}>{children}</NextThemesProvider>

@ -1,13 +1,13 @@
import type { Config } from "tailwindcss" import type { Config } from "tailwindcss";
const config = { const config = {
darkMode: ["class"], darkMode: ["class"],
content: [ content: [
'./pages/**/*.{ts,tsx}', "./pages/**/*.{ts,tsx}",
'./components/**/*.{ts,tsx}', "./components/**/*.{ts,tsx}",
'./app/**/*.{ts,tsx}', "./app/**/*.{ts,tsx}",
'./src/**/*.{ts,tsx}', "./src/**/*.{ts,tsx}",
], ],
prefix: "", prefix: "",
theme: { theme: {
container: { container: {
@ -75,6 +75,6 @@ const config = {
}, },
}, },
plugins: [require("tailwindcss-animate")], plugins: [require("tailwindcss-animate")],
} satisfies Config } satisfies Config;
export default config export default config;