Port: notes list page from playground #70

Closed
opened 2026-03-27 21:14:32 +00:00 by forgejo_admin · 3 comments

Type

Feature

Lineage

Depends on #68 (CSS + sidebar foundation). Part of SvelteKit port pipeline.

Repo

forgejo_admin/pal-e-app

User Story

As a reader, I want a filterable notes list with type-colored cards, so I can browse and find notes by type.

Context

Restyle src/routes/notes/+page.svelte to match ~/pal-e-docs-playground/notes.html. The notes list page already exists with filtering — this is a restyle to match the playground design, not greenfield. Data fetching uses client-side onMount, not SvelteKit load functions — no +page.ts needed.

File Targets

  • src/routes/notes/+page.svelte — restyle existing notes list with filter bar and type-colored cards to match playground

Acceptance Criteria

  • Notes list layout matches playground notes.html
  • Filter bar functional (filter by note type)
  • Type-colored cards render correctly
  • App builds without errors

Test Expectations

  • Run command: cd ~/pal-e-app && npm run build

Constraints

  • Copy playground HTML literally, swap data bindings.
  • This is a restyle of an existing page, not a new route.
  • Depends on #68 being merged first.

Checklist

  • Page restyled
  • Filters still functional
  • Build passes
  • forgejo_admin/pal-e-app#68 — foundation (dependency)
  • board-pal-e-docs — project board
### Type Feature ### Lineage Depends on #68 (CSS + sidebar foundation). Part of SvelteKit port pipeline. ### Repo `forgejo_admin/pal-e-app` ### User Story As a reader, I want a filterable notes list with type-colored cards, so I can browse and find notes by type. ### Context Restyle `src/routes/notes/+page.svelte` to match `~/pal-e-docs-playground/notes.html`. The notes list page already exists with filtering — this is a restyle to match the playground design, not greenfield. Data fetching uses client-side `onMount`, not SvelteKit load functions — no `+page.ts` needed. ### File Targets - `src/routes/notes/+page.svelte` — restyle existing notes list with filter bar and type-colored cards to match playground ### Acceptance Criteria - [ ] Notes list layout matches playground notes.html - [ ] Filter bar functional (filter by note type) - [ ] Type-colored cards render correctly - [ ] App builds without errors ### Test Expectations - Run command: `cd ~/pal-e-app && npm run build` ### Constraints - Copy playground HTML literally, swap data bindings. - This is a restyle of an existing page, not a new route. - Depends on #68 being merged first. ### Checklist - [ ] Page restyled - [ ] Filters still functional - [ ] Build passes ### Related - `forgejo_admin/pal-e-app#68` — foundation (dependency) - `board-pal-e-docs` — project board
Author
Owner

Scope Review: NEEDS_REFINEMENT

Review note: review-472-2026-03-27

Two issues found:

  • src/routes/notes/+page.ts does not exist — app uses client-side fetching via onMount. Remove from file targets.
  • Page already exists with type-colored cards and filter bar. This is a restyle, not greenfield — ticket should note existing state.
## Scope Review: NEEDS_REFINEMENT Review note: `review-472-2026-03-27` Two issues found: - `src/routes/notes/+page.ts` does not exist — app uses client-side fetching via `onMount`. Remove from file targets. - Page already exists with type-colored cards and filter bar. This is a restyle, not greenfield — ticket should note existing state.
Author
Owner

Issue body updated per scope review corrections.

Issue body updated per scope review corrections.
Author
Owner

This issue was already implemented by PR #77 (commit 098260a, merged to main).

All acceptance criteria are met on current main:

  • Notes list layout matches playground notes.html (flat .note-card list with .note-card-row, badges, relative time)
  • Filter bar functional with dynamic type pills and URL-synced note_type param
  • Type-colored badge classes for all note types (badge--sop, badge--convention, badge--doc, badge--project, badge--board, etc.)
  • App builds without errors (npm run build passes)

Closing as already complete.

This issue was already implemented by PR #77 (commit 098260a, merged to main). All acceptance criteria are met on current main: - Notes list layout matches playground `notes.html` (flat `.note-card` list with `.note-card-row`, badges, relative time) - Filter bar functional with dynamic type pills and URL-synced `note_type` param - Type-colored badge classes for all note types (`badge--sop`, `badge--convention`, `badge--doc`, `badge--project`, `badge--board`, etc.) - App builds without errors (`npm run build` passes) Closing as already complete.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
forgejo_admin/pal-e-docs-app#70
No description provided.