akai-org / akai-org/put-wiki

User's public profile page

Aberta
#106 0 comentários 0 reações 1 responsável Reivindicada por @Anto-glitch Ver no GitHub
area:frontend type:task
Linguagem predominante
TypeScript
Estrelas
6
Forks
3
Merge médio
3d 17h
PRs com merge (30d)
15

Descrição

## 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.

Guia de contribuição

Abrir o guia de contribuição

Direção de pesquisa

Start by reviewing the linked Figma designs and the existing PutWiki frontend structure; coordinate with backend developers on API details. Use MSW for the stubbed user data and add Storybook stories for the page, loading state, error state, and custom logical components. Done means the responsive public URL renders nickname and a readable joined date with loading and error handling.

Escrita pelo modelo de indexação a partir do texto da issue.

Avaliação

Stack de tecnologia
react, storybook, typescript
Domínio
design, frontend, testing
Tipo de issue
Funcionalidade
Dificuldade
5/5
Tempo estimado
Mais de uma semana
Status de atividade
Pouca atividade
Clareza
Razoavelmente clara
Facilidade para iniciantes
35/100

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.