70 lines
2.9 KiB
Markdown
70 lines
2.9 KiB
Markdown
---
|
|
# nuzlocke-tracker-d68l
|
|
title: 'Frontend: Journal entry editor and list view'
|
|
status: completed
|
|
type: task
|
|
priority: normal
|
|
created_at: 2026-03-20T15:15:55Z
|
|
updated_at: 2026-03-20T15:37:39Z
|
|
parent: nuzlocke-tracker-mz16
|
|
blocked_by:
|
|
- nuzlocke-tracker-vmto
|
|
---
|
|
|
|
Create the frontend UI for writing and viewing journal entries.
|
|
|
|
## Design Decisions
|
|
- Plain markdown textarea (no WYSIWYG)
|
|
- Images via markdown URL syntax (``)
|
|
- Blank slate — no templates
|
|
- Private only (no sharing UI)
|
|
|
|
## Checklist
|
|
|
|
- [x] Add `JournalEntry` TypeScript types to `frontend/src/types/`
|
|
- [x] Create API client functions for journal CRUD
|
|
- [x] Create `JournalList` component — chronological list of entries for a run
|
|
- Show title, date, preview snippet, and linked boss (if any)
|
|
- Link each entry to its detail/edit view
|
|
- [x] Create `JournalEditor` component — markdown textarea with title input
|
|
- Optional boss result selector dropdown (link entry to a boss battle)
|
|
- Preview tab to render markdown
|
|
- Save and delete actions
|
|
- [x] Create `JournalEntryView` component — rendered markdown display
|
|
- [x] Add journal section/tab to the run detail page
|
|
- [x] Add route for journal entry detail/edit view
|
|
|
|
|
|
## Summary of Changes
|
|
|
|
Implemented the frontend journal entry editor and list view with the following components:
|
|
|
|
**Types created:**
|
|
- `frontend/src/types/journal.ts` - TypeScript types for JournalEntry, CreateJournalEntryInput, UpdateJournalEntryInput
|
|
|
|
**API client created:**
|
|
- `frontend/src/api/journal.ts` - CRUD functions for journal entries
|
|
- `frontend/src/hooks/useJournal.ts` - React Query hooks for journal data fetching and mutations
|
|
|
|
**Components created:**
|
|
- `frontend/src/components/journal/JournalList.tsx` - Chronological list of entries with title, date, preview snippet, and linked boss display
|
|
- `frontend/src/components/journal/JournalEditor.tsx` - Markdown textarea with title input, boss result selector, write/preview tabs, save/delete actions
|
|
- `frontend/src/components/journal/JournalEntryView.tsx` - Rendered markdown display with entry metadata
|
|
- `frontend/src/components/journal/JournalSection.tsx` - Wrapper component for embedding in RunEncounters page
|
|
|
|
**Pages created:**
|
|
- `frontend/src/pages/JournalEntryPage.tsx` - Standalone page for viewing/editing a single journal entry
|
|
|
|
**Modified files:**
|
|
- `frontend/src/types/index.ts` - Added journal type exports
|
|
- `frontend/src/pages/index.ts` - Added JournalEntryPage export
|
|
- `frontend/src/App.tsx` - Added route `/runs/:runId/journal/:entryId`
|
|
- `frontend/src/pages/RunEncounters.tsx` - Added Encounters/Journal tab navigation with JournalSection integration
|
|
|
|
**Features:**
|
|
- Tab navigation in run detail page to switch between Encounters and Journal views
|
|
- Create new journal entries with markdown content and optional boss battle linking
|
|
- Edit and delete existing entries
|
|
- Write/Preview toggle in editor
|
|
- Rendered markdown display with full prose styling
|