* Update DataTab.tsx
## API Key Import Fix
We identified and fixed an issue with the API key import functionality in the DataTab component. The problem was that API keys were being stored in localStorage instead of cookies, and the key format was being incorrectly processed.
### Changes Made:
1. **Updated `handleImportAPIKeys` function**:
- Changed to store API keys in cookies instead of localStorage
- Modified to use provider names directly as keys (e.g., "OpenAI", "Google")
- Added logic to skip comment fields (keys starting with "_")
- Added page reload after successful import to apply changes immediately
2. **Updated `handleDownloadTemplate` function**:
- Changed template format to use provider names as keys
- Added explanatory comment in the template
- Removed URL-related keys that weren't being used properly
3. **Fixed template format**:
- Template now uses the correct format with provider names as keys
- Added support for all available providers including Hyperbolic
These changes ensure that when users download the template, fill it with their API keys, and import it back, the keys are properly stored in cookies with the correct format that the application expects.
* backwards compatible old import template
* Update the export / import settings
Settings Export/Import Improvements
We've completely redesigned the settings export and import functionality to ensure all application settings are properly backed up and restored:
Key Improvements
Comprehensive Export Format: Now captures ALL settings from both localStorage and cookies, organized into logical categories (core, providers, features, UI, connections, debug, updates)
Robust Import System: Automatically detects format version and handles both new and legacy formats with detailed error handling
Complete Settings Coverage: Properly exports and imports settings from ALL tabs including:
Local provider configurations (Ollama, LMStudio, etc.)
Cloud provider API keys (OpenAI, Anthropic, etc.)
Feature toggles and preferences
UI configurations and tab settings
Connection settings (GitHub, Netlify)
Debug configurations and logs
Technical Details
Added version tracking to export files for better compatibility
Implemented fallback mechanisms if primary import methods fail
Added detailed logging for troubleshooting import/export issues
Created helper functions for safer data handling
Maintained backward compatibility with older export formats
Feature Settings:
Feature flags and viewed features
Developer mode settings
Energy saver mode configurations
User Preferences:
User profile information
Theme settings
Tab configurations
Connection Settings:
Netlify connections
Git authentication credentials
Any other service connections
Debug and System Settings:
Debug flags and acknowledged issues
Error logs and event logs
Update settings and preferences
* Update DataTab.tsx
* Update GithubConnection.tsx
revert the code back as asked
* feat: enhance style to match the project
* feat:small improvements
* feat: add major improvements
* Update Dialog.tsx
* Delete DataTab.tsx.bak
* feat: small updates
* Update DataVisualization.tsx
* feat: dark mode fix
Introduce a new extension for CodeMirror that masks sensitive values in .env files. This ensures that sensitive information like API keys or passwords is not displayed in plain text within the editor. The extension dynamically applies masking to values in lines matching the KEY=VALUE format, improving security during development.
This commit introduces Vercel integration, enabling users to deploy projects directly to Vercel. It includes:
- New Vercel types and store for managing connections and stats.
- A VercelConnection component for managing Vercel account connections.
- A VercelDeploymentLink component for displaying deployment links.
- API routes for handling Vercel deployments.
- Updates to the HeaderActionButtons component to support Vercel deployment.
The integration allows users to connect their Vercel accounts, view project stats, and deploy projects with ease.
Remove console.log statement for debugging purposes in the API route and enhance the layout of buttons in the SupabaseConnection component by grouping them and adding a refresh button
This commit introduces the ability to fetch and store Supabase API keys and URL credentials when a project is selected. This enables the application to dynamically configure the Supabase connection environment variables, improving the integration with Supabase services. The changes include updates to the Supabase connection logic, new API endpoints, and modifications to the chat and prompt components to utilize the new credentials.
Add support for Supabase database operations, including migrations and queries. Implement new Supabase-related types, actions, and components to handle database interactions. Enhance the prompt system to include Supabase-specific instructions and constraints. Ensure data integrity and security by enforcing row-level security and proper migration practices.
* Fix: error building my application #1414
* fix for vite
* Update vite.config.ts
* Update root.tsx
* fix the root.tsx and the debugtab
* lm studio fix and fix for the api key
* Update api.enhancer for prompt enhancement
* bugfixes
* Revert api.enhancer.ts back to original code
* Update api.enhancer.ts
* Update api.git-proxy.$.ts
* Update api.git-proxy.$.ts
* Update api.enhancer.ts
# UI V3 Changelog
Major updates and improvements in this release:
## Core Changes
- Complete NEW REWRITTEN UI system overhaul (V3) with semantic design tokens
- New settings management system with drag-and-drop capabilities
- Enhanced provider system supporting multiple AI services
- Improved theme system with better dark mode support
- New component library with consistent design patterns
## Technical Updates
- Reorganized project architecture for better maintainability
- Performance optimizations and bundle size improvements
- Enhanced security features and access controls
- Improved developer experience with better tooling
- Comprehensive testing infrastructure
## New Features
- Background rays effect for improved visual feedback
- Advanced tab management system
- Automatic and manual update support
- Enhanced error handling and visualization
- Improved accessibility across all components
For detailed information about all changes and improvements, please see the full changelog.
# Tab Management System Implementation
## What's Been Implemented
1. Complete Tab Management System with:
- Drag and drop functionality for reordering tabs
- Visual feedback during drag operations
- Smooth animations and transitions
- Dark mode support
- Search functionality for tabs
- Reset to defaults option
2. Developer Mode Features:
- Shows ALL available tabs in developer mode
- Maintains tab order across modes
- Proper visibility toggles
- Automatic inclusion of developer-specific tabs
3. User Mode Features:
- Shows only user-configured tabs
- Maintains separate tab configurations
- Proper visibility management
## Key Components
- `TabManagement.tsx`: Main management interface
- `ControlPanel.tsx`: Main panel with tab display
- Integration with tab configuration store
- Proper type definitions and interfaces
## Technical Features
- React DnD for drag and drop
- Framer Motion for animations
- TypeScript for type safety
- UnoCSS for styling
- Toast notifications for user feedback
## Next Steps
1. Testing:
- Test tab visibility in both modes
- Verify drag and drop persistence
- Check dark mode compatibility
- Verify search functionality
- Test reset functionality
2. Potential Improvements:
- Add tab grouping functionality
- Implement tab pinning
- Add keyboard shortcuts
- Improve accessibility
- Add tab descriptions
- Add tab icons customization
3. Documentation:
- Add inline code comments
- Create user documentation
- Document API interfaces
- Add setup instructions
4. Future Features:
- Tab export/import
- Custom tab creation
- Tab templates
- User preferences sync
- Tab statistics
## Known Issues to Address
1. Ensure all tabs are visible in developer mode
2. Improve drag and drop performance
3. Better state persistence
4. Enhanced error handling
5. Improved type safety
## Usage Instructions
1. Switch to developer mode to see all available tabs
2. Use drag and drop to reorder tabs
3. Toggle visibility using switches
4. Use search to filter tabs
5. Reset to defaults if needed
## Technical Debt
1. Refactor tab configuration store
2. Improve type definitions
3. Add proper error boundaries
4. Implement proper loading states
5. Add comprehensive testing
## Security Considerations
1. Validate tab configurations
2. Sanitize user input
3. Implement proper access control
4. Add audit logging
5. Secure state management
Enhanced System Metrics:
Detailed CPU metrics including temperature and frequency
Comprehensive memory breakdown with heap usage
Advanced performance metrics (FPS, page load times, web vitals)
Detailed network statistics
Storage monitoring with visual indicators
Battery health and detailed status
Power Management:
Multiple power profiles (Performance, Balanced, Power Saver)
Enhanced energy saver mode
Automatic power management based on system state
Detailed energy savings statistics
System Health:
Overall system health score
Real-time issue detection and alerts
Performance optimization suggestions
Historical metrics tracking
UI Improvements:
Interactive graphs for all metrics
Color-coded status indicators
Detailed tooltips and explanations
Collapsible sections for better organization
Alert system for critical events
Performance Monitoring:
Frame rate monitoring
Resource usage tracking
Network performance analysis
Web vitals monitoring
Detailed timing metrics
To use the enhanced task manager:
Monitor system health in the new health score section
Choose a power profile based on your needs
Enable auto energy saver for automatic power management
Monitor real-time alerts for system issues
5. View detailed metrics in each category
Check optimization suggestions when performance issues arise
* Use backend API route to fetch dynamic models
# Conflicts:
# app/components/chat/BaseChat.tsx
* Override ApiKeys if provided in frontend
* Remove obsolete artifact
* Transport api keys from client to server in header
* Cache static provider information
* Restore reading provider settings from cookie
* Reload only a single provider on api key change
* Transport apiKeys and providerSettings via cookies.
While doing this, introduce a simple helper function for cookies
* added the "Open Preview in a New Tab"
* enhancement
[Open Preview] [▼] // Two buttons side by side
|
+-- [Mobile (375x667)] // Dropdown menu
|-- [Tablet (768x1024)]
|-- [Laptop (1366x768)]
+-- [Desktop (1920x1080)]
* Update Preview.tsx
* Update Preview.tsx
* fixed#333
* Added instruction in case api-key is not set.
* addressed some of the review changes:
1. moved function definiton to useCallback.
2. added a cache to store the env key status and the api call is made only on a cache miss.
* Manages the API-key entered via UI in a better way.
- Persist API keys in cookies when entered via UI
- Automatically load saved keys when switching between providers
- Preserve existing functionality for environment variable based keys
* Re-used map from utils/constants file.
* Code cleanup - Removed redundant API key init in BaseChat as its already handled by APIKeyManager component.
* fix: updated logger and model caching
* usage token stream issue fix
* minor changes
* updated starter template change to fix the app title
* starter template bigfix
* fixed hydretion errors and raw logs
* removed raw log
* made auto select template false by default
* more cleaner logs and updated logic to call dynamicModels only if not found in static models
* updated starter template instructions
* browser console log improved for firefox
* provider icons fix icons