Skip to content

Commit 3fe9342

Browse files
committed
docs: update documentation for recent features and fixes
Updated various markdown documentation files to reflect recent changes, including: - Authenticated inline PDF opening and downloads. - Improved grades PDF generation with null grade handling and bimester alignment. - Filtering of all PDF reports by the current year. - Frontend architectural changes: UserContext for state management, role-based UI adaptation, and middleware for route protection. - Backend `TypeError` fix in grades PDF generation. - Updates to development workflow and testing instructions, including the adoption of Biome for frontend linting and formatting. Affected files: - `README.md` - `api/README.md` - `app/README.md` - `TESTING.md` - `.github/CONTRIBUTING.md`
1 parent 274b912 commit 3fe9342

5 files changed

Lines changed: 68 additions & 18 deletions

File tree

.github/CONTRIBUTING.md

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -74,12 +74,17 @@ We enforce a consistent code style using automated tools. Please run them before
7474
#### Frontend (TypeScript / Next.js)
7575

7676
- **Dependencies**: Managed with `npm` in `app/package.json`.
77-
- **Linting & Formatting**: We use **ESLint** with the `next/core-web-vitals` configuration. Run the linter to check for issues:
77+
- **Linting & Formatting**: We use **Biome** for linting and formatting. Run the checker to identify issues:
7878
```bash
7979
cd app/
80-
npm run lint
80+
npm run check
8181
```
82-
_We recommend integrating ESLint and a formatter like Prettier into your code editor to automatically format your code on save._
82+
To automatically fix issues, run:
83+
```bash
84+
cd app/
85+
npm run check:write
86+
```
87+
_We recommend integrating Biome into your code editor to automatically format and lint your code on save._
8388

8489
### API and Frontend Synchronization
8590

@@ -105,6 +110,7 @@ Creste tests for all that you create (if applicable). Furthermore, reste the pro
105110
cd app/
106111
npm run test
107112
```
113+
Note: `npm run test` now includes automatic formatting and linting fixes via `biome check --write`.
108114
- **End-to-End Testing**: The entire test suite (backend and frontend) can be run in a clean, containerized environment using the controller script. This is the same command our CI uses.
109115
```bash
110116
./controller.sh test
@@ -121,11 +127,11 @@ Once your changes are ready, follow these steps to submit a Pull Request.
121127
Before opening a PR, please ensure you have completed the following:
122128

123129
- [ ] All backend and frontend tests are passing (`./controller.sh test`).
124-
- [ ] The code is correctly formatted and passes all linter checks (`npm run lint`).
130+
- [ ] The code is correctly formatted and passes all linter checks (`cd app/ && npm run check:write`).
125131
- [ ] The application starts and runs without errors (`./controller.sh start`).
126132
- [ ] You have written new tests for your changes.
127133
- [ ] You have updated the [**README.md**](README.md) if you introduced changes to the interface, environment variables, or exposed ports.
128-
- [ ] You have documented significant changes in the [**NEW.md**](NEW.md) file.
134+
129135
- [ ] You have ensured that any new install or build dependencies are properly added to `pyproject.toml` or `package.json` and not left as local artifacts.
130136

131137
### Step 2: Open the Pull Request

README.md

Lines changed: 30 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,8 @@ Nginx acts as the entry point for all requests, directing them to the interface
4949

5050
The interface consumes the Backend's REST API via `axios`. Check the URLs used by the Frontend in the [`config.ts`](./app/src/config.ts) file.
5151

52+
For authenticated PDF downloads, the frontend now uses a dedicated utility (`openPdfInline`) that makes an authenticated `api.get` request to fetch the PDF content as a blob and then opens it in a new browser tab. This ensures secure access to sensitive documents.
53+
5254
Therefore, the following Frontend excerpt, on the events page
5355

5456
```ts
@@ -109,6 +111,18 @@ and, if acquiring the data, stores it in the `data` variable, so that the data c
109111

110112
The APP uses NextJS, a web framework, used in the construction of the components, together with React, as well as in the build function and to serve the static files.
111113

114+
### User Context for State Management
115+
116+
To centralize user data and roles, and to reduce redundant API calls, the application now utilizes a `UserContext`. This context provides a global state for the authenticated user's information, making it easily accessible across various components without prop drilling.
117+
118+
### Middleware for Route Protection
119+
120+
Sensitive routes and pages are protected by a Next.js middleware (`middleware.ts`). This middleware checks the user's authentication status and roles, redirecting unauthorized users or granting access based on defined permissions.
121+
122+
### Dynamic Dashboard and UserInfoCard
123+
124+
The Dashboard and `UserInfoCard` components have been rebuilt to dynamically adapt their content and functionality based on the authenticated user's role (e.g., Student, Guardian, Professor, Staff). This ensures a personalized and role-appropriate user experience.
125+
112126
### Endpoint Settings
113127

114128
The API endpoint settings are defined in [`config.ts`](./app/src/config.ts).
@@ -188,7 +202,9 @@ Follow this pattern to avoid circular imports.
188202

189203
There are functions in some serializers, which serve specific purposes, the so-called actions.
190204

191-
When data related to some model is extracted, such as the grades of a certain student, it is recommended to use an action:
205+
When data related to some model is extracted, such as the grades of a certain student, it is recommended to use an action. The PDF generation for grades, presence, academic reports, and financial reports now filters data by the current year.
206+
207+
Example of `download_grades_pdf` with improved logic:
192208

193209
```py
194210
. . .
@@ -199,11 +215,16 @@ class StudentViewSet(viewsets.ModelViewSet):
199215
student = self.get_object()
200216
subjects = get_subject_names()
201217
data = {}
218+
current_year = timezone.now().year
219+
all_grades = Grade.objects.filter(student=student, year=current_year)
220+
202221
for subject in subjects:
203-
data[subject] = Grade.objects.filter(
204-
student=student,
205-
subject__full_name=subject,
206-
)
222+
bimester_grades = [None, None, None, None]
223+
for grade in all_grades.filter(subject__full_name=subject):
224+
bimester_num = int(grade.bimester[0])
225+
if 1 <= bimester_num <= 4:
226+
bimester_grades[bimester_num - 1] = grade.value
227+
data[subject] = bimester_grades
207228
return pdfgen(
208229
"grades.html",
209230
{"student": student, "data": data},
@@ -311,7 +332,8 @@ POST /api/users/token/
311332

312333
### Frontend
313334

314-
- Login is done through the `/auth/login` route, created by the [`login.ts`](<./app/src/app/(account)/auth/login/route.ts>) file, which sends the credentials to the backend and stores the tokens in cookies:
335+
- Login is done through the `/auth/login` route, created by the [`login.ts`](<./app/src/app/(account)/auth/login/route.ts>) file, which sends the credentials to the backend and stores the tokens in cookies.
336+
- The `UserContext` manages the authenticated user's state, including roles and permissions, making this information globally available across the application.
315337
- The middleware ([`middleware.ts`](./app/src/middleware.ts)) protects sensitive routes:
316338
- As long as the cookies persist, the user will remain authenticated even (except for the expiration policy configured in the Backend and cache cleaning).
317339

@@ -391,14 +413,15 @@ Security is applied in the Backend, controlling access to each API endpoint base
391413
"academic_report",
392414
"download_academic_report",
393415
"students_needing_attention",
416+
"efficiency_analysis",
394417
]:
395418
self.permission_classes = [IsAuthenticated]
396419
else:
397420
self.permission_classes = [IsStaff]
398421
return super().get_permissions()
399422
```
400423

401-
Which defines the permission based on the action to be taken.
424+
Which defines the permission based on the action to be taken. Note that PDF generation actions (`download_grades_pdf`, `download_presence_pdf`, `download_academic_report`) are accessible to authenticated users, and these reports now filter data by the current year.
402425

403426
### User Structure
404427

TESTING.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ cd app/
3434
npm run test
3535
```
3636

37+
Note: `npm run test` now includes automatic formatting fixes via `biome check --write`.
38+
3739
## Creating Tests
3840

3941
### API

