Update bookmarks to be fetched on render

.env.example

@@ -1,2 +1 @@
-NEXT_APP_URL=https://next-dashboard.tzgyn.com
 DATABASE_URL=postgres://postgres:password@127.0.0.1:5432/next-dashboard

app/api/bookmark/route.ts

@@ -2,8 +2,6 @@ import { bookmarkSchema } from '@/types'
 import { NextRequest, NextResponse } from 'next/server'
 import { db, bookmark } from '@/lib/schema'
 
-export const dynamic = 'force-dynamic'
-
 export const GET = async () => {
 	const bookmarks = await db.select().from(bookmark)
 

app/dashboard/page.tsx

@@ -1,24 +1,19 @@
 import { BookmarkCard } from '@/components/bookmarkCard'
 import { bookmarkSchema } from '@/types'
+import { db, bookmark } from '@/lib/schema'
 
-const getData = async () => {
+export const dynamic = 'force-dynamic'
-	const res = await fetch(process.env.NEXT_APP_URL + '/api/bookmark', {
+export const fetchCache = 'force-no-store'
-		method: 'GET',
-		cache: 'no-store',
-	})
-	const data = await res.json()
-
-	return bookmarkSchema.array().parse(data)
-}
 
 export default async function DashboardPage() {
-	const data = await getData()
+	const data = await db.select().from(bookmark)
 
+	const bookmarks = bookmarkSchema.array().parse(data)
 	return (
 		<div className='mt-4 flex w-full max-w-4xl flex-row flex-wrap justify-center gap-6'>
-			{data.map((data, index) => (
+			{bookmarks.map((data, index) => (
 				<BookmarkCard
-					index={index}
+					key={index}
 					data={data}
 				/>
 			))}

components/bookmarkCard.tsx

@@ -7,18 +7,11 @@ import { Image } from '@nextui-org/image'
 
 import { type Bookmark } from '@/types'
 
-export const BookmarkCard = ({
+export const BookmarkCard = ({ data }: { data: Bookmark }) => {
-	index,
-	data,
-}: {
-	index: number
-	data: Bookmark
-}) => {
 	return (
 		<>
 			<Card
 				className='w-96'
-				key={index}
 				isPressable
 				onPress={() => open(data.url, '_blank')}>
 				<CardHeader className='flex gap-3'>