Dental Care
This commit is contained in:
Iliyan Angelov
78
app/(main)/patient/appointments/page.tsx
Normal file
78
app/(main)/patient/appointments/page.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
import { AppointmentsList } from "@/components/patient/appointments-list";
|
||||
import { requirePatient } from "@/lib/auth-session/auth-server";
|
||||
import { safeFindManyAppointments } from "@/lib/utils/appointment-helpers";
|
||||
import type { Metadata } from "next";
|
||||
import { Alert, AlertDescription } from "@/components/ui/alert";
|
||||
import { CheckCircle } from "lucide-react";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "My Appointments",
|
||||
};
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
interface AppointmentsPageProps {
|
||||
searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
|
||||
}
|
||||
|
||||
export default async function AppointmentsPage({
|
||||
searchParams,
|
||||
}: AppointmentsPageProps) {
|
||||
const { user } = await requirePatient();
|
||||
|
||||
const appointmentsData = await safeFindManyAppointments({
|
||||
take: 50, // Limit to 50 most recent appointments
|
||||
where: {
|
||||
patientId: user.id,
|
||||
},
|
||||
include: {
|
||||
dentist: true,
|
||||
service: true,
|
||||
payment: true,
|
||||
},
|
||||
orderBy: {
|
||||
date: "desc",
|
||||
},
|
||||
});
|
||||
|
||||
const appointments = appointmentsData.map((appointment) => ({
|
||||
...appointment,
|
||||
service: {
|
||||
...appointment.service,
|
||||
price: appointment.service.price, // Keep price as is (can be string or number)
|
||||
},
|
||||
}));
|
||||
|
||||
const params = await searchParams;
|
||||
const showSuccess = params.success === "true";
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6 px-4 lg:px-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold">My Appointments</h1>
|
||||
<p className="text-muted-foreground">
|
||||
View and manage your dental appointments
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{showSuccess && (
|
||||
<Alert className="border-green-200 bg-green-50 dark:bg-green-950/30">
|
||||
<CheckCircle className="h-4 w-4 text-green-600" />
|
||||
<AlertDescription className="text-green-800 dark:text-green-200">
|
||||
Your appointment has been successfully booked! Check your email
|
||||
for confirmation.
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
)}
|
||||
|
||||
<AppointmentsList appointments={appointments} />
|
||||
</div>
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
93
app/(main)/patient/book-appointment/page.tsx
Normal file
93
app/(main)/patient/book-appointment/page.tsx
Normal file
@@ -0,0 +1,93 @@
|
||||
import type React from "react";
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
import BookingForm from "@/components/patient/booking-form";
|
||||
import { requirePatient } from "@/lib/auth-session/auth-server";
|
||||
import { prisma } from "@/lib/types/prisma";
|
||||
import type { Metadata } from "next";
|
||||
import { Alert, AlertDescription } from "@/components/ui/alert";
|
||||
import { XCircle } from "lucide-react";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Book Appointment",
|
||||
};
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
interface BookAppointmentPageProps {
|
||||
searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
|
||||
}
|
||||
|
||||
export default async function BookAppointmentPage({
|
||||
searchParams,
|
||||
}: BookAppointmentPageProps) {
|
||||
const { user } = await requirePatient();
|
||||
|
||||
// Fetch available services from database
|
||||
const servicesFromDb = await prisma.service.findMany({
|
||||
where: {
|
||||
isActive: true,
|
||||
},
|
||||
orderBy: {
|
||||
name: "asc",
|
||||
},
|
||||
});
|
||||
|
||||
// Transform services to match component expectations
|
||||
const services = servicesFromDb.map((service) => ({
|
||||
id: service.id,
|
||||
name: service.name,
|
||||
price: service.price,
|
||||
duration: service.duration,
|
||||
category: service.category,
|
||||
description: service.description || undefined,
|
||||
}));
|
||||
|
||||
// Fetch available dentists
|
||||
const dentists = await prisma.user.findMany({
|
||||
where: {
|
||||
role: "dentist",
|
||||
isAvailable: true,
|
||||
},
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
specialization: true,
|
||||
image: true,
|
||||
},
|
||||
orderBy: {
|
||||
name: "asc",
|
||||
},
|
||||
});
|
||||
|
||||
// Transform dentists data to match component expectations
|
||||
const transformedDentists = dentists.map((dentist) => ({
|
||||
...dentist,
|
||||
specialization: dentist.specialization || undefined,
|
||||
image: dentist.image || undefined,
|
||||
}));
|
||||
|
||||
const params = await searchParams;
|
||||
const showCanceled = params.canceled === "true";
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
{showCanceled && (
|
||||
<Alert className="m-4 md:m-8 border-red-200 bg-red-50 dark:bg-red-950/30">
|
||||
<XCircle className="h-4 w-4 text-red-600" />
|
||||
<AlertDescription className="text-red-800 dark:text-red-200">
|
||||
Payment was canceled. You can try booking again.
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
)}
|
||||
<BookingForm
|
||||
services={services}
|
||||
dentists={transformedDentists}
|
||||
patientId={user.id}
|
||||
/>
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
176
app/(main)/patient/health-records/page.tsx
Normal file
176
app/(main)/patient/health-records/page.tsx
Normal file
@@ -0,0 +1,176 @@
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardDescription,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "@/components/ui/card";
|
||||
import { requirePatient } from "@/lib/auth-session/auth-server";
|
||||
import { prisma } from "@/lib/types/prisma";
|
||||
import type { Metadata } from "next";
|
||||
import { FileText, Calendar, User } from "lucide-react";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Health Records",
|
||||
};
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function HealthRecordsPage() {
|
||||
const { user } = await requirePatient();
|
||||
|
||||
const userDetails = await prisma.user.findUnique({
|
||||
where: { id: user.id },
|
||||
include: {
|
||||
appointmentsAsPatient: {
|
||||
where: {
|
||||
status: "completed",
|
||||
},
|
||||
include: {
|
||||
service: true,
|
||||
dentist: true,
|
||||
},
|
||||
orderBy: {
|
||||
date: "desc",
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6 px-4 lg:px-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold">Health Records</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Your medical history and treatment records
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Personal Information */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<User className="h-5 w-5" />
|
||||
Personal Information
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="grid gap-4 md:grid-cols-2">
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">
|
||||
Full Name
|
||||
</p>
|
||||
<p className="text-base">{userDetails?.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">Email</p>
|
||||
<p className="text-base">{userDetails?.email}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">Phone</p>
|
||||
<p className="text-base">
|
||||
{userDetails?.phone || "Not provided"}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">
|
||||
Date of Birth
|
||||
</p>
|
||||
<p className="text-base">
|
||||
{userDetails?.dateOfBirth
|
||||
? new Date(userDetails.dateOfBirth).toLocaleDateString()
|
||||
: "Not provided"}
|
||||
</p>
|
||||
</div>
|
||||
<div className="md:col-span-2">
|
||||
<p className="text-sm font-medium text-muted-foreground">
|
||||
Address
|
||||
</p>
|
||||
<p className="text-base">
|
||||
{userDetails?.address || "Not provided"}
|
||||
</p>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Medical History */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<FileText className="h-5 w-5" />
|
||||
Medical History
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Important medical information for your dentist
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{userDetails?.medicalHistory ? (
|
||||
<p className="text-base whitespace-pre-wrap">
|
||||
{userDetails.medicalHistory}
|
||||
</p>
|
||||
) : (
|
||||
<p className="text-muted-foreground">
|
||||
No medical history recorded
|
||||
</p>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Treatment History */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Calendar className="h-5 w-5" />
|
||||
Treatment History
|
||||
</CardTitle>
|
||||
<CardDescription>Completed dental procedures</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{!userDetails?.appointmentsAsPatient ||
|
||||
userDetails.appointmentsAsPatient.length === 0 ? (
|
||||
<p className="text-muted-foreground text-center py-8">
|
||||
No treatment history
|
||||
</p>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
{userDetails.appointmentsAsPatient.map((appointment) => (
|
||||
<div
|
||||
key={appointment.id}
|
||||
className="border-b pb-4 last:border-0"
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
<div>
|
||||
<p className="font-medium">
|
||||
{appointment.service.name}
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Dr. {appointment.dentist.name}
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{new Date(appointment.date).toLocaleDateString()} at{" "}
|
||||
{appointment.timeSlot}
|
||||
</p>
|
||||
{appointment.notes && (
|
||||
<p className="text-sm mt-2">
|
||||
<span className="font-medium">Notes:</span>{" "}
|
||||
{appointment.notes}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
92
app/(main)/patient/page.tsx
Normal file
92
app/(main)/patient/page.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
import { PatientSectionCards } from "@/components/patient/section-cards";
|
||||
import { requirePatient } from "@/lib/auth-session/auth-server";
|
||||
import { prisma } from "@/lib/types/prisma";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Patient Dashboard",
|
||||
};
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function PatientDashboard() {
|
||||
// Require patient role - will redirect to appropriate page if not patient
|
||||
const { user } = await requirePatient();
|
||||
|
||||
const now = new Date();
|
||||
|
||||
// Run all queries in parallel for better performance
|
||||
const [
|
||||
upcomingAppointmentsCount,
|
||||
completedAppointmentsCount,
|
||||
totalSpentResult,
|
||||
pendingPaymentsResult,
|
||||
] = await Promise.all([
|
||||
// Fetch upcoming appointments count
|
||||
prisma.appointment.count({
|
||||
where: {
|
||||
patientId: user.id,
|
||||
date: {
|
||||
gte: now,
|
||||
},
|
||||
status: {
|
||||
in: ["pending", "confirmed"],
|
||||
},
|
||||
},
|
||||
}),
|
||||
// Fetch completed appointments count
|
||||
prisma.appointment.count({
|
||||
where: {
|
||||
patientId: user.id,
|
||||
status: "completed",
|
||||
},
|
||||
}),
|
||||
// Calculate total spent (paid payments)
|
||||
prisma.payment.aggregate({
|
||||
where: {
|
||||
userId: user.id,
|
||||
status: "paid",
|
||||
},
|
||||
_sum: {
|
||||
amount: true,
|
||||
},
|
||||
}),
|
||||
// Calculate pending payments
|
||||
prisma.payment.aggregate({
|
||||
where: {
|
||||
userId: user.id,
|
||||
status: "pending",
|
||||
},
|
||||
_sum: {
|
||||
amount: true,
|
||||
},
|
||||
}),
|
||||
]);
|
||||
|
||||
const patientStats = {
|
||||
upcomingAppointments: upcomingAppointmentsCount,
|
||||
completedAppointments: completedAppointmentsCount,
|
||||
totalSpent: totalSpentResult._sum.amount || 0,
|
||||
pendingPayments: pendingPaymentsResult._sum.amount || 0,
|
||||
};
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
|
||||
<div className="px-4 lg:px-6">
|
||||
<h1 className="text-3xl font-bold">Welcome back, {user.name}!</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Manage your appointments and health records
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<PatientSectionCards stats={patientStats} />
|
||||
</div>
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
52
app/(main)/patient/payments/page.tsx
Normal file
52
app/(main)/patient/payments/page.tsx
Normal file
@@ -0,0 +1,52 @@
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
import { PaymentHistory } from "@/components/patient/payment-history";
|
||||
import { requirePatient } from "@/lib/auth-session/auth-server";
|
||||
import { prisma } from "@/lib/types/prisma";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Payment History",
|
||||
};
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function PaymentsPage() {
|
||||
const { user } = await requirePatient();
|
||||
|
||||
const payments = await prisma.payment.findMany({
|
||||
take: 50, // Limit to 50 most recent payments
|
||||
where: {
|
||||
userId: user.id,
|
||||
},
|
||||
include: {
|
||||
appointment: {
|
||||
include: {
|
||||
service: true,
|
||||
dentist: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
orderBy: {
|
||||
createdAt: "desc",
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6 px-4 lg:px-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold">Payment History</h1>
|
||||
<p className="text-muted-foreground">
|
||||
View your payment transactions
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<PaymentHistory payments={payments} />
|
||||
</div>
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
44
app/(main)/patient/settings/page.tsx
Normal file
44
app/(main)/patient/settings/page.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import { requireAuth } from "@/lib/auth-session/auth-server";
|
||||
import { redirect } from "next/navigation";
|
||||
import { UserSettingsContent } from "@/components/user/settings-content";
|
||||
import { prisma } from "@/lib/types/prisma";
|
||||
import { DashboardLayout } from "@/components/layout/dashboard-layout";
|
||||
|
||||
// Force dynamic rendering since this page uses authentication (headers)
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function UserSettingsPage() {
|
||||
const session = await requireAuth();
|
||||
|
||||
if (session.user.role !== "patient") {
|
||||
redirect("/");
|
||||
}
|
||||
|
||||
// Fetch full user data
|
||||
const user = await prisma.user.findUnique({
|
||||
where: { id: session.user.id },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
email: true,
|
||||
phone: true,
|
||||
image: true,
|
||||
dateOfBirth: true,
|
||||
address: true,
|
||||
role: true,
|
||||
},
|
||||
});
|
||||
|
||||
if (!user) {
|
||||
redirect("/sign-in");
|
||||
}
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
user={{ ...user, role: user.role || "patient" }}
|
||||
role="patient"
|
||||
>
|
||||
<UserSettingsContent user={{ ...user, role: user.role || "patient" }} />
|
||||
</DashboardLayout>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user