feat: add action buttons to documents table

apps/web/src/app/(dashboard)/dashboard/page.tsx

@@ -15,6 +15,7 @@ import {
 } from '@documenso/ui/primitives/table';
 
 import { CardMetric } from '~/components/(dashboard)/metric-card/metric-card';
+import { ActionButtons } from '~/components/(dashboard)/table/actions-component';
 import { DocumentStatus } from '~/components/formatter/document-status';
 import { LocaleDate } from '~/components/formatter/locale-date';
 
@@ -61,7 +62,8 @@ export default async function DashboardPage() {
                 <TableHead className="w-[100px]">ID</TableHead>
                 <TableHead>Title</TableHead>
                 <TableHead>Status</TableHead>
-                <TableHead className="text-right">Created</TableHead>
+                <TableHead>Created</TableHead>
+                <TableHead>Actions</TableHead>
               </TableRow>
             </TableHeader>
             <TableBody>
@@ -79,9 +81,12 @@ export default async function DashboardPage() {
                   <TableCell>
                     <DocumentStatus status={document.status} />
                   </TableCell>
-                  <TableCell className="text-right">
+                  <TableCell>
                     <LocaleDate date={document.created} />
                   </TableCell>
+                  <TableCell>
+                    <ActionButtons />
+                  </TableCell>
                 </TableRow>
               ))}
               {results.data.length === 0 && (

apps/web/src/components/(dashboard)/table/actions-component.tsx

@@ -0,0 +1,33 @@
+'use client';
+
+import React from 'react';
+
+import { Download, Edit, Trash } from 'lucide-react';
+
+export function ActionButtons() {
+  return (
+    <div className="flex cursor-pointer gap-6">
+      <Edit
+        size={18}
+        color="#71717A"
+        onClick={() => {
+          console.log('Edit Button');
+        }}
+      />
+      <Download
+        size={18}
+        color="#71717A"
+        onClick={() => {
+          console.log('Download Button');
+        }}
+      />
+      <Trash
+        size={18}
+        color="#71717A"
+        onClick={() => {
+          console.log('Delete Button');
+        }}
+      />
+    </div>
+  );
+}

apps/web/src/components/formatter/locale-date.tsx

@@ -10,7 +10,7 @@ export const LocaleDate = ({ className, date, ...props }: LocaleDateProps) => {
   const [localeDate, setLocaleDate] = useState(() => new Date(date).toISOString());
 
   useEffect(() => {
-    setLocaleDate(new Date(date).toLocaleString());
+    setLocaleDate(new Date(date).toLocaleDateString());
   }, [date]);
 
   return (