Test Preparation

This commit is contained in:
Koncept Kit
2025-12-26 20:04:08 +07:00
parent 33fc3a101d
commit a6c2475092
8 changed files with 1267 additions and 32 deletions

View File

@@ -15,9 +15,12 @@ const Dashboard = () => {
const [events, setEvents] = useState([]);
const [loading, setLoading] = useState(true);
const [resendLoading, setResendLoading] = useState(false);
const [eventActivity, setEventActivity] = useState(null);
const [activityLoading, setActivityLoading] = useState(true);
useEffect(() => {
fetchUpcomingEvents();
fetchEventActivity();
}, []);
const fetchUpcomingEvents = async () => {
@@ -32,6 +35,17 @@ const Dashboard = () => {
}
};
const fetchEventActivity = async () => {
try {
const response = await api.get('/members/event-activity');
setEventActivity(response.data);
} catch (error) {
console.error('Failed to fetch event activity:', error);
} finally {
setActivityLoading(false);
}
};
const handleResendVerification = async () => {
setResendLoading(true);
try {
@@ -298,6 +312,156 @@ const Dashboard = () => {
</div>
</Card>
)}
{/* Event Activity Section */}
<div className="mt-12">
<div className="flex justify-between items-center mb-6">
<h2 className="text-3xl font-semibold text-[#422268]" style={{ fontFamily: "'Inter', sans-serif" }}>
My Event Activity
</h2>
</div>
{activityLoading ? (
<p className="text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading event activity...</p>
) : eventActivity ? (
<div className="space-y-8">
{/* Stats Cards */}
<div className="grid md:grid-cols-2 gap-6">
<Card className="p-6 bg-white rounded-2xl border border-[#ddd8eb]">
<div className="flex items-center gap-4">
<div className="bg-[#DDD8EB]/20 p-4 rounded-lg">
<Calendar className="h-8 w-8 text-[#664fa3]" />
</div>
<div>
<p className="text-sm text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Total RSVPs</p>
<p className="text-3xl font-semibold text-[#422268]" style={{ fontFamily: "'Inter', sans-serif" }}>
{eventActivity.total_rsvps}
</p>
</div>
</div>
</Card>
<Card className="p-6 bg-white rounded-2xl border border-[#ddd8eb]">
<div className="flex items-center gap-4">
<div className="bg-[#81B29A]/20 p-4 rounded-lg">
<CheckCircle className="h-8 w-8 text-[#81B29A]" />
</div>
<div>
<p className="text-sm text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Events Attended</p>
<p className="text-3xl font-semibold text-[#422268]" style={{ fontFamily: "'Inter', sans-serif" }}>
{eventActivity.total_attended}
</p>
</div>
</div>
</Card>
</div>
{/* Upcoming RSVP'd Events */}
{eventActivity.upcoming_events && eventActivity.upcoming_events.length > 0 && (
<Card className="p-6 bg-white rounded-2xl border border-[#ddd8eb]">
<h3 className="text-xl font-semibold text-[#422268] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
Upcoming Events (RSVP'd)
</h3>
<div className="space-y-3">
{eventActivity.upcoming_events.map((event) => (
<Link to={`/events/${event.id}`} key={event.id}>
<div className="p-4 border border-[#ddd8eb] rounded-xl hover:border-[#664fa3] hover:shadow-md transition-all">
<div className="flex items-start justify-between gap-4">
<div className="flex-1">
<h4 className="font-semibold text-[#422268] mb-1" style={{ fontFamily: "'Inter', sans-serif" }}>{event.title}</h4>
<p className="text-sm text-[#664fa3] mb-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{new Date(event.start_at).toLocaleDateString()} at{' '}
{new Date(event.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
</p>
<p className="text-sm text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{event.location}</p>
</div>
<Badge className={
event.rsvp_status === 'yes' ? 'bg-[#81B29A] text-white' :
event.rsvp_status === 'maybe' ? 'bg-orange-100 text-orange-700' :
'bg-gray-200 text-gray-700'
}>
{event.rsvp_status === 'yes' ? 'Going' :
event.rsvp_status === 'maybe' ? 'Maybe' : 'Not Going'}
</Badge>
</div>
</div>
</Link>
))}
</div>
</Card>
)}
{/* Past Events & Attendance */}
{eventActivity.past_events && eventActivity.past_events.length > 0 && (
<Card className="p-6 bg-white rounded-2xl border border-[#ddd8eb]">
<h3 className="text-xl font-semibold text-[#422268] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
Past Events
</h3>
<div className="space-y-3">
{eventActivity.past_events.slice(0, 5).map((event) => (
<div key={event.id} className="p-4 border border-[#ddd8eb] rounded-xl">
<div className="flex items-start justify-between gap-4">
<div className="flex-1">
<h4 className="font-semibold text-[#422268] mb-1" style={{ fontFamily: "'Inter', sans-serif" }}>{event.title}</h4>
<p className="text-sm text-[#664fa3] mb-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{new Date(event.start_at).toLocaleDateString()} at{' '}
{new Date(event.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
</p>
</div>
<div className="flex flex-col items-end gap-2">
<Badge className={event.attended ? 'bg-[#81B29A] text-white' : 'bg-gray-200 text-gray-700'}>
{event.attended ? 'Attended' : 'Did not attend'}
</Badge>
{event.attended && event.attended_at && (
<p className="text-xs text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Checked in: {new Date(event.attended_at).toLocaleDateString()}
</p>
)}
</div>
</div>
</div>
))}
</div>
{eventActivity.past_events.length > 5 && (
<p className="text-sm text-center text-[#664fa3] mt-4" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Showing 5 of {eventActivity.past_events.length} past events
</p>
)}
</Card>
)}
{/* No Events Message */}
{(!eventActivity.upcoming_events || eventActivity.upcoming_events.length === 0) &&
(!eventActivity.past_events || eventActivity.past_events.length === 0) && (
<Card className="p-12 bg-white rounded-2xl border border-[#ddd8eb]">
<div className="text-center">
<Calendar className="h-16 w-16 text-[#ddd8eb] mx-auto mb-4" />
<h3 className="text-xl font-semibold text-[#422268] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
No Event Activity Yet
</h3>
<p className="text-[#664fa3] mb-6" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Browse upcoming events and RSVP to start building your event history!
</p>
<Link to="/events">
<Button className="bg-[#DDD8EB] text-[#422268] hover:bg-white rounded-full px-6">
<Calendar className="h-4 w-4 mr-2" />
Browse Events
</Button>
</Link>
</div>
</Card>
)}
</div>
) : (
<Card className="p-12 bg-white rounded-2xl border border-[#ddd8eb]">
<div className="text-center">
<AlertCircle className="h-16 w-16 text-[#ddd8eb] mx-auto mb-4" />
<p className="text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Failed to load event activity. Please try refreshing the page.
</p>
</div>
</Card>
)}
</div>
</div>
<MemberFooter />
</div>

View File

@@ -19,7 +19,7 @@ import PaymentActivationDialog from '../../components/PaymentActivationDialog';
import ConfirmationDialog from '../../components/ConfirmationDialog';
import CreateMemberDialog from '../../components/CreateMemberDialog';
import InviteStaffDialog from '../../components/InviteStaffDialog';
import ImportMembersDialog from '../../components/ImportMembersDialog';
import WordPressImportWizard from '../../components/WordPressImportWizard';
const AdminMembers = () => {
const navigate = useNavigate();
@@ -569,7 +569,7 @@ const AdminMembers = () => {
onSuccess={fetchMembers}
/>
<ImportMembersDialog
<WordPressImportWizard
open={importDialogOpen}
onOpenChange={setImportDialogOpen}
onSuccess={fetchMembers}

View File

@@ -74,7 +74,7 @@ const AdminValidations = () => {
try {
const response = await api.get('/admin/users');
const pending = response.data.filter(user =>
['pending_email', 'pending_validation', 'pre_validated', 'payment_pending'].includes(user.status)
['pending_email', 'pending_validation', 'pre_validated', 'payment_pending', 'rejected'].includes(user.status)
);
setPendingUsers(pending);
} catch (error) {
@@ -218,12 +218,28 @@ const AdminValidations = () => {
}
};
const handleReactivateUser = async (user) => {
setActionLoading(user.id);
try {
await api.put(`/admin/users/${user.id}/status`, {
status: 'pending_validation'
});
toast.success(`${user.first_name} ${user.last_name} has been reactivated and moved to pending validation`);
fetchPendingUsers();
} catch (error) {
toast.error(error.response?.data?.detail || 'Failed to reactivate user');
} finally {
setActionLoading(null);
}
};
const getStatusBadge = (status) => {
const config = {
pending_email: { label: 'Awaiting Email', className: 'bg-orange-100 text-orange-700' },
pending_validation: { label: 'Pending Validation', className: 'bg-gray-200 text-gray-700' },
pre_validated: { label: 'Pre-Validated', className: 'bg-[#81B29A] text-white' },
payment_pending: { label: 'Payment Pending', className: 'bg-orange-500 text-white' }
payment_pending: { label: 'Payment Pending', className: 'bg-orange-500 text-white' },
rejected: { label: 'Rejected', className: 'bg-red-100 text-red-700' }
};
const statusConfig = config[status];
@@ -302,6 +318,12 @@ const AdminValidations = () => {
{pendingUsers.filter(u => u.status === 'payment_pending').length}
</p>
</div>
<div>
<p className="text-sm text-red-600 mb-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Rejected</p>
<p className="text-3xl font-semibold text-red-800" style={{ fontFamily: "'Inter', sans-serif" }}>
{pendingUsers.filter(u => u.status === 'rejected').length}
</p>
</div>
</div>
</Card>
@@ -327,6 +349,8 @@ const AdminValidations = () => {
<SelectItem value="pending_email">Awaiting Email</SelectItem>
<SelectItem value="pending_validation">Pending Validation</SelectItem>
<SelectItem value="pre_validated">Pre-Validated</SelectItem>
<SelectItem value="payment_pending">Payment Pending</SelectItem>
<SelectItem value="rejected">Rejected</SelectItem>
</SelectContent>
</Select>
</div>
@@ -384,7 +408,16 @@ const AdminValidations = () => {
</TableCell>
<TableCell>
<div className="flex gap-2">
{user.status === 'pending_email' ? (
{user.status === 'rejected' ? (
<Button
onClick={() => handleReactivateUser(user)}
disabled={actionLoading === user.id}
size="sm"
className="bg-[#81B29A] text-white hover:bg-[#6FA087]"
>
{actionLoading === user.id ? 'Reactivating...' : 'Reactivate'}
</Button>
) : user.status === 'pending_email' ? (
<>
<Button
onClick={() => handleBypassAndValidateRequest(user)}

View File

@@ -140,15 +140,17 @@ const MembersDirectory = () => {
)}
{/* Member Since */}
<div className="flex items-center justify-center gap-2 mb-4">
<Calendar className="h-4 w-4 text-[#664fa3]" />
<span className="text-sm text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Member since {new Date(member.member_since || member.created_at).toLocaleDateString('en-US', {
month: 'long',
year: 'numeric'
})}
</span>
</div>
{member.created_at && (
<div className="flex items-center justify-center gap-2 mb-4">
<Calendar className="h-4 w-4 text-[#664fa3]" />
<span className="text-sm text-[#664fa3]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Member since {new Date(member.created_at).toLocaleDateString('en-US', {
month: 'long',
year: 'numeric'
})}
</span>
</div>
)}
{/* Contact Information */}
<div className="space-y-3 mb-4">