mvp

src/components/dashboard.tsx

@@ -0,0 +1,63 @@
+'use client'
+
+import Link from 'next/link'
+import { Note } from '@/types/note'
+import { NoteList } from './note-list'
+import { Button } from '@/components/ui/button'
+import { SearchBar } from './search-bar'
+import { ArrowRight } from 'lucide-react'
+
+export function Dashboard({ recentNotes, favoriteNotes, pinnedNotes }: {
+  recentNotes: Note[]
+  favoriteNotes: Note[]
+  pinnedNotes: Note[]
+}) {
+  return (
+    <>
+      <div className="flex justify-end mb-3">
+        <SearchBar />
+      </div>
+      <div className="space-y-8">
+
+      {pinnedNotes.length > 0 && (
+        <section>
+          <h2 className="text-xl font-semibold mb-3 flex items-center gap-2">
+            📌 Pineadas
+          </h2>
+          <NoteList notes={pinnedNotes} />
+        </section>
+      )}
+
+      {favoriteNotes.length > 0 && (
+        <section>
+          <h2 className="text-xl font-semibold mb-3 flex items-center gap-2">
+            ❤️ Favoritas
+          </h2>
+          <NoteList notes={favoriteNotes} />
+        </section>
+      )}
+
+      <section>
+        <div className="flex items-center justify-between mb-3">
+          <h2 className="text-xl font-semibold">Recientes</h2>
+          <Link href="/notes">
+            <Button variant="ghost" size="sm" className="gap-1">
+              Ver todas <ArrowRight className="h-4 w-4" />
+            </Button>
+          </Link>
+        </div>
+        {recentNotes.length > 0 ? (
+          <NoteList notes={recentNotes} />
+        ) : (
+          <div className="text-center py-8 text-gray-500">
+            <p>No hay notas todavía.</p>
+            <Link href="/new">
+              <Button className="mt-4">Crea tu primera nota</Button>
+            </Link>
+          </div>
+        )}
+      </section>
+    </div>
+    </>
+  )
+}