React + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

• @vitejs/plugin-react uses Babel (or oxc when used in rolldown-vite) for Fast Refresh
• @vitejs/plugin-react-swc uses SWC for Fast Refresh

React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.

Expanding the ESLint configuration

If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the TS template for information on how to integrate TypeScript and typescript-eslint in your project.

---

Recent Development: Notification System API

02.11.2025

API Endpoint

Endpoint: GET /api/notifications

Authentication

The API accepts authentication via:

• Bearer Token: Sent in Authorization header as Bearer {token}
• Basic Auth: If no token is available, uses username/password via Basic Authentication

Request Parameters

• userId (required): The user ID for which to fetch notifications
• part (optional): Pagination parameter. Omit for first page, send part=2, part=3, etc. for subsequent pages

API Response Format

The API should return a JSON object with the following structure:

{
  "1": {
    "name": "system",
    "content": "Welcome !{user}!",
    "time": 1762097520,
    "read": false,
    "type": "alrt",
    "colour": "RED"
  },
  "2": {
    "name": "friend request",
    "content": "RAM send you friend request",
    "time": 1762097520,
    "read": false
  },
  "end": true
}

Field Descriptions:

• Keys ("1", "2", etc.): Numeric keys representing notification IDs
• name: The notification source/type (e.g., "system", "friend request")
• content: The notification message. Supports !{user} placeholder which will be replaced with the actual username
• time: Unix timestamp (seconds since epoch)
• read: Boolean indicating if the notification has been read
• type (optional): Notification type, e.g., "alrt" for alerts
• colour (optional): Color indicator, e.g., "RED" for important alerts
• end: Boolean flag. true means no more notifications available, false means more pages exist

Files Handling API Calls

src/api/notifications.js

This file contains the fetchNotifications() function that:

• Makes API requests to /api/notifications endpoint
• Handles authentication (token or Basic Auth)
• Supports pagination via part parameter
• Provides fake data for development user "itsjhon"
• Returns default welcome message if API returns empty data or on error
• Replaces !{user} placeholder in notification content with actual username

Function Signature:

fetchNotifications(userId, token = null, password = null, part = 1)

Pagination

• First page: No part parameter needed (or part=1)
• Subsequent pages: Send part=2, part=3, etc.
• Check end flag in response to determine if more pages exist

Default Welcome Message

If the API returns empty data or an error occurs, the system automatically provides a default welcome notification for new users (except fake users).

---