feat: implement favorite items list with add item functionality

This commit is contained in:
Greg 2025-05-18 21:45:00 +02:00
parent e0bc98d320
commit b31e5578df
3 changed files with 6 additions and 6 deletions

View File

@ -15,7 +15,7 @@ export async function createItem(formData) {
type: formData.get('type'), type: formData.get('type'),
rating: formData.get('rating') ? parseInt(formData.get('rating'), 10) : null, rating: formData.get('rating') ? parseInt(formData.get('rating'), 10) : null,
notes: formData.get('notes'), notes: formData.get('notes'),
image_url: formData.get('image_url'), picture_url: formData.get('picture_url'),
// created_at will be set by default in Supabase or can be added here if needed // created_at will be set by default in Supabase or can be added here if needed
}; };

View File

@ -98,11 +98,11 @@ export default function AddItemPage() {
</div> </div>
<div> <div>
<label htmlFor="image_url" className="block text-sm font-medium text-neutral-300 mb-1">Image URL</label> <label htmlFor="picture_url" className="block text-sm font-medium text-neutral-300 mb-1">Picture URL</label>
<input <input
type="url" type="url"
name="image_url" name="picture_url"
id="image_url" id="picture_url"
className="block w-full bg-neutral-700 border-neutral-600 rounded-md shadow-sm py-2 px-3 text-neutral-100 focus:ring-sky-500 focus:border-sky-500 sm:text-sm" className="block w-full bg-neutral-700 border-neutral-600 rounded-md shadow-sm py-2 px-3 text-neutral-100 focus:ring-sky-500 focus:border-sky-500 sm:text-sm"
placeholder="https://example.com/image.jpg" placeholder="https://example.com/image.jpg"
/> />

View File

@ -66,10 +66,10 @@ export default async function Home() {
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6"> <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
{items.map((item) => ( {items.map((item) => (
<div key={item.id} className="bg-neutral-800 rounded-lg shadow-lg p-4 flex flex-col"> <div key={item.id} className="bg-neutral-800 rounded-lg shadow-lg p-4 flex flex-col">
{item.image_url ? ( {item.picture_url ? (
<div className="aspect-[3/4] w-full bg-neutral-700 rounded mb-3 overflow-hidden"> <div className="aspect-[3/4] w-full bg-neutral-700 rounded mb-3 overflow-hidden">
<img <img
src={item.image_url} src={item.picture_url}
alt={item.title || 'Item image'} alt={item.title || 'Item image'}
className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300 ease-in-out" className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300 ease-in-out"
/> />