[Refactoring] Extract Astrolabe App.vue into smaller components

[cbcoutinho]

Context

From PR #401 code review - Low priority code quality improvement.

Problem

third_party/astrolabe/src/App.vue is a large monolithic component that could benefit from being broken into smaller, more maintainable pieces.

Suggested Refactoring

Extract logical sections into separate Vue components:

Potential Components:

1. LoginForm.vue - OAuth login UI and flow
2. UserProfile.vue - Display user info after login
3. ApiExplorer.vue - MCP server status and endpoint testing
4. StatusIndicator.vue - Connection status display

Benefits:

• Improved maintainability
• Better code organization
• Easier testing of individual components
• Reusable components
• Follows Vue.js best practices

Example Structure:

src/
├── App.vue (main container, routing)
├── components/
│   ├── LoginForm.vue
│   ├── UserProfile.vue
│   ├── ApiExplorer.vue
│   └── StatusIndicator.vue

References

• File: third_party/astrolabe/src/App.vue
• Related to PR feat(astrolabe): Nextcloud app UI with PDF viewer, webhooks, and OAuth refresh #401 code review
• Vue.js Component Best Practices: https://vuejs.org/guide/components/basics.html

Priority

Low - Code quality improvement, no functional impact

Notes

• Should maintain existing functionality
• Consider adding component tests during refactoring