Refactor/abstraction

[EduTiyo]

Summary

This PR decomposes the large monolithic route components (ProjectListPage.tsx and ProjectEditorPage.tsx) as well as App.tsx into decoupled custom hooks and specialized presentation components.

Overall, this reduces the line count of the main route views by 80% (from 1,356 down to 268 lines), strictly separating business logic and side effects from UI presentation while preserving 100% of existing behavior, styling, and internationalization.

---

Overview of Line Reductions

View	Before	After	Change
ProjectListPage.tsx	822 lines	174 lines	-79%
ProjectEditorPage.tsx	534 lines	94 lines	-82%
Combined Routes	1,356 lines	268 lines	-80%

---

Key Changes

1. App Shell Decomposition (App.tsx)

• Extracted Header, ThemeToggle, and UnsavedChangesDialog.
• Inverted control: Header now communicates navigation requests via an onBack callback prop, while UnsavedChangesDialog properly executes onClose and onConfirm, decoupling them from root navigation state.

2. Project List Modularization (ProjectListPage.tsx)

• Custom Hooks:
  • useProjectList: Encapsulates project queries, search filtering, project duplication (with ID remapping), deletion, workspace importing, and group mutations.
  • useProjectShortcuts: Isolates numbered shortcut calculation (⌘1–⌘9 / Ctrl+1..9) and registers global keydown listeners.
• Presentation Components (src/components/projects/):
  • ProjectListHeader: Top actions bar with search input and creation/import buttons.
  • ProjectTable: Reusable data table with project selection, status badges, and action dropdowns.
  • ProjectGroupSection: Collapsible group and ungrouped project containers.
  • BatchActionBar: Fixed bottom toolbar for bulk actions (Launch selected, Group selected).
  • DeleteProjectDialog: Standalone project deletion confirmation modal.
  • EmptyProjectsState: Dedicated views for empty project lists and zero search results.

3. Project Editor Modularization (ProjectEditorPage.tsx)

• Custom Hook:
  • useProjectEditor: Manages project loading with fallback sanitization, dirty state tracking against initial payload, ⌘S shortcut listener, folder operations (with terminal ID healing), and split terminal management.
• Presentation Components (src/components/editor/):
  • ProjectBasicInfoSection: Name, Group, and target IDE selection with macOS Terminal permissions notice.
  • ProjectFoldersSection: Folder list with auto-detect trigger and directory deletion.
  • WorkspacePreviewSection: Expandable workspace script / JSON preview block.
  • EditorBottomBar: Fixed action footer for saving and launching.

---

Verification & Testing

• Typecheck: npx tsc --noEmit passed with 0 errors.
• Production Build: npm run build completed successfully.
• Backend Tests: cargo test --workspace passed cleanly.