damir/pgz-sport
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CRISIS FIX: login flow + mobile responsive + token expiry handling

Browse Source 
ROOT CAUSE ISOLATED:
Backend POST /api/auth/login, GET/PUT /api/auth/me, POST avatar, POST /logout
all return 200 OK (verified curl). Damirov problem is browser-side:
stale localStorage tokens that don't match current backend → 401 cascade
→ avatar upload appears as 'failed: 401' → profile changes 'lost'.

FIXES:
1. apiAuth() in app.html now:
   - Pre-checks JWT exp claim before request
   - On 401 response: clears localStorage (pgz_access/refresh/user) +
     redirects to /login?reason=unauthorized
   - On JWT expired: redirects to /login?reason=expired

2. login.html displays toast for ?reason=expired/unauthorized

3. Mobile responsive CSS (max-width: 768px):
   - app.html: hamburger menu, sidebar slide-in, full-width drill-down panel
   - sport2.html: KPI grid 2-col, klubovi 1-col, tables horizontal scroll
   - Both: viewport meta + media queries + touch-friendly buttons

4. Mobile menu toggle button + backdrop overlay added

VERIFIED E2E (curl):
- POST /auth/login → 200 + JWT
- GET /auth/me → 200 + telefon persisted
- PUT /auth/me → 200, DB row updated
- POST /auth/me/avatar → 200, file saved + avatar_url returned
- POST /auth/logout → 200, token revoked (next /me returns 401)
This commit is contained in:
Damir Radulić
2026-05-05 09:14:46 +02:00
parent 31e0374465
commit 8e136351f9
27 changed files with 2323 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/sport_3d.html
+2 -1
View File
@@ -160,6 +160,7 @@ input:focus, select:focus { outline: none; border-color: var(--accent); }
@keyframes spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.show { display: block !important; }
</style>
<script src="/static/oib_format.js" defer></script>
</head>
<body>
@@ -395,7 +396,7 @@ async function handleNodeClick(n) {
function renderKlubDetail(d) {
const k = d.klub || {};
let html = `
<div class="field"><span>OIB</span><b>${k.oib || '—'}</b></div>
<div class="field"><span>OIB</span><b>${k.oib?formatOib(k.oib,{klub_id:k.id,savez_id:k.savez_id}):'—'}</b></div>
<div class="field"><span>Sport</span><b>${k.sport || '—'}</b></div>
<div class="field"><span>Grad</span><b>${k.grad || '—'}</b></div>
<div class="field"><span>Adresa</span><b>${k.adresa || '—'}</b></div>