data layer and API integration

Two modes, one w prop. Real mode is jsjiit WebPortal through a CORS proxy. Demo mode is MockWebPortal plus src/assets/fakedata.json.

Related: Application Structure & Authentication, State Management Strategy.

flowchart TD
  App["App.jsx"] --> Real["realPortal = new WebPortal"]
  App --> Mock["mockPortal = new MockWebPortal"]
  Real --> Opt["useProxy true"]
  Opt --> Proxy["https://jportal-cors-proxy.onrender.com"]
  Demo{"isDemoMode"} -->|false| Real
  Demo -->|true| Mock
  Real --> W["AuthenticatedApp w"]
  Mock --> W

Import:

import { WebPortal, LoginError } from
  "https://cdn.jsdelivr.net/npm/[email protected]/dist/jsjiit.esm.js";

MockWebPortal also has get_fee_summary and get_fines_msc_charges. No UI calls those yet.

sequenceDiagram
  participant Login
  participant WP as WebPortal
  participant Proxy as onrender CORS proxy
  participant JIIT as JIIT portal

  Login->>WP: student_login
  WP->>Proxy: encrypted login
  Proxy->>JIIT: same request
  JIIT-->>WP: session
  WP-->>Login: session set

1. Login submits enrollment and password.
2. w.student_login runs.
3. Credentials land in localStorage.
4. WebPortal.session holds headers used later (marks PDF fetch).

Auto-login uses realPortal only.

LoginError messages:

• portal temporarily unavailable
• Failed to fetch
• generic credential failure (toast in Login)

flowchart TD
  Class["MockWebPortal"] --> Sess["session.get_headers empty"]
  Class --> Fake["import fakedata.json"]
  Class --> Methods["same method names as WebPortal"]

Constructor:

this.session = { get_headers: async () => ({}) };

get_attendance_meta reorders semesters by month. Jan–July prefers EVESEM. Aug–Dec prefers ODDSEM. latest_semester() is the first after that sort.

Lookups use registration_code or event id keys into fakeData.

flowchart TD
  subgraph Real
    R1["stored creds"] --> R2["realPortal.student_login"]
    R2 --> R3["isAuthenticated true isDemoMode false"]
  end
  subgraph Demo
    D1["Try Demo"] --> D2["handleDemoLogin"]
    D2 --> D3["isAuthenticated true isDemoMode true"]
  end

Demo has no auto-login.

flowchart TD
  Mount["useEffect"] --> Call["await w.method"]
  Call --> Set["parent setter cache"]
  Set --> Render["UI"]

Attendance: get_attendance_meta then get_attendance(meta.latest_header(), meta.latest_semester()).

Grades: get_sgpa_cgpa, get_semesters_for_grade_card, get_grade_card, get_semesters_for_marks, and either download_marks (demo) or Pyodide PDF parse (real).

Components never branch on mock vs real except Grades marks, which checks w instanceof MockWebPortal.

flowchart TD
  JSON["src/assets/fakedata.json"] --> Att["attendance"]
  JSON --> Gr["grades"]
  JSON --> Sub["subjects"]
  JSON --> Ex["exams"]
  JSON --> Pr["profile"]
  JSON --> Fees["fees"]

Attendance: semestersData, attendanceData keyed by "2025EVESEM", subjectAttendanceData keyed by individualsubjectcode.

Grades: gradesData, gradeCardSemesters, gradeCards, marksSemesters, marksData.

Subjects: semestersData, subjectData, choiceSubjects.

Exams: examSemesters, examEvents, examSchedule.

Profile: get_personal_info() returns fakeData.profile (generalinformation, qualification, optional photo).

const [attendanceData, setAttendanceData] = useState({});

Keys are registration_id. Skip fetch when the key exists.

Persisted across sessions: credentials and attendanceGoal only. Academic payloads stay in memory.

1. Portal down. LoginError with “temporarily unavailable”.
2. Network. message includes “Failed to fetch”.
3. Bad credentials. toast “Login failed. Please check your credentials.”

Try Demo still works when JIIT is down.

1. Features talk to w, not to fetch URLs.
2. jsjiit 0.0.27 plus CORS proxy for production data.
3. MockWebPortal mirrors the method names above.
4. Caches live on AuthenticatedApp.
5. Stats are a separate path. TanStack Query posts to /api/analytics.