akai-org / akai-org/put-wiki

User's public profile page

Aperta
#106 0 commenti 0 reazioni 1 assegnatario Rivendicata da @Anto-glitch Vedi su GitHub
area:frontend type:task
Lingua principale
TypeScript
Stelle
6
Fork
3
Merge medio
3g 17h
PR unite (30g)
15

Descrizione

## Summary
Implement a public user profile page for the PutWiki frontend. This page serves as a read only view of a user, displaying only non-sensitive information (nickname, joined date). It must be accessible by a user-friendly URL.

## Acceptance criteria
- [ ] The page is accessible via a user-friendly URL structure (e.g. `/user/{nickname}` if nicknames are unique).
- [ ] The page successfully renders the user's nickname, and joined date (formatted in readable way, e.g. joined June 2026).
- [ ] The profile layout adapts correctly to both mobile and desktop screens.
- [ ] If the data is being fetched, display a loading skeleton. If there are errors display error components. Use suspense and error boundaries.
- [ ] Implement mocked API calls (functions returning a stubbed user object) that can easily be swapped for a real API call later (use MSW). Contact with backend devs for API details

## Notes
- See figma designs for a reference about profile layout: ([1](https://www.figma.com/design/JANE25uq5sdrAuEM3viKVa/Untitled?node-id=19-2&t=F8jrTfz2ZpcUnPqg-0), [2](https://www.figma.com/design/0kVFdH1uo5CECYEVP1jHkg/AKAI-PROJECT?node-id=0-1&p=f&t=CbXxBzKKHDynCPzZ-0)). Utilize existing color palette, typography and avoid hardcoding tailwind styles (e.g. not using tailwind design tokens, but absolute units). Try to compose components starting from shadcn.
- Because this is a UI-centric page please add a storybook story for this page showing the loading, and error states and separate stories for custom components with logic that you made. Unit tests (vitest, react testing library) are recommended for ensuring that for example date formatting logic works correctly.

**I highly recommend implementing it in parts** and submitting separate pull requests to make code review easier.

Guida per i contributori

Apri la guida per i contributori

Valutazione

Questa issue non è ancora stata valutata.

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.