Add detailed API: - Complete API documentation for In Format Usage flow diagrams for authentication and booking processes - Comprehensive endpoint descriptions with request/response examples - Detailed authentication and booking flow explanations - Structured documentation for health checks, authentication, and booking endpoints -: - Includes JWT authentication details usage - Provides clear API usage patterns for users and clients and administrators system interactions - Enhances project documentation with provides clear, structured API reference - Improves developer and user understanding of system capabilities
6.3 KiB
Meeting Join Implementation Guide
Overview
This guide explains how to properly implement the meeting join functionality with personalized user information and admin differentiation.
Issues Addressed
- Name Prepopulation: Users now join meetings with their actual name instead of "Booking ID"
- Admin Differentiation: Admin users get special moderator privileges in the meeting
- Personalized Links: Each user gets a personalized meeting URL with their display name
API Endpoint
GET /api/meetings/:id/link
Returns a personalized meeting link for the authenticated user.
Authentication: Required (JWT token)
Parameters:
id(path parameter): The booking ID
Response (200 OK):
{
"booking_id": 123,
"meeting_url": "https://meet.jit.si/booking-123-1234567890-abc123#userInfo.displayName=\"John Doe\"",
"display_name": "John Doe",
"is_admin": false,
"scheduled_at": "2024-01-15T10:00:00Z",
"duration": 60,
"status": "scheduled"
}
Error Responses:
400 Bad Request: Invalid booking ID401 Unauthorized: User not authenticated403 Forbidden: User doesn't have permission to access this meeting404 Not Found: Booking not found or meeting link not available
Frontend Implementation
Step 1: Fetch Personalized Meeting Link
Instead of using the jitsi_room_url directly from the booking response, call the new endpoint:
// When user clicks "Join Meeting" button
async function joinMeeting(bookingId) {
try {
const response = await fetch(`/api/meetings/${bookingId}/link`, {
headers: {
'Authorization': `Bearer ${userToken}`
}
});
if (!response.ok) {
throw new Error('Failed to get meeting link');
}
const data = await response.json();
// Open the personalized meeting URL
window.open(data.meeting_url, '_blank');
// Optionally show user info
console.log(`Joining as: ${data.display_name}`);
console.log(`Admin privileges: ${data.is_admin}`);
} catch (error) {
console.error('Error joining meeting:', error);
alert('Failed to join meeting. Please try again.');
}
}
Step 2: Update Booking Display Component
function BookingCard({ booking }) {
const handleJoinMeeting = async () => {
try {
const response = await fetch(`/api/meetings/${booking.id}/link`, {
headers: {
'Authorization': `Bearer ${localStorage.getItem('token')}`
}
});
const data = await response.json();
window.open(data.meeting_url, '_blank');
} catch (error) {
console.error('Error:', error);
}
};
return (
<div className="booking-card">
<h3>Booking #{booking.id}</h3>
<p>Scheduled: {new Date(booking.scheduled_at).toLocaleString()}</p>
<p>Duration: {booking.duration} minutes</p>
{booking.status === 'scheduled' && booking.jitsi_room_url && (
<button onClick={handleJoinMeeting}>
Join Meeting
</button>
)}
</div>
);
}
How It Works
For Regular Users
- User calls
/api/meetings/:id/linkwith their JWT token - Backend verifies the user owns the booking
- Backend generates a personalized Jitsi URL with the user's name:
https://meet.jit.si/room-id#userInfo.displayName="John Doe" - User joins the meeting with their name pre-filled
For Admin Users
- Admin calls
/api/meetings/:id/linkwith their JWT token - Backend verifies admin status (can access any booking)
- Backend generates a personalized Jitsi URL with admin privileges:
https://meet.jit.si/room-id#userInfo.displayName="Dr. Smith"&config.startWithAudioMuted=false&config.startWithVideoMuted=false - Admin joins with moderator privileges and audio/video enabled by default
Display Name Logic
The system determines the display name in this order:
- First Name + Last Name: If both are available
- Email: If name fields are empty
- Fallback: Uses email as last resort
Security Considerations
- Authentication Required: All meeting link requests require valid JWT token
- Authorization Check:
- Regular users can only access their own bookings
- Admin users can access any booking
- No Direct URL Sharing: The personalized URL includes user-specific information
- Token Expiration: JWT tokens expire, requiring re-authentication
Migration Notes
Existing Code
If your frontend currently uses:
// OLD WAY - Don't use this anymore
<a href={booking.jitsi_room_url} target="_blank">Join Meeting</a>
Updated Code
Change to:
// NEW WAY - Use the API endpoint
<button onClick={() => joinMeeting(booking.id)}>Join Meeting</button>
Testing
Test as Regular User
- Login as a regular user
- Create a booking
- Call
/api/meetings/{booking_id}/link - Verify the response includes your name in the URL
- Open the URL and confirm your name appears in Jitsi
Test as Admin
- Login as admin
- Get any booking ID
- Call
/api/meetings/{booking_id}/link - Verify
is_admin: truein response - Open the URL and confirm moderator privileges
Test Authorization
- Try to access another user's booking as a regular user
- Should receive
403 Forbiddenerror - Admin should be able to access any booking
Troubleshooting
Issue: Name shows as "Booking ID"
Solution: Ensure you're using the new /api/meetings/:id/link endpoint instead of the raw jitsi_room_url
Issue: Admin doesn't have moderator privileges
Solution: Verify the user's is_admin field is set to true in the database
Issue: 403 Forbidden error
Solution: Regular users can only access their own bookings. Verify the booking belongs to the authenticated user.
Issue: Meeting URL not available
Solution: The booking might not have a Jitsi room created yet. This can happen if payment hasn't been completed or if there was an error during booking creation.
Future Enhancements
Potential improvements for the future:
- Waiting Room: Add a waiting room for participants before admin joins
- Recording Control: Give admin ability to start/stop recording
- Participant Limits: Enforce maximum participant limits
- Custom Branding: Add custom Jitsi branding for the therapy practice
- Meeting Analytics: Track join times, duration, and participant count