Skip to content

feat: admin-ui UX pass — tooltips, session-expiry redirect, empty states#23

Merged
jlc488 merged 1 commit into
mainfrom
feat/admin-ui-ux
Jun 3, 2026
Merged

feat: admin-ui UX pass — tooltips, session-expiry redirect, empty states#23
jlc488 merged 1 commit into
mainfrom
feat/admin-ui-ux

Conversation

@jlc488

@jlc488 jlc488 commented Jun 3, 2026

Copy link
Copy Markdown
Contributor

A usability pass on the admin console, from issues hit while operating it.

Action tooltips

Every icon-only action button now shows a hover tooltip (PrimeVue Tooltip directive, mirroring the existing aria-labels) — on every list page's row actions and the header. No more guessing what each icon does.

Session-expiry → login

The JWT exp is now honored. An expired token is treated as logged-out, so:

  • the router guard bounces the user to /login with a "session expired" notice (instead of leaving them on pages that silently 403);
  • the axios interceptor handles 401 and 403-from-an-expired-token. A genuine 403 (valid token, missing permission) is left alone so the view can show "no permission".

(Background: the kit returns 403 for an expired/anonymous token, so a status-only check wasn't enough — the client now decodes exp.)

Empty states

A reusable EmptyState (icon + message) replaces the bare "no results" line on the Users / Roles / Permissions / Groups / Menus lists.

Admin-ui only — no backend change. Built green (vue-tsc + vite).


요약 (한국어)

  • 액션 툴팁: 아이콘만 있던 모든 행 액션 버튼에 호버 툴팁(무엇을 하는지 바로 보임).
  • 세션 만료 → 로그인: JWT exp 인식 → 만료 토큰은 로그아웃 취급, 가드/인터셉터가 로그인으로 보냄("세션 만료" 안내). 정상 403(권한 없음)은 그대로 둠.
  • 빈 상태: 재사용 EmptyState(아이콘+메시지)로 리스트 빈 화면 개선.

백엔드 변경 없음, 빌드 그린.

…pty states

Three usability fixes raised while operating the console:

- **Action tooltips.** Every icon-only action button now shows a hover tooltip
  (PrimeVue Tooltip directive, mirroring the existing aria-labels) across all
  list pages + the header — so the row actions are no longer guesswork.
- **Session-expiry → login.** The JWT `exp` is now honored: an expired token is
  treated as logged-out, so the router guard bounces the user to the login screen
  (with a "session expired" notice) instead of leaving them on pages that silently
  403. The axios interceptor also handles 401 and 403-from-an-expired-token; a
  genuine 403 (valid token, missing permission) is left alone.
- **Empty states.** A reusable EmptyState component (icon + message) replaces the
  bare "no results" line on the Users/Roles/Permissions/Groups/Menus lists.

Built green (vue-tsc + vite). Admin-ui only — no backend change.
@jlc488 jlc488 merged commit a8a49c6 into main Jun 3, 2026
3 checks passed
@jlc488 jlc488 deleted the feat/admin-ui-ux branch June 3, 2026 11:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant