auth improvements,profile image uploads,mobile nav,product page redesign

[moehdotdev]

This PR improves the authentication flow, introduces file-based profile image uploads, adds a mobile navigation menu, and significantly redesigns the product page experience.

The goal is to improve onboarding reliability, modernize account management, and make browsing listings smoother on both desktop and mobile.

---

authentication

email verification

Added email verification using OTP codes for email/password signup.

Flow:

1. user signs up with email + password
2. verification code sent via Resend
3. user enters 6-digit code
4. account activated

Details:

• OTP expires after 10 minutes
• handled through the auth provider layer
• improved UI for verification + error handling

New env vars:

AUTH_RESEND_KEY=
AUTH_EMAIL_FROM=

GitHub OAuth remains unchanged.

---

profile image uploads

Profile images now use Convex file storage instead of raw URLs.

Changes:

• added generateUploadUrl mutation
• images uploaded directly to storage
• stored as storageId on the user record

Benefits:

• prevents broken image links
• supports secure uploads
• easier file lifecycle management

Account pages now support:

• image upload
• filename preview
• upload reset after save

---

account layout refactor

Introduced PageScaffold to standardize account pages.

Before:

• each page handled its own layout

After:

PageScaffold
 ├ AccountBreadcrumb
 ├ AccountSidebar
 └ page content

Benefits:

• removes layout duplication
• consistent structure across account pages
• easier future updates

---

mobile navigation

Added a mobile dropdown menu to the main navbar.

Features:

• hamburger menu for small screens
• user avatar with initials fallback
• quick links to account pages

Links include:

• Offers
• Messages
• My Listings
• Favorites
• Blog
• Settings

Desktop navigation remains unchanged.

---

product page redesign

The product page received a major UX update.

image gallery

Listings now support multiple images with:

• thumbnail previews
• swipe gestures on mobile
• left/right navigation buttons
• drag/swipe navigation
• fallback image handling

layout improvements

The page now uses a structured layout:

Product Page
 ├ Breadcrumb
 ├ Image gallery
 ├ Seller card
 ├ Safety notice
 ├ Listing description
 ├ Listing details grid
 └ Features list

Seller card includes:

• seller info
• offer button
• message button
• like/dislike indicators

---

homepage improvements

category navigation

• icon-based categories
• horizontal scroll
• navigation arrows for overflow

featured banner

Added a promotional hero section for highlighted listings.

---

result

This PR improves several key parts of the product:

• safer email-based authentication
• reliable profile image uploads
• better mobile navigation
• modernized product browsing
• cleaner account page architecture

Overall this reduces onboarding friction and improves the browsing experience across devices.