+
+ table.getColumn("slug")?.setFilterValue(event.target.value)}
+ className="max-w-sm"
+ />
+
+
+
+
+
+ {table
+ .getAllColumns()
+ .filter((column) => column.getCanHide())
+ .map((column) => {
+ return (
+ column.toggleVisibility(!!value)}
+ >
+ {column.id}
+
+ )
+ })}
+
+
+
+
+
+
+ {table.getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => {
+ return (
+
+ {header.isPlaceholder
+ ? null
+ : flexRender(
+ header.column.columnDef.header,
+ header.getContext()
+ )}
+
+ )
+ })}
+
+ ))}
+
+
+ {table.getRowModel().rows?.length ?
+ (
+ table.getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext()
+ )}
+
+ ))}
+
+ ))
+ ) :
+ (
+
+
+ No results.
+
+
+ )}
+
+
+
+
+
+ {table.getFilteredRowModel().rows.length} row(s) total.
+
+
+
+
+
+
+
|
+ )
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+ return (
+ [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+ return (
+ | [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableCaption({
+ className,
+ ...props
+}: React.ComponentProps<"caption">) {
+ return (
+
+ )
+}
+
+export {
+ Table,
+ TableHeader,
+ TableBody,
+ TableFooter,
+ TableHead,
+ TableRow,
+ TableCell,
+ TableCaption,
+}
diff --git a/src/lib/db/urls.ts b/src/lib/db/urls.ts
index ae1f1d1..2059529 100644
--- a/src/lib/db/urls.ts
+++ b/src/lib/db/urls.ts
@@ -1,7 +1,13 @@
-import { eq } from "drizzle-orm";
+import { eq, desc } from "drizzle-orm";
import { db } from "../drizzle/db";
import { urls } from "../drizzle/schema";
+export function getAllUrls() {
+ return db.query.urls.findMany({
+ orderBy: desc(urls.createdAt)
+ })
+}
+
export function insertUrl(data: typeof urls.$inferInsert) {
return db.insert(urls).values(data)
}
diff --git a/src/lib/drizzle/schema.ts b/src/lib/drizzle/schema.ts
index dc244d9..b7c50fc 100644
--- a/src/lib/drizzle/schema.ts
+++ b/src/lib/drizzle/schema.ts
@@ -2,6 +2,7 @@ export { account, session, user, verification } from "./auth-schema"
import { relations } from "drizzle-orm"
import { boolean, index, integer, pgTable, timestamp, uuid, varchar } from "drizzle-orm/pg-core"
+import { generateRandomSlug } from "../randomSlug"
const createdAt = timestamp("created_at", { withTimezone: true }).defaultNow()
const updatedAt = timestamp("updated_at", { withTimezone: true }).defaultNow().$onUpdate(() => new Date())
@@ -9,7 +10,7 @@ const updatedAt = timestamp("updated_at", { withTimezone: true }).defaultNow().$
export const urls = pgTable("urls", {
id: uuid("id").primaryKey().notNull().defaultRandom(),
url: varchar("url").notNull(),
- slug: varchar("slug").unique().notNull(),
+ slug: varchar("slug").unique().notNull().$defaultFn(() => generateRandomSlug()),
title: varchar("title"),
maxVisits: integer("max_visits"),
expDate: timestamp("exp_date", { withTimezone: true }),
diff --git a/src/lib/randomSlug.ts b/src/lib/randomSlug.ts
new file mode 100644
index 0000000..b9e41ff
--- /dev/null
+++ b/src/lib/randomSlug.ts
@@ -0,0 +1,10 @@
+export function generateRandomSlug(): string {
+ const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+ let result = '';
+
+ for (let i = 0; i < 5; i++) {
+ result += characters.charAt(Math.floor(Math.random() * characters.length));
+ }
+
+ return result;
+}
\ No newline at end of file
diff --git a/src/lib/schema/url.ts b/src/lib/schema/url.ts
index 92e7436..f846e4d 100644
--- a/src/lib/schema/url.ts
+++ b/src/lib/schema/url.ts
@@ -4,10 +4,10 @@ export const urlFormSchema = z.object({
url: z.string().url("Please enter a valid URL"),
slug: z
.string()
- .min(1, "Slug is required")
+ .min(1, "Slug must be at least 1 character long")
.max(50, "Slug must be 50 characters or less")
.regex(
/^[a-zA-Z0-9-_]+$/,
"Slug can only contain letters, numbers, hyphens, and underscores"
- )
+ ).optional(),
})
\ No newline at end of file
|