Add product detail and listing pages with API integration

- Created a new product detail page to display individual product information, including images, descriptions, and pricing.
- Implemented a product listing page to showcase all available products using the ProductCard and ProductGrid components.
- Added API endpoints for fetching product data, ensuring only active products are returned.
- Introduced a database seed script to populate the database with initial mock product data for development and testing.
- Updated settings to include new database seeding command and adjusted routing for product links.

package.json

@@ -14,7 +14,8 @@
     "db:generate": "drizzle-kit generate",
     "db:migrate": "drizzle-kit migrate",
     "db:studio": "drizzle-kit studio",
-    "db:push": "drizzle-kit push"
+    "db:push": "drizzle-kit push",
+    "db:seed": "tsx server/database/seed.ts"
   },
   "dependencies": {
     "@nuxtjs/i18n": "^10.1.2",
@@ -38,12 +39,14 @@
     "@nuxt/eslint": "^1.10.0",
     "@nuxtjs/tailwindcss": "^6.14.0",
     "@types/node": "^22.10.0",
+    "dotenv": "^17.2.3",
     "drizzle-kit": "^0.31.6",
     "eslint": "^9.38.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",
     "prettier": "^3.6.2",
     "shadcn-nuxt": "^2.3.2",
+    "tsx": "^4.20.6",
     "typescript": "^5.7.0"
   }
 }