api/README.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -153,12 +153,12 @@ Authorization: Bearer <your_token>
153153
- `GET /api/students/{id}/` - Get student details
154154
- `PUT /api/students/{id}/` - Update student (staff only)
155155
- `DELETE /api/students/{id}/` - Delete student (staff only)
156-
- `GET /api/students/{id}/download-grades/` - Download student grades PDF
157-
- `GET /api/students/{id}/download-presence/` - Download student presence PDF
156+
- `GET /api/students/{id}/download-grades/` - Download student grades PDF (data filtered by current year)
157+
- `GET /api/students/{id}/download-presence/` - Download student presence PDF (data filtered by current year)
158158
- `GET /api/students/{id}/academic-report/` - Get comprehensive academic report (JSON)
159-
- `GET /api/students/{id}/download-academic-report/` - Download academic report PDF
159+
- `GET /api/students/{id}/download-academic-report/` - Download academic report PDF (data filtered by current year)
160160
- `GET /api/students/students-needing-attention/` - List students needing notifications
161-
- `GET /api/students/efficiency-analysis/?year=2025` - Get global efficiency analysis (approval & dropout rates)
161+
- `GET /api/students/efficiency-analysis/?year={year}` - Get global efficiency analysis (approval & dropout rates). The `year` parameter is optional and defaults to the current year.
162162

163163
#### Grades (Notas)
164164

@@ -219,7 +219,7 @@ Authorization: Bearer <your_token>
219219
- `DELETE /api/students/tuitions/{id}/` - Delete tuition (staff only)
220220
- `GET /api/students/tuitions/payment-history/?student_id={id}` - Get payment history
221221
- `GET /api/students/tuitions/financial-report/?student_id={id}` - Get financial report
222-
- `GET /api/students/tuitions/download-financial-report/?student_id={id}` - Download financial report PDF
222+
- `GET /api/students/tuitions/download-financial-report/?student_id={id}` - Download financial report PDF (data filtered by current year)
223223

224224
#### Enrollments (Matrículas)
225225

app/README.md

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,36 @@ The frontend is built with Next.js and contains the following pages:
1111
### Main
1212

1313
- `/`: The main page of the application.
14-
- `/dashboard`: The user's dashboard.
14+
- `/dashboard`: The user's dashboard, which dynamically adapts its content and available actions based on the authenticated user's role (Student, Guardian, Professor, Staff).
1515
- `/agenda`: The agenda page.
1616
- `/events`: The events page.
1717
- `/inbox`: The user's inbox.
1818
- `/lessons`: The lessons page.
19+
- `/week-planning`: A professor-specific page for managing weekly lesson plans.
1920
- `/about`: The about page.
2021

2122
### Authentication
2223

2324
- `/auth/login`: The login page.
2425

26+
## Key Features and Components
27+
28+
### User Context for Global State Management
29+
30+
The application leverages a `UserContext` to manage the authenticated user's data and roles globally. This approach centralizes user information, making it readily available throughout the application and reducing the need for repetitive API calls or prop drilling.
31+
32+
### Role-Based UI Adaptation
33+
34+
Several key UI components, such as the `AppSidebar`, `UserInfoCard`, and the main Dashboard, are designed to dynamically adjust their display and functionality based on the authenticated user's role. This ensures a tailored and relevant user experience for Students, Guardians, Professors, and Staff members.
35+
36+
### Authenticated PDF Handling
37+
38+
A dedicated utility (`openPdfInline`) has been implemented to securely handle PDF documents. This utility makes authenticated requests to the backend to fetch PDF content as a blob and then opens it inline in a new browser tab, providing a seamless and secure viewing experience for reports and other documents.
39+
40+
### Middleware for Route Protection
41+
42+
Next.js middleware (`middleware.ts`) is used to enforce route protection. It intercepts requests to sensitive routes, verifies the user's authentication status and role, and grants or denies access accordingly. This ensures that users can only access the parts of the application they are authorized to see.
43+
2544
## API Routes
2645

2746
The frontend also has the following API routes:

0 commit comments

Comments
 (0)