From 50cc087bed8455da20e8f33431f6c12c3a4e90a2 Mon Sep 17 00:00:00 2001
From: Taken <taken@mairimashita.org>
Date: Thu, 26 Jun 2025 23:44:27 +0200
Subject: [PATCH] Small fixes

---
 src/app/r/[slug]/not-found.tsx               |  2 +-
 src/components/dashboard/urls-data-table.tsx | 86 ++++++++++----------
 2 files changed, 45 insertions(+), 43 deletions(-)

diff --git a/src/app/r/[slug]/not-found.tsx b/src/app/r/[slug]/not-found.tsx
index df8c471..5fca86a 100644
--- a/src/app/r/[slug]/not-found.tsx
+++ b/src/app/r/[slug]/not-found.tsx
@@ -9,7 +9,7 @@ export default function NotFound() {
                     Link Not Found
                 </h2>
                 <p className="mt-2 text-gray-600 dark:text-gray-400">
-                    The link you're looking for doesn't exist or has expired.
+                    The link you&apos;re looking for doesn&apos;t exist or has expired.
                 </p>
                 <Link
                     href="/"
diff --git a/src/components/dashboard/urls-data-table.tsx b/src/components/dashboard/urls-data-table.tsx
index 3054958..6d1e6e9 100644
--- a/src/components/dashboard/urls-data-table.tsx
+++ b/src/components/dashboard/urls-data-table.tsx
@@ -238,15 +238,15 @@ export function UrlsDataTable({ data }: UrlsDataTableProps) {
     const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({})
     const router = useRouter()
 
-    function handleCopy(string: string) {
+    const handleCopy = React.useCallback((string: string) => {
         navigator.clipboard.writeText(string).then(() => {
             toast.success("URL copied to clipboard")
         }).catch(() => {
             toast.error("Failed to copy URL")
         })
-    }
+    }, [])
 
-    async function handleDelete(id: string) {
+    const handleDelete = React.useCallback(async (id: string) => {
         const res = await deleteUrl(id)
 
         if (res.error) {
@@ -255,49 +255,51 @@ export function UrlsDataTable({ data }: UrlsDataTableProps) {
             toast.success("URL deleted successfully")
             router.refresh()
         }
-    }
+    }, [router])
 
-    const actionRow: ColumnDef<UrlRecord> = {
-        id: "actions",
-        enableHiding: false,
-        cell: ({ row }) => {
-            const urlRecord = row.original
+    const tableColumns = React.useMemo(() => {
+        const actionRow: ColumnDef<UrlRecord> = {
+            id: "actions",
+            enableHiding: false,
+            cell: ({ row }) => {
+                const urlRecord = row.original
 
-            return (
-                <DropdownMenu>
-                    <DropdownMenuTrigger asChild>
-                        <Button variant="ghost" className="h-8 w-8 p-0">
-                            <span className="sr-only">Open menu</span>
-                            <MoreHorizontal className="h-4 w-4" />
-                        </Button>
-                    </DropdownMenuTrigger>
-                    <DropdownMenuContent align="end">
-                        <DropdownMenuLabel>Actions</DropdownMenuLabel>
-                        <DropdownMenuItem
-                            onClick={() => {
-                                handleCopy(`${window.location.origin}/r/${urlRecord.slug}`)
-                            }}
-                        >
-                            <Copy className="mr-2 h-4 w-4" />
-                            Copy URL
-                        </DropdownMenuItem>
-                        <DropdownMenuSeparator />
-                        <DropdownMenuItem
-                            className="text-red-600"
-                            onClick={() => {
-                                handleDelete(urlRecord.id)
-                            }}
-                        >
-                            <Trash2 className="mr-2 h-4 w-4" />
-                            Delete
-                        </DropdownMenuItem>
-                    </DropdownMenuContent>
-                </DropdownMenu>
-            )
+                return (
+                    <DropdownMenu>
+                        <DropdownMenuTrigger asChild>
+                            <Button variant="ghost" className="h-8 w-8 p-0">
+                                <span className="sr-only">Open menu</span>
+                                <MoreHorizontal className="h-4 w-4" />
+                            </Button>
+                        </DropdownMenuTrigger>
+                        <DropdownMenuContent align="end">
+                            <DropdownMenuLabel>Actions</DropdownMenuLabel>
+                            <DropdownMenuItem
+                                onClick={() => {
+                                    handleCopy(`${window.location.origin}/r/${urlRecord.slug}`)
+                                }}
+                            >
+                                <Copy className="mr-2 h-4 w-4" />
+                                Copy URL
+                            </DropdownMenuItem>
+                            <DropdownMenuSeparator />
+                            <DropdownMenuItem
+                                className="text-red-600"
+                                onClick={() => {
+                                    handleDelete(urlRecord.id)
+                                }}
+                            >
+                                <Trash2 className="mr-2 h-4 w-4" />
+                                Delete
+                            </DropdownMenuItem>
+                        </DropdownMenuContent>
+                    </DropdownMenu>
+                )
+            }
         }
-    }
 
-    const tableColumns = React.useMemo(() => [...columns, actionRow], [actionRow])
+        return [...columns, actionRow]
+    }, [handleCopy, handleDelete])
 
     const table = useReactTable({
         data,