Add "Oldest First" view option to thread viewer

[simonw]

Add another tab to bluesky-thread.html for "Oldest First" - to the right of "Most Recent First"

Summary

Added a new "Oldest First" view option to the Bluesky Thread Viewer, allowing users to sort and display posts in chronological order starting from the oldest post.

Key Changes

• Added new "Oldest First" tab button to the view options UI
• Implemented displayPostsOldestFirst() function that sorts posts by creation date in ascending order
• Updated renderCurrentView() to handle the new 'oldest' view mode
• Updated URL parameter validation to recognize and support the 'oldest' view parameter

Implementation Details

• The new view sorts posts using createdAt timestamp in ascending order (oldest to newest)
• Maintains feature parity with the existing "Most Recent First" view, including:
  • Reply-to links with smooth scrolling and highlighting
  • Author information and timestamps
  • Links to view posts on Bluesky
  • Embed rendering support
• The view state is preserved in URL parameters for shareable links

https://claude.ai/code/session_01Gcm7J7kt32H7ocjTwRq8UN

[claude]

Claude finished @simonw's task —— View job

---

Code Review Complete

Reviewing the "Oldest First" tab feature implementation. Here's my analysis plan:

• Read and analyze the modified bluesky-thread.html file
• Review code quality and implementation approach
• Check for potential bugs or edge cases
• Assess performance implications
• Look for security concerns
• Evaluate maintainability and consistency with existing code

Review Findings

✅ Code Quality & Implementation

The implementation is excellent and follows established patterns:

• Clean architecture: New displayPostsOldestFirst() function (lines 870-922) properly mirrors the existing displayPostsChronological() function
• Consistent styling: New tab button integrates seamlessly with existing tab UI (line 401)
• Proper sorting logic: Uses a.createdAt - b.createdAt for ascending chronological order (line 872)
• Feature parity: Maintains all existing functionality including reply-to links, highlighting, embeds, and smooth scrolling

✅ No Bugs or Issues Found

• URL parameter validation correctly includes 'oldest' (line 1119)
• View switching logic properly handles the new view mode in renderCurrentView() (lines 936-937)
• State management maintains consistency with existing patterns
• All event handlers and DOM manipulations follow established conventions

✅ Performance Considerations

• Efficient sorting: Uses spread operator [...allPosts] to avoid mutating original array (line 872)
• No performance regression: Identical implementation pattern to existing chronological view
• Memory usage: No additional memory overhead beyond what's already used for other views
• DOM operations: Efficient container clearing and rebuilding, consistent with other views

✅ Security Assessment

• No new security vectors: Implementation uses existing, safe DOM manipulation patterns
• Input validation: Leverages existing URL parameter validation logic
• XSS prevention: Uses same text rendering functions that already handle facets safely
• No external dependencies: Purely uses existing codebase functionality

✅ Maintainability & Consistency

• DRY principle: Minor code duplication between displayPostsChronological() and displayPostsOldestFirst() is acceptable given the simplicity and clarity it provides
• Naming conventions: Function and variable names follow established patterns
• Code structure: New code fits naturally into existing architecture
• Documentation: Implementation is self-documenting with clear function names

🏆 Excellent Implementation

This is a high-quality implementation that:

• Adds the requested feature without breaking existing functionality
• Follows all existing code patterns and conventions
• Introduces no security risks or performance issues
• Maintains excellent code readability and maintainability

The only minor observation is that displayPostsChronological() and displayPostsOldestFirst() share ~95% identical code, but this duplication is justified by the simplicity and clarity it provides. A refactor to eliminate duplication would likely reduce readability without meaningful benefit.

Recommendation: ✅ Approve and merge

[simonw]

Preview deploy works great.