feat: gitLab Integration Implementation / github refactor / overal improvements (#1963)

* Add GitLab integration components

Introduced PushToGitLabDialog and GitlabConnection components to handle GitLab project connections and push functionality. Includes user authentication, project handling, and UI for seamless integration with GitLab.

* Add components for GitLab connection and push dialog

Introduce `GitlabConnection` and `PushToGitLabDialog` components to handle GitLab integration. These components allow users to connect their GitLab account, manage recent projects, and push code to a GitLab repository with detailed configurations and feedback.

* Fix GitLab personal access tokens link to use correct URL

* Update GitHub push call to use new pushToRepository method

* Enhance GitLab integration with performance improvements

- Add comprehensive caching system for repositories and user data
- Implement pagination and search/filter functionality with debouncing
- Add skeleton loaders and improved loading states
- Implement retry logic for API calls with exponential backoff
- Add background refresh capabilities
- Improve error handling and user feedback
- Optimize API calls to reduce loading times

* feat: implement GitLab integration with connection management and repository handling

- Add GitLab connection UI components
- Implement GitLab API service for repository operations
- Add GitLab connection store for state management
- Update existing connection components (Vercel, Netlify)
- Add repository listing and statistics display
- Refactor GitLab components into organized folder structure

* fix: resolve GitLab deployment issues and improve user experience

- Fix DialogTitle accessibility warnings for screen readers
- Remove CORS-problematic attributes from avatar images to prevent loading errors
- Enhance GitLab API error handling with detailed error messages
- Fix project creation settings to prevent initial commit conflicts
- Add automatic GitLab connection state initialization on app startup
- Improve deployment dialog UI with better error handling and user feedback
- Add GitLab deployment source type to action runner system
- Clean up deprecated push dialog files and consolidate deployment components

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

* feat: implement GitHub clone repository dialog functionality

This commit fixes the missing GitHub repository selection dialog in the "Clone a repo" feature
by implementing the same elegant interface pattern used by GitLab.

Key Changes:
- Added onCloneRepository prop support to GitHubConnection component
- Updated RepositoryCard to generate proper GitHub clone URLs (https://github.com/{full_name}.git)
- Implemented full GitHub repository selection dialog in GitCloneButton.tsx
- Added proper dialog close handling after successful clone operations
- Maintained existing GitHub connection settings page functionality

Technical Details:
- Follows same component patterns as GitLab implementation
- Uses proper TypeScript interfaces for clone URL handling
- Includes professional dialog styling with loading states
- Supports repository search, pagination, and authentication flow

The GitHub clone experience now matches GitLab's functionality, providing users with
a unified and intuitive repository selection interface across both providers.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

* Clean up unused connection components

- Remove ConnectionForm.tsx (unused GitHub form component)
- Remove CreateBranchDialog.tsx (unused branch creation dialog)
- Remove RepositoryDialogContext.tsx (unused context provider)
- Remove empty components/ directory

These files were not referenced anywhere in the codebase and were leftover from development.

* Remove environment variables info section from ConnectionsTab

- Remove collapsible environment variables section
- Clean up unused state and imports
- Simplify the connections tab UI

* Reorganize connections folder structure

- Create netlify/ folder and move NetlifyConnection.tsx
- Create vercel/ folder and move VercelConnection.tsx
- Add index.ts files for both netlify and vercel folders
- Update imports in ConnectionsTab.tsx to use new folder structure
- All connection components now follow consistent folder organization

---------

Co-authored-by: Hayat Bourgi <[email protected]>
Co-authored-by: Hayat55 <[email protected]>
Co-authored-by: Claude <[email protected]>

Author: 3 people

.env.example

@@ -117,6 +117,37 @@ VITE_GITHUB_ACCESS_TOKEN=your_github_personal_access_token_here
 # GitHub Token Type ('classic' or 'fine-grained')
 VITE_GITHUB_TOKEN_TYPE=classic
 
+# ======================================
+# GITLAB INTEGRATION
+# ======================================
+
+# GitLab Personal Access Token
+# Get your GitLab Personal Access Token here:
+# https://gitlab.com/-/profile/personal_access_tokens
+#
+# This token is used for:
+# 1. Importing/cloning GitLab repositories
+# 2. Accessing private projects
+# 3. Creating/updating branches
+# 4. Creating/updating commits and pushing code
+# 5. Creating new GitLab projects via the API
+#
+# Make sure your token has the following scopes:
+# - api (for full API access including project creation and commits)
+# - read_repository (to clone/import repositories)
+# - write_repository (to push commits and update branches)
+VITE_GITLAB_ACCESS_TOKEN=
+
+# Set the GitLab instance URL (e.g., https://gitlab.com or your self-hosted domain)
+VITE_GITLAB_URL=https://gitlab.com
+
+# GitLab token type should be 'personal-access-token'
+VITE_GITLAB_TOKEN_TYPE=personal-access-token
+
+# ======================================
+# DEVELOPMENT SETTINGS
+# ======================================
+
 # ======================================
 # DEVELOPMENT SETTINGS
 # ======================================
@@ -139,4 +170,85 @@ DEFAULT_NUM_CTX=32768
 # 1. Copy this file to .env.local: cp .env.example .env.local
 # 2. Fill in the API keys you want to use
 # 3. Restart your development server: npm run dev
-# 4. Go to Settings > Providers to enable/configure providers
+# 4. Go to Settings > Providers to enable/configure providers
+# ======================================
+# GITLAB INTEGRATION
+# ======================================
+
+# GitLab Personal Access Token
+# Get your GitLab Personal Access Token here:
+# https://gitlab.com/-/profile/personal_access_tokens
+#
+# This token is used for:
+# 1. Importing/cloning GitLab repositories
+# 2. Accessing private projects
+# 3. Creating/updating branches
+# 4. Creating/updating commits and pushing code
+# 5. Creating new GitLab projects via the API
+#
+# Make sure your token has the following scopes:
+# - api (for full API access including project creation and commits)
+# - read_repository (to clone/import repositories)
+# - write_repository (to push commits and update branches)
+VITE_GITLAB_ACCESS_TOKEN=
+
+# Set the GitLab instance URL (e.g., https://gitlab.com or your self-hosted domain)
+VITE_GITLAB_URL=https://gitlab.com
+
+# GitLab token type should be 'personal-access-token'
+VITE_GITLAB_TOKEN_TYPE=personal-access-token
+
+# ======================================
+# GITLAB INTEGRATION
+# ======================================
+
+# GitLab Personal Access Token
+# Get your GitLab Personal Access Token here:
+# https://gitlab.com/-/profile/personal_access_tokens
+#
+# This token is used for:
+# 1. Importing/cloning GitLab repositories
+# 2. Accessing private projects  
+# 3. Creating/updating branches
+# 4. Creating/updating commits and pushing code
+# 5. Creating new GitLab projects via the API
+#
+# Make sure your token has the following scopes:
+# - api (for full API access including project creation and commits)
+# - read_repository (to clone/import repositories)
+# - write_repository (to push commits and update branches)
+VITE_GITLAB_ACCESS_TOKEN=
+
+# Set the GitLab instance URL (e.g., https://gitlab.com or your self-hosted domain)
+VITE_GITLAB_URL=https://gitlab.com
+
+# GitLab token type should be 'personal-access-token'
+VITE_GITLAB_TOKEN_TYPE=personal-access-token
+
+
+# ======================================
+# GITLAB INTEGRATION
+# ======================================
+
+# GitLab Personal Access Token
+# Get your GitLab Personal Access Token here:
+# https://gitlab.com/-/profile/personal_access_tokens
+#
+# This token is used for:
+# 1. Importing/cloning GitLab repositories
+# 2. Accessing private projects
+# 3. Creating/updating branches
+# 4. Creating/updating commits and pushing code
+# 5. Creating new GitLab projects via the API
+#
+# Make sure your token has the following scopes:
+# - api (for full API access including project creation and commits)
+# - read_repository (to clone/import repositories)
+# - write_repository (to push commits and update branches)
+VITE_GITLAB_ACCESS_TOKEN=
+
+# Set the GitLab instance URL (e.g., https://gitlab.com or your self-hosted domain)
+VITE_GITLAB_URL=https://gitlab.com
+
+# GitLab token type should be 'personal-access-token'
+VITE_GITLAB_TOKEN_TYPE=personal-access-token