Implement my toys page sqlite database function on dashboard
This commit is contained in:
parent
bcaebf0494
commit
a6ccc6a5f4
|
|
@ -2,9 +2,8 @@
|
|||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { getToysByOwner } from "@/data/operations";
|
||||
import { mockRentalHistory } from "@/lib/mockData";
|
||||
import Link from "next/link";
|
||||
import { PlusCircle, Edit3, Trash2, Eye, ToyBrick as ToyBrickIcon, BarChartHorizontalBig } from "lucide-react";
|
||||
import { PlusCircle, Edit3, Trash2, Eye, ToyBrick as ToyBrickIcon } from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import type { Toy } from "@/types";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
|
|
@ -16,16 +15,6 @@ export default async function MyToysPage() {
|
|||
const t = await getI18n();
|
||||
const userToys = getToysByOwner(currentUserId);
|
||||
|
||||
const getRentalCountForToy = (toyId: string): number => {
|
||||
// NOTE: This part still uses mock data and will need to be migrated.
|
||||
return mockRentalHistory.filter(entry => entry.toy.id === toyId && entry.toy.ownerId === currentUserId).length;
|
||||
};
|
||||
|
||||
const userToysWithRentalCount = userToys.map(toy => ({
|
||||
...toy,
|
||||
rentalCount: getRentalCountForToy(toy.id),
|
||||
}));
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
<div className="flex justify-between items-center">
|
||||
|
|
@ -41,7 +30,7 @@ export default async function MyToysPage() {
|
|||
</Link>
|
||||
</div>
|
||||
|
||||
{userToysWithRentalCount.length === 0 ? (
|
||||
{userToys.length === 0 ? (
|
||||
<Card className="text-center py-12 shadow-md">
|
||||
<CardHeader>
|
||||
<ToyBrickIcon className="h-16 w-16 mx-auto text-muted-foreground mb-4" />
|
||||
|
|
@ -59,8 +48,8 @@ export default async function MyToysPage() {
|
|||
</Card>
|
||||
) : (
|
||||
<div className="space-y-6">
|
||||
{userToysWithRentalCount.map(toy => (
|
||||
<ListedToyItem key={toy.id} toy={toy} t={t} rentalCount={toy.rentalCount} />
|
||||
{userToys.map(toy => (
|
||||
<ListedToyItem key={toy.id} toy={toy} t={t} />
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
|
@ -71,10 +60,9 @@ export default async function MyToysPage() {
|
|||
interface ListedToyItemProps {
|
||||
toy: Toy & {dataAiHint?: string};
|
||||
t: (key: string, params?: Record<string, string | number>) => string;
|
||||
rentalCount: number;
|
||||
}
|
||||
|
||||
function ListedToyItem({ toy, t, rentalCount }: ListedToyItemProps) {
|
||||
function ListedToyItem({ toy, t }: ListedToyItemProps) {
|
||||
const placeholderHint = toy.dataAiHint || toy.category.toLowerCase() || "toy";
|
||||
return (
|
||||
<Card className="overflow-hidden shadow-lg hover:shadow-xl transition-shadow duration-300">
|
||||
|
|
@ -117,14 +105,6 @@ function ListedToyItem({ toy, t, rentalCount }: ListedToyItemProps) {
|
|||
<span className="font-semibold">{t('toy_details.price')}: </span>
|
||||
{toy.pricePerDay !== undefined ? (toy.pricePerDay > 0 ? `$${toy.pricePerDay}${t('toy_details.price_per_day')}` : t('toy_details.price_free')) : 'Not set'}
|
||||
</div>
|
||||
{rentalCount > 0 && (
|
||||
<div className="flex items-center text-accent">
|
||||
<BarChartHorizontalBig className="mr-1.5 h-4 w-4" />
|
||||
{rentalCount === 1
|
||||
? t('dashboard.my_toys.rental_count_one')
|
||||
: t('dashboard.my_toys.rental_count_many', { count: rentalCount })}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,15 +3,20 @@ import { Button } from "@/components/ui/button";
|
|||
import Link from "next/link";
|
||||
import { ToyBrick, PlusCircle, ListOrdered, User, ShoppingBag } from "lucide-react";
|
||||
import { getI18n } from "@/locales/server";
|
||||
import { getToysByOwner } from "@/data/operations";
|
||||
|
||||
const userStats = {
|
||||
listedToys: 3,
|
||||
activeRentals: 1,
|
||||
pendingRequests: 2,
|
||||
};
|
||||
const currentUserId = 1; // Mock logged-in user ID
|
||||
|
||||
export default async function DashboardOverviewPage() {
|
||||
const t = await getI18n();
|
||||
const userToys = getToysByOwner(currentUserId);
|
||||
|
||||
const userStats = {
|
||||
listedToys: userToys.length, // Real data from DB
|
||||
activeRentals: 1, // Mock data
|
||||
pendingRequests: 2, // Mock data
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
<Card className="shadow-lg">
|
||||
|
|
|
|||
BIN
toyshare.db
BIN
toyshare.db
Binary file not shown.
BIN
toyshare.db-shm
BIN
toyshare.db-shm
Binary file not shown.
BIN
toyshare.db-wal
BIN
toyshare.db-wal
Binary file not shown.
Loading…
Reference in New Issue