ATTUNE-HEART-THERAPY/website
6
0
Fork 0
Code Issues 7 Pull Requests 1 Actions Packages Projects Releases Wiki Activity
cb9be9405e
website/app/(user)/user/dashboard/page.tsx

593 lines
29 KiB
TypeScript
Raw Normal View History

Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
"use client";
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
import { useMemo, useEffect, useState } from "react";
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
import { useRouter } from "next/navigation";
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
import { Button } from "@/components/ui/button";
import {
Calendar,
Clock,
User,
Mail,
Phone,
Heart,
CalendarPlus,
Video,
CheckCircle2,
XCircle,
CalendarCheck,
ArrowUpRight,
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
Settings,
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
Loader2,
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
} from "lucide-react";
import Link from "next/link";
import { Navbar } from "@/components/Navbar";
Enhance UI components across the application by integrating theme support for dark mode. Update styles in Login, Book Now, User Dashboard, and Settings pages to improve visual consistency. Refactor various components to utilize the ThemeProvider for dynamic styling based on the selected theme.
2025-11-13 11:10:00 +00:00
import { useAppTheme } from "@/components/ThemeProvider";
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
import { useAuth } from "@/hooks/useAuth";
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
import { getUserAppointments, getUserAppointmentStats } from "@/lib/actions/appointments";
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
import type { Appointment, UserAppointmentStats } from "@/lib/models/appointments";
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
import { toast } from "sonner";
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
export default function UserDashboard() {
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
const router = useRouter();
Enhance UI components across the application by integrating theme support for dark mode. Update styles in Login, Book Now, User Dashboard, and Settings pages to improve visual consistency. Refactor various components to utilize the ThemeProvider for dynamic styling based on the selected theme.
2025-11-13 11:10:00 +00:00
const { theme } = useAppTheme();
const isDark = theme === "dark";
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
const { user } = useAuth();
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
const [appointments, setAppointments] = useState<Appointment[]>([]);
const [loading, setLoading] = useState(true);
const [stats, setStats] = useState<UserAppointmentStats | null>(null);
const [loadingStats, setLoadingStats] = useState(true);
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
// Fetch user appointments from user-specific endpoint
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
useEffect(() => {
const fetchAppointments = async () => {
setLoading(true);
try {
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
const data = await getUserAppointments();
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
setAppointments(data || []);
} catch (error) {
toast.error("Failed to load appointments. Please try again.");
setAppointments([]);
} finally {
setLoading(false);
}
};
fetchAppointments();
}, []);
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
// Fetch stats from API for authenticated user
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
useEffect(() => {
const fetchStats = async () => {
setLoadingStats(true);
try {
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
const statsData = await getUserAppointmentStats();
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
setStats(statsData);
} catch (error) {
toast.error("Failed to load appointment statistics.");
setStats({
total_requests: 0,
pending_review: 0,
scheduled: 0,
rejected: 0,
completed: 0,
completion_rate: 0,
});
} finally {
setLoadingStats(false);
}
};
fetchStats();
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
}, []);
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
const formatDate = (dateString: string) => {
const date = new Date(dateString);
return date.toLocaleDateString("en-US", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
});
};
const formatTime = (dateString: string) => {
const date = new Date(dateString);
return date.toLocaleTimeString("en-US", {
hour: "numeric",
minute: "2-digit",
});
};
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
const formatMemberSince = (dateString?: string) => {
if (!dateString) return "N/A";
const date = new Date(dateString);
return date.toLocaleDateString("en-US", {
month: "long",
year: "numeric",
});
};
// Filter appointments by status
const upcomingAppointments = useMemo(() => {
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
return appointments.filter(
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
(appointment) => appointment.status === "scheduled"
);
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
}, [appointments]);
const pendingAppointments = useMemo(() => {
return appointments.filter(
(appointment) => appointment.status === "pending_review"
);
}, [appointments]);
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
const completedAppointments = useMemo(() => {
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
return appointments.filter(
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
(appointment) => appointment.status === "completed"
);
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
}, [appointments]);
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
const rejectedAppointments = useMemo(() => {
return appointments.filter(
(appointment) => appointment.status === "rejected"
);
}, [appointments]);
// Sort appointments by created_at (newest first)
const allAppointments = useMemo(() => {
return [...appointments].sort((a, b) => {
const dateA = new Date(a.created_at).getTime();
const dateB = new Date(b.created_at).getTime();
return dateB - dateA;
});
}, [appointments]);
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
// Use stats from API, fallback to calculated stats if API stats not available
const displayStats = useMemo(() => {
if (stats) {
return {
scheduled: stats.scheduled || 0,
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
scheduled_pct: stats.scheduled_pct,
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
completed: stats.completed || 0,
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
completed_pct: stats.completed_pct,
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
pending_review: stats.pending_review || 0,
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
pending_review_pct: stats.pending_review_pct,
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
rejected: stats.rejected || 0,
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
rejected_pct: stats.rejected_pct,
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
total_requests: stats.total_requests || 0,
completion_rate: stats.completion_rate || 0,
};
}
// Fallback: calculate from appointments if stats not loaded yet
Update dashboard components to reflect API-driven percentage values - Adjusted the admin and user dashboard components to utilize API-provided percentage values (_pct) for various metrics. - Removed static trend values and updated the trend fields to undefined where applicable, ensuring clarity in data representation. - Added comments to indicate the source of percentage values, enhancing maintainability and understanding of the code.
2025-12-05 14:29:29 +00:00
// Note: Percentage values (_pct) are only available from API, not calculated
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
const scheduled = appointments.filter(a => a.status === "scheduled").length;
const completed = appointments.filter(a => a.status === "completed").length;
const pending_review = appointments.filter(a => a.status === "pending_review").length;
const rejected = appointments.filter(a => a.status === "rejected").length;
const total_requests = appointments.length;
const completion_rate = total_requests > 0 ? (scheduled / total_requests) * 100 : 0;
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
return {
scheduled,
Update dashboard components to reflect API-driven percentage values - Adjusted the admin and user dashboard components to utilize API-provided percentage values (_pct) for various metrics. - Removed static trend values and updated the trend fields to undefined where applicable, ensuring clarity in data representation. - Added comments to indicate the source of percentage values, enhancing maintainability and understanding of the code.
2025-12-05 14:29:29 +00:00
scheduled_pct: undefined, // Only from API
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
completed,
Update dashboard components to reflect API-driven percentage values - Adjusted the admin and user dashboard components to utilize API-provided percentage values (_pct) for various metrics. - Removed static trend values and updated the trend fields to undefined where applicable, ensuring clarity in data representation. - Added comments to indicate the source of percentage values, enhancing maintainability and understanding of the code.
2025-12-05 14:29:29 +00:00
completed_pct: undefined, // Only from API
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
pending_review,
Update dashboard components to reflect API-driven percentage values - Adjusted the admin and user dashboard components to utilize API-provided percentage values (_pct) for various metrics. - Removed static trend values and updated the trend fields to undefined where applicable, ensuring clarity in data representation. - Added comments to indicate the source of percentage values, enhancing maintainability and understanding of the code.
2025-12-05 14:29:29 +00:00
pending_review_pct: undefined, // Only from API
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
rejected,
Update dashboard components to reflect API-driven percentage values - Adjusted the admin and user dashboard components to utilize API-provided percentage values (_pct) for various metrics. - Removed static trend values and updated the trend fields to undefined where applicable, ensuring clarity in data representation. - Added comments to indicate the source of percentage values, enhancing maintainability and understanding of the code.
2025-12-05 14:29:29 +00:00
rejected_pct: undefined, // Only from API
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
total_requests,
completion_rate,
};
}, [stats, appointments]);
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
return (
Enhance UI components across the application by integrating theme support for dark mode. Update styles in Login, Book Now, User Dashboard, and Settings pages to improve visual consistency. Refactor various components to utilize the ThemeProvider for dynamic styling based on the selected theme.
2025-11-13 11:10:00 +00:00
<div className={`min-h-screen ${isDark ? 'bg-gray-900' : 'bg-gray-50'}`}>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
<Navbar />
{/* Main Content */}
<main className="container mx-auto px-4 sm:px-6 lg:px-8 space-y-6 pt-20 sm:pt-24 pb-8">
{/* Welcome Section */}
Refactor User Dashboard layout to improve responsiveness and visual consistency. Update button styles for better alignment and flexibility in different screen sizes.
2025-11-13 11:17:17 +00:00
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6">
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
<div>
Enhance UI components across the application by integrating theme support for dark mode. Update styles in Login, Book Now, User Dashboard, and Settings pages to improve visual consistency. Refactor various components to utilize the ThemeProvider for dynamic styling based on the selected theme.
2025-11-13 11:10:00 +00:00
<h1 className={`text-2xl font-semibold mb-1 ${isDark ? 'text-white' : 'text-gray-900'}`}>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
Welcome Back!
</h1>
Enhance UI components across the application by integrating theme support for dark mode. Update styles in Login, Book Now, User Dashboard, and Settings pages to improve visual consistency. Refactor various components to utilize the ThemeProvider for dynamic styling based on the selected theme.
2025-11-13 11:10:00 +00:00
<p className={`text-sm ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
Here's an overview of your appointments
</p>
</div>
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
<div className="flex items-center gap-3">
Refactor User Dashboard layout to improve responsiveness and visual consistency. Update button styles for better alignment and flexibility in different screen sizes.
2025-11-13 11:17:17 +00:00
<Link href="/user/settings" className="flex-1 sm:flex-initial">
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
<Button
variant="outline"
Refactor User Dashboard layout to improve responsiveness and visual consistency. Update button styles for better alignment and flexibility in different screen sizes.
2025-11-13 11:17:17 +00:00
className={`w-full sm:w-auto ${isDark ? 'hover:bg-gray-800 border-gray-700 text-gray-300' : 'hover:bg-gray-100'}`}
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
>
<Settings className="w-4 h-4 mr-2" />
Settings
</Button>
</Link>
Refactor User Dashboard layout to improve responsiveness and visual consistency. Update button styles for better alignment and flexibility in different screen sizes.
2025-11-13 11:17:17 +00:00
<Link href="/book-now" className="flex-1 sm:flex-initial">
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
<Button
Refactor User Dashboard layout to improve responsiveness and visual consistency. Update button styles for better alignment and flexibility in different screen sizes.
2025-11-13 11:17:17 +00:00
className="w-full sm:w-auto bg-gradient-to-r from-rose-500 to-pink-600 hover:from-rose-600 hover:to-pink-700 text-white"
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
>
<CalendarPlus className="w-4 h-4 mr-2" />
Add React DatePicker and styles, update package dependencies, and enhance booking validation
2025-11-26 11:42:31 +00:00
Book Appointment
Refactor admin navigation and header components to update links for dashboard, booking, and notifications to include the '/admin' prefix. Remove unused booking, dashboard, notifications, and user dashboard pages to streamline the admin panel. Enhance Navbar component with login dialog functionality for improved user experience.
2025-11-12 00:28:29 +00:00
</Button>
</Link>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
{loading ? (
<div className="flex items-center justify-center py-12">
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
<Loader2 className={`w-8 h-8 animate-spin ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
) : (
<>
{/* Stats Grid */}
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-4">
<div
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
className={`rounded-lg border p-4 sm:p-5 md:p-6 hover:shadow-md transition-shadow ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}
>
<div className="flex items-start justify-between mb-3 sm:mb-4">
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<CalendarCheck className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
{displayStats.scheduled_pct !== undefined && (
<div
className={`flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${isDark ? "bg-green-900/30 text-green-400" : "bg-green-50 text-green-700"}`}
>
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
<ArrowUpRight className="w-3 h-3" />
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
<span>{`${Math.round(displayStats.scheduled_pct)}%`}</span>
</div>
)}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
<div>
<h3 className={`text-xs font-medium mb-1 sm:mb-2 uppercase tracking-wider ${isDark ? 'text-rose-400' : 'text-rose-600'}`}>
Upcoming Appointments
</h3>
Remove redundant "vs last month" text from user dashboard statistics for a cleaner presentation. This change enhances the visual clarity of the dashboard while maintaining essential information display.
2025-12-04 19:14:54 +00:00
<p className={`text-xl sm:text-2xl font-bold ${isDark ? 'text-white' : 'text-gray-900'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
{displayStats.scheduled}
</p>
</div>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
<div
className={`rounded-lg border p-4 sm:p-5 md:p-6 hover:shadow-md transition-shadow ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}
>
<div className="flex items-start justify-between mb-3 sm:mb-4">
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<CheckCircle2 className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
{displayStats.completed_pct !== undefined && (
<div
className={`flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${isDark ? "bg-green-900/30 text-green-400" : "bg-green-50 text-green-700"}`}
>
<ArrowUpRight className="w-3 h-3" />
<span>{`${Math.round(displayStats.completed_pct)}%`}</span>
</div>
)}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
<div>
<h3 className={`text-xs font-medium mb-1 sm:mb-2 uppercase tracking-wider ${isDark ? 'text-rose-400' : 'text-rose-600'}`}>
Completed Sessions
</h3>
Remove redundant "vs last month" text from user dashboard statistics for a cleaner presentation. This change enhances the visual clarity of the dashboard while maintaining essential information display.
2025-12-04 19:14:54 +00:00
<p className={`text-xl sm:text-2xl font-bold ${isDark ? 'text-white' : 'text-gray-900'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
{displayStats.completed}
</p>
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
</div>
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
<div
className={`rounded-lg border p-4 sm:p-5 md:p-6 hover:shadow-md transition-shadow ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}
>
<div className="flex items-start justify-between mb-3 sm:mb-4">
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<Calendar className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
{/* No percentage badge for total appointments */}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
<div>
<h3 className={`text-xs font-medium mb-1 sm:mb-2 uppercase tracking-wider ${isDark ? 'text-rose-400' : 'text-rose-600'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
Total Appointments
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
</h3>
Remove redundant "vs last month" text from user dashboard statistics for a cleaner presentation. This change enhances the visual clarity of the dashboard while maintaining essential information display.
2025-12-04 19:14:54 +00:00
<p className={`text-xl sm:text-2xl font-bold ${isDark ? 'text-white' : 'text-gray-900'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
{displayStats.total_requests}
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
</p>
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
<div
className={`rounded-lg border p-4 sm:p-5 md:p-6 hover:shadow-md transition-shadow ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}
>
<div className="flex items-start justify-between mb-3 sm:mb-4">
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<Calendar className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
Add percentage fields to appointment stats and update dashboard components to display these metrics. - Introduced new percentage fields in the AppointmentStats and UserAppointmentStats interfaces. - Updated the admin and user dashboard components to include and display percentage metrics for scheduled, completed, pending review, and rejected appointments. - Removed commented-out percentage badges and implemented conditional rendering for displaying percentage values, enhancing the clarity of the dashboard statistics.
2025-12-05 14:14:12 +00:00
{displayStats.pending_review_pct !== undefined && (
<div
className={`flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${isDark ? "bg-yellow-900/30 text-yellow-400" : "bg-yellow-50 text-yellow-700"}`}
>
<ArrowUpRight className="w-3 h-3" />
<span>{`${Math.round(displayStats.pending_review_pct)}%`}</span>
</div>
)}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
<div>
<h3 className={`text-xs font-medium mb-1 sm:mb-2 uppercase tracking-wider ${isDark ? 'text-rose-400' : 'text-rose-600'}`}>
Pending Review
</h3>
Remove redundant "vs last month" text from user dashboard statistics for a cleaner presentation. This change enhances the visual clarity of the dashboard while maintaining essential information display.
2025-12-04 19:14:54 +00:00
<p className={`text-xl sm:text-2xl font-bold ${isDark ? 'text-white' : 'text-gray-900'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
{displayStats.pending_review}
</p>
</div>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
{/* All Appointments Section */}
{allAppointments.length > 0 ? (
<div className={`rounded-lg border overflow-hidden ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}>
<div className={`px-4 sm:px-5 md:px-6 py-4 border-b ${isDark ? 'border-gray-700' : 'border-gray-200'}`}>
<h2 className={`text-lg font-semibold ${isDark ? 'text-white' : 'text-gray-900'}`}>
All Appointments
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
</h2>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
<div className="overflow-x-auto">
<table className="w-full">
<thead className={`${isDark ? "bg-gray-800 border-b border-gray-700" : "bg-gray-50 border-b border-gray-200"}`}>
<tr>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Appointment
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider hidden md:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Date & Time
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider hidden lg:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Duration
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Status
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider hidden lg:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Preferred Times
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-left text-xs font-medium uppercase tracking-wider hidden xl:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Created
</th>
<th className={`px-3 sm:px-4 md:px-6 py-3 text-right text-xs font-medium uppercase tracking-wider ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Actions
</th>
</tr>
</thead>
<tbody className={`${isDark ? "bg-gray-800 divide-gray-700" : "bg-white divide-gray-200"}`}>
{allAppointments.map((appointment) => {
const getStatusColor = (status: string) => {
switch (status) {
case "scheduled":
return isDark ? 'bg-green-900/30 text-green-400' : 'bg-green-50 text-green-700';
case "pending_review":
return isDark ? 'bg-yellow-900/30 text-yellow-400' : 'bg-yellow-50 text-yellow-700';
case "completed":
return isDark ? 'bg-blue-900/30 text-blue-400' : 'bg-blue-50 text-blue-700';
case "rejected":
return isDark ? 'bg-red-900/30 text-red-400' : 'bg-red-50 text-red-700';
default:
return isDark ? 'bg-gray-700 text-gray-300' : 'bg-gray-100 text-gray-700';
}
};
const formatStatus = (status: string) => {
return status.replace("_", " ").replace(/\b\w/g, (l) => l.toUpperCase());
};
const dayNames = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
const timeSlotLabels: Record<string, string> = {
morning: 'Morning',
afternoon: 'Lunchtime',
evening: 'Evening',
};
return (
<tr
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
key={appointment.id}
className={`transition-colors cursor-pointer ${isDark ? "hover:bg-gray-700" : "hover:bg-gray-50"}`}
onClick={() => router.push(`/user/appointments/${appointment.id}`)}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
>
<td className="px-3 sm:px-4 md:px-6 py-4">
<div className="flex items-center">
<div className={`shrink-0 h-8 w-8 sm:h-10 sm:w-10 rounded-full flex items-center justify-center ${isDark ? "bg-gray-700" : "bg-gray-100"}`}>
<User className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? "text-gray-200" : "text-gray-600"}`} />
</div>
<div className="ml-2 sm:ml-4 min-w-0">
<div className={`text-xs sm:text-sm font-medium truncate ${isDark ? "text-white" : "text-gray-900"}`}>
{appointment.first_name} {appointment.last_name}
</div>
{appointment.reason && (
<div className={`text-xs sm:text-sm truncate mt-1 ${isDark ? "text-gray-400" : "text-gray-500"}`}>
{appointment.reason}
</div>
)}
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
{appointment.scheduled_datetime && (
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
<div className={`text-xs sm:hidden mt-0.5 ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
{formatDate(appointment.scheduled_datetime)}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</div>
)}
</div>
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</td>
<td className="px-3 sm:px-4 md:px-6 py-4 whitespace-nowrap hidden md:table-cell">
{appointment.scheduled_datetime ? (
<>
<div className={`text-xs sm:text-sm ${isDark ? "text-white" : "text-gray-900"}`}>
{formatDate(appointment.scheduled_datetime)}
</div>
<div className={`text-xs sm:text-sm flex items-center gap-1 ${isDark ? "text-gray-400" : "text-gray-500"}`}>
<Clock className="w-3 h-3" />
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
{formatTime(appointment.scheduled_datetime)}
</div>
</>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
) : (
<div className={`text-xs sm:text-sm ${isDark ? "text-gray-400" : "text-gray-500"}`}>
Not scheduled
</div>
)}
</td>
<td className={`px-3 sm:px-4 md:px-6 py-4 whitespace-nowrap text-xs sm:text-sm hidden lg:table-cell ${isDark ? "text-white" : "text-gray-900"}`}>
{appointment.scheduled_duration ? `${appointment.scheduled_duration} min` : "-"}
</td>
<td className="px-3 sm:px-4 md:px-6 py-4 whitespace-nowrap">
<span
className={`px-2 py-1 inline-flex text-xs leading-5 font-semibold rounded-full ${getStatusColor(
appointment.status
)}`}
>
{formatStatus(appointment.status)}
</span>
</td>
<td className={`px-3 sm:px-4 md:px-6 py-4 hidden lg:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
{appointment.selected_slots && appointment.selected_slots.length > 0 ? (
<div className="flex flex-col gap-1">
{appointment.selected_slots.slice(0, 2).map((slot, idx) => (
<span key={idx} className="text-xs sm:text-sm">
{dayNames[slot.day]} - {timeSlotLabels[slot.time_slot] || slot.time_slot}
</span>
))}
{appointment.selected_slots.length > 2 && (
<span className="text-xs">+{appointment.selected_slots.length - 2} more</span>
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
)}
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
) : (
"-"
)}
</td>
<td className={`px-3 sm:px-4 md:px-6 py-4 whitespace-nowrap text-xs sm:text-sm hidden xl:table-cell ${isDark ? "text-gray-400" : "text-gray-500"}`}>
{formatDate(appointment.created_at)}
</td>
<td className="px-3 sm:px-4 md:px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<div className="flex items-center justify-end gap-1 sm:gap-2">
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
{appointment.participant_join_url && (
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
<a
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
href={appointment.participant_join_url}
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
target="_blank"
rel="noopener noreferrer"
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
className={`p-1.5 sm:p-2 rounded-lg transition-colors ${
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
appointment.can_join_as_participant
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
? isDark
? "bg-blue-600 hover:bg-blue-700 text-white"
: "bg-blue-600 hover:bg-blue-700 text-white"
: isDark
? "text-gray-400 hover:text-gray-300 hover:bg-gray-700"
: "text-gray-500 hover:text-gray-700 hover:bg-gray-100"
}`}
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
title={appointment.can_join_as_participant ? "Join Meeting" : "Meeting Not Available"}
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
onClick={(e) => {
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
e.stopPropagation();
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
if (!appointment.can_join_as_participant) {
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
e.preventDefault();
}
}}
Refactor appointment components to replace Jitsi meeting URLs with moderator and participant join URLs. Update logic for joining meetings and copying room IDs based on user roles, enhancing clarity in the UI. Modify appointment model to support new join URL fields and permissions for moderators and participants.
2025-12-03 18:39:30 +00:00
>
<Video className="w-4 h-4" />
</a>
)}
Enhance appointment detail and user dashboard components to conditionally render meeting links and buttons based on availability. Update appointment stats fetching logic to remove email dependency, improving user experience and API interaction. Refactor UI elements for better accessibility and clarity.
2025-11-27 20:35:26 +00:00
</div>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
</td>
</tr>
);
})}
</tbody>
</table>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
</div>
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
) : !loading && (
<div className={`rounded-lg border p-4 sm:p-5 md:p-6 ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}>
<div className="flex flex-col items-center justify-center py-8 text-center">
<CalendarCheck className={`w-12 h-12 mb-4 ${isDark ? 'text-gray-500' : 'text-gray-400'}`} />
<p className={`text-lg font-medium mb-2 ${isDark ? 'text-gray-300' : 'text-gray-700'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
No Appointments
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
</p>
<p className={`text-sm mb-6 ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Refactor Booking and AppointmentDetail components to integrate new appointment scheduling format. Update time slot management to use selected_slots, enhance availability loading logic, and improve error handling. Replace legacy date and time handling with a more robust API-driven approach for better user experience and data consistency.
2025-11-27 19:18:59 +00:00
You don't have any appointments yet. Book an appointment to get started.
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
</p>
<Link href="/book-now">
<Button className="bg-gradient-to-r from-rose-500 to-pink-600 hover:from-rose-600 hover:to-pink-700 text-white">
<CalendarPlus className="w-4 h-4 mr-2" />
Add React DatePicker and styles, update package dependencies, and enhance booking validation
2025-11-26 11:42:31 +00:00
Book Appointment
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
</Button>
</Link>
</div>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
)}
{/* Account Information */}
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
{user && (
<div className={`rounded-lg border p-4 sm:p-5 md:p-6 ${isDark ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}>
<h2 className={`text-lg font-semibold mb-4 ${isDark ? 'text-white' : 'text-gray-900'}`}>
Account Information
</h2>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div className="flex items-center gap-3">
<div className={`p-2 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<User className={`w-4 h-4 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
<div>
<p className={`text-sm font-medium mb-1 ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Full Name
</p>
<p className={`text-base font-semibold ${isDark ? 'text-white' : 'text-gray-900'}`}>
{user.first_name} {user.last_name}
</p>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
<div className="flex items-center gap-3">
<div className={`p-2 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<Mail className={`w-4 h-4 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
<div>
<p className={`text-sm font-medium mb-1 ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Email
</p>
<p className={`text-base font-semibold ${isDark ? 'text-white' : 'text-gray-900'}`}>
{user.email}
</p>
</div>
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
{user.phone_number && (
<div className="flex items-center gap-3">
<div className={`p-2 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<Phone className={`w-4 h-4 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
<div>
<p className={`text-sm font-medium mb-1 ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Phone
</p>
<p className={`text-base font-semibold ${isDark ? 'text-white' : 'text-gray-900'}`}>
{user.phone_number}
</p>
</div>
</div>
)}
{user.date_joined && (
<div className="flex items-center gap-3">
<div className={`p-2 rounded-lg ${isDark ? 'bg-gray-700' : 'bg-gray-50'}`}>
<Calendar className={`w-4 h-4 ${isDark ? 'text-gray-400' : 'text-gray-600'}`} />
</div>
<div>
<p className={`text-sm font-medium mb-1 ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>
Member Since
</p>
<p className={`text-base font-semibold ${isDark ? 'text-white' : 'text-gray-900'}`}>
{formatMemberSince(user.date_joined)}
</p>
</div>
</div>
)}
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</div>
</div>
Enhance AdminSettingsPage to fetch and update user profile. Implement profile data retrieval on component mount, update form structure to include first and last name, and add validation for required fields. Improve loading indicators and error handling for profile updates. Update API integration for fetching and updating user profile data.
2025-11-25 21:25:53 +00:00
)}
Update login redirection to home page and add automatic redirect after booking submission. Enhance user flow by ensuring users are directed to the home page upon successful actions.
2025-11-07 21:27:14 +00:00
</>
)}
</main>
</div>
);
}
Reference in New Issue Copy Permalink