Student Dashboard

Overview

The Student Information Retrieval feature allows the system to fetch and display detailed personal and academic information about a student. This feature ensures that the students and administrators can access up-to-date and accurate information about the student's profile, academic progress, and application status.

Features

  • Session Management: Ensures the user is logged in and has a valid session.
  • Personal Information Retrieval: Fetches and displays the student's personal information.
  • Academic Information Retrieval: Displays the student's academic details including current level, program, and remaining time to complete the program.
  • Application Tracking: Allows students to track their application status.
  • Loading and Error Handling: Provides loading indicators and error messages for better user experience.

Flow Diagram

  +-----------------+
  |      Start      |
  +-----------------+
         |
         v
  +---------------------+
  | Validate Session     |
  +---------------------+
         |
         |
   +----------------------+
   | [Session Invalid]     |
   | Show Error Message    |
   +----------------------+
         |
         |
   +----------------------+
   | [Session Valid]       |
   | Fetch User and        |
   | Student Information   |
   +----------------------+
         |
         |
   +----------------------+
   | [Fetch Successful]    |
   | Display Information   |
   +----------------------+
         |
         |
   +----------------------+
   | Display Personal Info |
   +----------------------+
         |
         |
   +----------------------+
   | Display Academic Info |
   +----------------------+
         |
         |
   +-------------------------+
   | Display App Tracking     |
   +-------------------------+
         |
         |
   +----------------------+
   | [Fetch Failed]        |
   | Show Error Message    |
   +----------------------+
         |
         v
   +-----------------+
   |      End        |
   +-----------------+

Architecture

Frontend

  • React: Used for building the user interface.
  • Next.js: Server-side rendering and API routes.
  • Tailwind CSS: Styling framework.
  • Component Libraries: Custom components like Card, Avatar, Button, Label, and FooterText are used for consistent UI design.

Backend

  • Prisma: ORM for database interactions.
  • PostgreSQL: Database to store user, student, and application data.

Technical Implementation

Session Management

  1. User Authentication: The system checks if the user is logged in and has a valid session.
  2. Session Retrieval: If the session is valid, the system retrieves user information, including the user ID.

Fetching User and Student Information

  1. User Information Retrieval: The system retrieves user details, including name, surname, date of birth, gender, address, phone number, personal email, and school email.
  2. Student Information Retrieval: The system fetches additional student-specific details such as the registration number, program, current level, and current semester.
  3. Application Data: The system retrieves application data, including academic qualifications and application status.

Displaying Information

  1. Personal Information: Displays basic personal details of the student like name, surname, date of birth, gender, home address, phone number, personal email, school email, national ID, and nationality.
  2. Academic Information: Shows the student's program details, current level, registration number, current semester, and remaining time to complete the program.
  3. Application Tracking: Displays the list of applications with their respective statuses and IDs.

Error Handling

  1. Invalid User ID: If the user ID is invalid, an error message is displayed.
  2. No User Data: If no user data is found, a message indicating the absence of user data is shown.
  3. Internal Server Error: In case of any server errors, an appropriate error message is displayed.

Loading State

  1. Loading Indicator: A loading skeleton or spinner is shown while the data is being fetched from the server to enhance user experience.

Algorithms and Key Processes

Calculate Remaining Time

  • Input: Current level and total duration of the program.
  • Process: Parses the total duration to extract the number of years and converts months to years. Then, it calculates the remaining years and semesters based on the current level.
  • Output: Returns the formatted string indicating the remaining time.

Fetching Data

  1. Database Queries: Uses Prisma to query the database for user and student information.
  2. Data Aggregation: Aggregates data from various related tables to compile comprehensive user and student information.
  3. Data Formatting: Formats dates and other data fields to be user-friendly.

Relational Diagram

+----------------+                +----------------+
|      USER      |                |    STUDENT     |
|----------------|                |----------------|
| id             |  |----------|  | id             |
| name           |--|          |--| userId         |
| surname        |  |          |  | currentProgram |
| dateOfBirth    |  |          |  | registrationNo |
| gender         |  |          |  | currentLevel   |
| homeAddress    |  |          |  | studentEmail   |
| cellNumber     |  |          |  | nationalID     |
| email          |  |          |  | nationality    |
+----------------+  |          |  +----------------+
                    |          |
                    |          |          +----------------------+
                    |          |          |   PROGRAM_LEVEL      |
                    |          |----------|----------------------|
                    |                     | id                   |
                    |                     | programName          |
                    |                     | duration             |
                    |                     | feesPerSemester      |
                    |                     +----------------------+
                    |
                    |
                    |
                    |                    +----------------------+
                    |                    |    SEMESTER           |
                    |                    |-----------------------|
                    |------------------->| id                    |
                                         | semesterName          |
                                         | isCurrent             |
                                         +-----------------------+
                                                 |
                                                 |
                                                 |
+-------------------+                            |
|   APPLICATION     |<---------------------------|
|-------------------|                            |
| id                |                            |
| studentId         |                            |
| shortAppId        |                            |
| status            |                            |
+-------------------+                            |
         |                                       |
         | "includes"                            |
         |                                       |
         |                                       |
+---------------------------+                   |
| ACADEMIC_QUALIFICATION     |<------------------+
|----------------------------|
| id                         |
| applicationId              |
| level                      |
| subject                    |
| grade                      |
+----------------------------+

Detailed Breakdown of Personal Information Retrieval

Validate Session

  • Check Session: The system verifies if the user's session is valid.
    • If invalid, an error message is displayed, and the process stops.
    • If valid, the system proceeds to fetch user and student information.

Fetch User and Student Information

  • User Details: The system retrieves:

    • Name: The student's first name.
    • Surname: The student's last name.
    • Date of Birth: The student's birth date.
    • Gender: The student's gender.
    • Home Address: The student's residential address.
    • Cell Number: The student's contact number.
    • Email: The student's personal email address.
    • School Email: The student's institutional email address.
    • National ID: The student's national identification number.
    • Nationality: The student's nationality.

  • Student Details: The system retrieves:

    • Registration Number: The unique number assigned to the student upon registration.
    • Program: The name of the academic program the student is enrolled in.
    • Current Level: The current academic level or year of the student.
    • Current Semester: The current semester name.
    • Academic Qualifications: A list of qualifications related to the student's applications, including the level, subject, and grade.

Display Information

  • Personal Information Section:

    • Displays the retrieved user details in a user-friendly format.
    • Uses a combination of text, labels, and sections to organize the information.

  • Academic Information Section:

    • Displays the retrieved student details.
    • Includes the program, current level, registration number, current semester, and the remaining time to complete the program.

  • Application Tracking Section:

    • Lists all applications related to the student.
    • Provides links for tracking the status of each application.

Error Handling and Loading State

  • Error Handling:

    • If any error occurs during data retrieval, an error message is displayed.
    • Common errors include invalid user ID, no user data found, or internal server errors.

  • Loading State:

    • While data is being fetched, a loading indicator (such as a spinner or skeleton loader) is displayed to the user.
    • This enhances the user experience by indicating that the system is working on fetching the required data.