Skip to content

refactor: simplify GitHub integration UI and reorganize components - #137

Merged
norberia merged 6 commits into
mainfrom
refactor/simplify-github-integration
Mar 5, 2026
Merged

refactor: simplify GitHub integration UI and reorganize components#137
norberia merged 6 commits into
mainfrom
refactor/simplify-github-integration

Conversation

@norberia

@norberia norberia commented Mar 5, 2026

Copy link
Copy Markdown
Collaborator

Description

Overview

This refactor simplifies the GitHub integration UI, improves the settings page navigation structure, and moves route-specific components to their proper directories.

Key Changes

1. Redesigned GitHub Integration Card

  • Changed layout from vertical to horizontal (left-right) structure for better visual hierarchy
  • Simplified code logic, reducing ~77 lines (from 237 to 160 lines)
  • Improved status display and user interaction experience

2. Added Settings Page Sidebar Navigation

  • Added SettingsSidebar component with nested routing support
  • Split settings into separate pages:
    • General - General settings
    • Integrations - Integration management (GitHub, etc.)
  • Improved extensibility of the settings page

3. Component Directory Reorganization

  • Moved project-related dialog components to route-specific directories:
    • create-project-dialog.tsx → app/(dashboard)/projects/_components/
    • import-github-dialog.tsx → app/(dashboard)/projects/_components/
    • search-bar.tsx → app/(dashboard)/projects/_components/
  • Follows Next.js project conventions using _components/ directory for route-specific components

4. Fixed Dialog Overflow Issue

  • Fixed DialogContent style overflow in import-github-dialog

File Changes

Type Count
Added 4
Modified 6
Deleted 1
Net Lines Changed -10 lines

Testing Checklist

  • GitHub integration card displays and interacts correctly
  • Settings page sidebar navigation works properly
  • Create project dialog functions correctly
  • Import GitHub repository dialog functions correctly
  • Search bar functions correctly

norberia added 6 commits March 5, 2026 14:19
- Simplify GitHubStatusCard to single card with two states (connected/not connected)
- Remove redundant GitHub App Installations section
- Move GitHubStatusCard to route-specific _components/ directory
- Add component organization guidelines to CLAUDE.md
- Add SettingsSidebar component with Integrations and Account menu items
- Create /settings/integrations route with GitHub integration content
- Add shared layout.tsx for settings pages
- Redirect /settings to /settings/integrations
- Move page header to individual pages for flexibility
- Add left section with title, description, and GitHub logo card
- Add right section with integration explanation and action area
- Show green checkmark on logo when connected
- Display user avatar and connected status in connected state
- Show Connect to GitHub button in disconnected state
- Move card wrapper to parent page component
- Add GitHub Integration title inside the item
- Fix capitalization: fulling -> Fulling
- Remove redundant section heading from integrations page
- Add min-w-0 to prevent flex container overflow
- Simplify repo button layout structure
- Increase DialogContent max-width from max-w-lg to max-w-2xl
- Add whitespace-nowrap to Private badge to prevent wrapping
- Move create-project-dialog.tsx from components/dialog/ to app/(dashboard)/projects/_components/
- Update import paths in search-bar.tsx and create-project-card.tsx
- Remove now-empty import-github-dialog.tsx from components/dialog/
- Keep settings-dialog.tsx in components/dialog/ as it's used across multiple routes

This follows the component organization convention:
- Route-specific components (used only within projects/*) -> _components/
- Shared components (used across multiple routes) -> components/
@github-actions

github-actions Bot commented Mar 5, 2026

Copy link
Copy Markdown

✅ PR Check Results: Passed

Build Checks

Check Status
Lint & Build ✅ Passed
Docker Build ✅ Passed

✨ Great work!

All checks passed successfully. Your PR is ready for review.

Details:

  • ✅ Code quality verified (linting passed)
  • ✅ Build successful
  • ✅ Docker image build verified (linux/amd64)
    Commit: 5516cb0106b343f1d9ab514be1fb5f940c486a6b
    Branch: refactor/simplify-github-integration

🔗 View Details:

@norberia
norberia merged commit d4bb220 into main Mar 5, 2026
9 checks passed
@norberia
norberia deleted the refactor/simplify-github-integration branch March 5, 2026 14:59
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.

1 participant