From 78bb457f22f7261df7a0c85886ea4d7c8ca97ee3 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Tue, 23 Apr 2024 03:49:14 +0100
Subject: [PATCH] maybe fix the first time upload error?

---
 src/app/(pages)/[id]/page.tsx         | 43 ++++++++++++---------------
 src/app/common/utils.ts               |  6 ++--
 src/app/components/theme-provider.tsx |  8 ++---
 tailwind.config.ts                    | 16 +++++-----
 4 files changed, 34 insertions(+), 39 deletions(-)

diff --git a/src/app/(pages)/[id]/page.tsx b/src/app/(pages)/[id]/page.tsx
index 5330d46..3d434ad 100644
--- a/src/app/(pages)/[id]/page.tsx
+++ b/src/app/(pages)/[id]/page.tsx
@@ -1,13 +1,14 @@
 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";
 import { Metadata } from "next";
 import moment from "moment";
+import { notFound } from "next/navigation";
+
+// Highlight.js theme
+import "highlight.js/styles/github-dark-dimmed.css";
 
 type PasteProps = {
   params: {
@@ -19,55 +20,46 @@ type Paste = {
   /**
    * The paste content.
    */
-  content?: string;
+  content: string;
 
   /**
    * The date the paste was created.
    */
-  created?: number;
-
-  /**
-   * Whether an error occurred.
-   */
-  error?: boolean;
+  created: number;
 };
 
 export async function generateMetadata({
   params: { id },
 }: PasteProps): Promise<Metadata> {
-  const { content, created, error } = await getData(id);
-
-  if (content == undefined || error) {
+  const data = await getData(id);
+  if (data == undefined) {
     return {
       description: "Not found",
     };
   }
 
   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 json = await response.json();
 
   if (json.code && json.message) {
-    return {
-      error: true,
-    };
+    return undefined;
   }
-
   return json as Paste;
 }
 
 export default async function Paste({
   params: { id },
 }: PasteProps): Promise<ReactElement> {
-  const { content, error } = await getData(id);
+  const data = await getData(id);
 
-  if (content == undefined || error) {
-    return <div>Not found</div>;
+  if (data == undefined) {
+    return notFound();
   }
 
   return (
@@ -76,9 +68,12 @@ export default async function Paste({
 
       <pre>
         <code
-          className={cn("hljs !bg-transparent", jetbrainsMono.className)}
+          className={cn(
+            "hljs !bg-transparent text-sm",
+            jetbrainsMono.className,
+          )}
           dangerouslySetInnerHTML={{
-            __html: hljs.highlightAuto(content).value,
+            __html: hljs.highlightAuto(data.content).value,
           }}
         />
       </pre>
diff --git a/src/app/common/utils.ts b/src/app/common/utils.ts
index d084cca..365058c 100644
--- a/src/app/common/utils.ts
+++ b/src/app/common/utils.ts
@@ -1,6 +1,6 @@
-import { type ClassValue, clsx } from "clsx"
-import { twMerge } from "tailwind-merge"
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
 
 export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
+  return twMerge(clsx(inputs));
 }
diff --git a/src/app/components/theme-provider.tsx b/src/app/components/theme-provider.tsx
index e90aa8c..b2baa74 100644
--- a/src/app/components/theme-provider.tsx
+++ b/src/app/components/theme-provider.tsx
@@ -1,8 +1,8 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import { ThemeProvider as NextThemesProvider } from "next-themes"
-import { type ThemeProviderProps } from "next-themes/dist/types"
+import * as React from "react";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+import { type ThemeProviderProps } from "next-themes/dist/types";
 
 export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
     return <NextThemesProvider {...props}>{children}</NextThemesProvider>
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 84287e8..41668a3 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -1,13 +1,13 @@
-import type { Config } from "tailwindcss"
+import type { Config } from "tailwindcss";
 
 const config = {
   darkMode: ["class"],
   content: [
-    './pages/**/*.{ts,tsx}',
-    './components/**/*.{ts,tsx}',
-    './app/**/*.{ts,tsx}',
-    './src/**/*.{ts,tsx}',
-	],
+    "./pages/**/*.{ts,tsx}",
+    "./components/**/*.{ts,tsx}",
+    "./app/**/*.{ts,tsx}",
+    "./src/**/*.{ts,tsx}",
+  ],
   prefix: "",
   theme: {
     container: {
@@ -75,6 +75,6 @@ const config = {
     },
   },
   plugins: [require("tailwindcss-animate")],
-} satisfies Config
+} satisfies Config;
 
-export default config
\ No newline at end of file
+export default config;