228f0ecf06
- Marked Phase 2 (Rapid Entry) and Phase 3 (Content Portability) as complete - Logged new Auto-Save functionality in Phase 4 - Updated TODO.md and module documentation to reflect current state
4.2 KiB
4.2 KiB
Aether Journals UI Update (2026)
Status: Active Last Updated: 2026-01-13 Primary Agent: Frontend SvelteKit Agent
1. Project Overview
This document outlines the modernization of the Journals module UI in the SvelteKit frontend (aether_app_sveltekit). The primary goals are to fully leverage the generic V3 API architecture and introduce high-velocity productivity features for journal management.
Context: The backend transition to the generic api_crud_v3 router is complete. Custom legacy routers have been removed. The frontend must now fully align with this pattern and provide a frictionless user experience.
2. Core Objectives
🎯 Primary Goals
- V3 API Verification: Ensure all CRUD operations utilize the generic
api_crud_v3endpoints (Verified). - Quick Add UI: Implement a specialized interface for rapid, friction-free entry creation.
- Append/Prepend UI: Allow users to quickly add text to the beginning or end of existing entries without full edit mode.
- Interop & Portability: Robust import/export logic for Markdown/HTML (Nextcloud Notes compatibility).
- Security Hardening: Review and harden client-side encryption logic.
3. Technical Architecture
Backend (Completed)
- Router:
api_crud_v3(Generic) - Definitions:
app/ae_obj_types_def.py->app/object_definitions/journals.py - Endpoints:
/v3/crud/journal/...and/v3/crud/journal_entry/...
Frontend (In Progress)
- State Management:
src/lib/ae_journals/ae_journals_stores.ts - Local Storage: Dexie.js (
db_journals) - API Client:
src/lib/api/api.ts->get_ae_obj_v3
4. Feature Specifications
⚡ Quick Add
- Component:
src/routes/journals/ae_comp__journal_entry_quick_add.svelte(New) - Placement:
- Primary: Top of the Journal List view (
src/routes/journals/+page.svelte). - Secondary: Sidebar or global hotkey (Future).
- Primary: Top of the Journal List view (
- Behavior:
- Simple
textareainput. - "Add Note" button.
- Logic: Creates a new
journal_entryattached to the active (or default) journal. Auto-setscreated_ontonow. - UX: Should not require opening a full editor modal. Optimistic UI update.
- Simple
📝 Append / Prepend
- Triggers: Buttons added to
src/routes/journals/JournalEntry_SettingsMenu.svelte. - Interaction:
- Clicking "Append" or "Prepend" opens a focused input area (inline or small modal).
- User types text -> Submits.
- Logic:
- Prepend:
New Text+\n\n+Existing Content - Append:
Existing Content+\n\n+New Text
- Prepend:
- UX: seamless update of the view without entering full "Edit Mode".
🔄 Interop (Markdown/HTML)
- Goal: Bulk export/import for data portability.
- Format: JSON container vs. Raw Markdown files.
- Integration: potential drag-and-drop zone for Nextcloud Note files.
5. Implementation Plan
Phase 1: Foundation (Done)
- Backend cleanup (remove legacy routers).
- Verify frontend uses V3 API (
ae_journals__journal.ts).
Phase 2: Rapid Entry (Complete)
- Create
ae_comp__journal_entry_quick_add.svelte. - Integrate Quick Add into
+page.svelte. - Update
ae_journals_stores.tsto manage Quick Add state/visibility.
Phase 3: Content Manipulation & Portability (Complete)
- Update
JournalEntry_SettingsMenu.sveltewith Append/Prepend actions. - Implement Append/Prepend logic in
ae_comp__journal_entry_obj_id_view.svelte. - Implement Bulk Export (Markdown/HTML/JSON) via
ae_comp__modal_journal_export.svelte. - Implement Bulk Import with Drag-and-Drop via
ae_comp__modal_journal_import.svelte.
Phase 4: Polish & Security (Active)
- Implement Auto-Save toggle and visual status indicators.
- Audit encryption flow for Quick Added and Imported entries.
- Styling and Mobile responsiveness check.
- Integrate Outbound Email sharing.
6. Reference Files
src/lib/ae_journals/ae_journals_stores.ts: State definitions.src/routes/journals/+page.svelte: Main UI container.src/routes/journals/JournalEntry_Editor.svelte: Editor logic.