Skip to content

feat(AR-25): redesign article viewer and article editor studio experience - #64

Merged
ar1603 merged 1 commit into
developmentfrom
amitraikwar/AR-25/article-viewer-and-editor-redesign
Sep 29, 2026
Merged

ar1603 merged 1 commit into
developmentfrom
amitraikwar/AR-25/article-viewer-and-editor-redesign

Conversation

@ar1603

@ar1603 ar1603 commented Sep 29, 2026

Copy link
Copy Markdown
Member

Jira Issue

Summary of Changes

1. Article Viewer Screen Redesign

  • Layout: Expanded reading canvas to 1700px max width for an immersive reading experience.
  • Sticky Table of Contents: Sidebar now smoothly sticks to the viewport while scrolling through articles.
  • Custom Loading Skeleton: Implemented ArticleReaderSkeleton replacing the generic website loader for instant visual feedback on article transitions.
  • Activity Tracker Removal: Deprecated and deleted StreakStalker component from the article flow.
  • Chip & Contrast Fixes: Corrected text and chip contrast across card badges.

2. Article Editor Studio Redesign

  • Modern Obsidian Studio: Overhauled /add_article29 into a distraction-free dark studio workspace.
  • Mode Switcher: Segmented toggle between + Create New and ✎ Update Existing article flows.
  • Preload Card: Search input by slug to preload article data directly for editing.
  • Collapsible Metadata: Compact card for slug, title, description, author, group, and cover image with real-time thumbnail preview.
  • Markdown Writing Workspace: Comprehensive formatting ribbon (H1-H3, Bold, Italic, Code, Blockquotes, Lists, Links, Tables, Dividers), live statistics (words, reading time), and layout mode switcher (Split, Editor, Preview).
  • Sticky Preview & Checklist: Live ArticleCard preview, 7-field publication readiness checklist, and article deletion dialog.
  • Modular Code Architecture: Broken into focused subcomponents (EditorHeader, PreloadSection, MetadataSection, MarkdownWorkspace, PublishSidebar, icons).
  • Integrity: Exact preservation of backend API interaction hooks and data models.

Testing

  • 30 test suites, 90 tests passing cleanly (npm test).
  • ESLint verified with 0 errors and 0 warnings (npm run lint).

…ence

## Summary
- Jira Issue: [AR-25](https://ar1603.atlassian.net/browse/AR-25)
- Redesigned Article Viewer screen with expanded 1700px reading layout, sticky TOC sidebar, and like interaction.
- Replaced generic website loader with custom ArticleReaderSkeleton for a seamless article reading transition.
- Removed deprecated activity tracker (StreakStalker) from articles.
- Redesigned Article Editor into modern obsidian Article Studio with segmented mode toggle (New vs Update).
- Added preloading card for editing existing articles by slug.
- Added collapsible metadata deck with live cover image preview.
- Added rich markdown formatting toolbar with instant shortcuts, live reading metrics (word count, reading time), and layout mode switcher (Split, Editor, Preview).
- Added sticky sidebar with live ArticleCard preview, publication readiness checklist, and article deletion flow.
- Refactored ArticleEditor into modular sub-components (EditorHeader, PreloadSection, MetadataSection, MarkdownWorkspace, PublishSidebar, icons).
- Preserved all data models and backend mutation/query contracts.

## Testing
- 30 test suites, 90 tests passing cleanly.
- ESLint clean with 0 errors/warnings.
@ar1603
ar1603 merged commit bc386f3 into development Sep 29, 2026
1 check passed
@codecov-commenter

Copy link
Copy Markdown

⚠️ Please install the 'codecov app svg image' to ensure uploads and comments are reliably processed by Codecov.

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

@ar1603
ar1603 deleted the amitraikwar/AR-25/article-viewer-and-editor-redesign branch September 29, 2026 15:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants