Replaced inline style="display: none;" with x-cloak attribute on the
warning callout to properly prevent flash of unstyled content before
Alpine.js initializes. Alpine 3+ automatically handles x-cloak styling.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Changed word-break strategy to properly wrap long lines:
- Changed from break-words to break-all for aggressive wrapping
- Added min-w-0 to container to allow flex shrinking
- Added max-w-full to pre element to respect parent width
- This ensures long URLs and file paths break anywhere to prevent overflow
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added proper overflow handling and word breaking for log content:
- Added overflow-x-hidden to prevent horizontal scrolling in log container
- Added break-words and overflow-wrap-anywhere to force long lines to wrap
- This ensures long log lines (URLs, file paths, etc.) wrap properly on mobile
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Restructured the form to prevent overflow issues on mobile:
- Separated input field from controls in distinct sections
- Button and checkboxes now in a wrapping flex container
- All controls stack vertically on mobile for better readability
- Horizontal layout with wrapping on larger screens
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
The proxy logs form controls were not responsive on mobile devices. The form now stacks vertically on mobile and displays horizontally on larger screens.
Changes:
- Changed form layout to flex-col on mobile, flex-row on sm+ screens
- Made input field full width on mobile (w-full), fixed width (w-96) on sm+ screens
- Adjusted gap spacing for better mobile experience (gap-4 on mobile, gap-2 on sm+)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added pt-2 for proper spacing between checkbox and warning callout,
and formatted the warning text for better readability.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Removed max-w-2xl constraint and wrapper div from change.blade.php
so the callout takes full available width in the regular page view.
Modal version (create.blade.php) keeps the constraint for centered display.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Removed mx-auto from change.blade.php (regular page view) so the
callout is left-aligned. The create.blade.php modal version keeps
mx-auto for centered display.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added mx-auto to center the callout horizontally within the modal.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Set explicit max-width constraint (max-w-2xl) on callout wrapper
and added whitespace-normal to ensure text wraps properly within
the modal instead of expanding it horizontally.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added max-width constraints and word breaking to ensure the warning
callout text wraps properly within modal constraints instead of
expanding the modal width excessively.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
The system-wide warning callout was not appearing when the checkbox was toggled because it was only evaluated on initial render.
Changes:
- Wrapped checkbox and warning in Alpine.js x-data scope
- Used @entangle to bind showWarning to the is_system_wide Livewire property
- Added x-show directive to reactively show/hide warning based on checkbox state
- Added x-transition for smooth appearance/disappearance
- Added style="display: none;" to prevent flash of content on load
Now the warning appears immediately when the System Wide checkbox is checked and disappears when unchecked.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Improved the Resources section to show a clear message instead of an empty table when no resources are using the GitHub App.
Changes:
- Added conditional check for empty applications collection
- Shows "No resources are currently using this GitHub App." message when empty
- Only displays the table with headers when there are actual resources
- Changed @forelse to @foreach since we now handle empty state explicitly
This provides better UX by giving clear feedback instead of showing an empty table structure.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added warning callouts to inform users that system-wide GitHub Apps are not recommended for security reasons.
Changes:
- Added warning callout in Create view when system-wide checkbox is enabled
- Added warning callout in Change view when GitHub App is system-wide
- Warning explains that system-wide apps are shared across all teams and can access repositories from any team
- Recommends creating team-specific GitHub Apps for better security and isolation
The warnings only appear on self-hosted instances where system-wide option is available (not on cloud).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixed multiple issues with GitHub App source creation and management:
1. **Fixed null property assignment error on component mount**
- Changed property types to nullable in Change component (appId, installationId, clientId, etc.)
- Updated validation rules to allow nullable values
- Allows mounting component with newly created GitHub Apps that don't have these fields set yet
2. **Fixed Livewire morphing error on manual creation**
- Modified createGithubAppManually() to redirect after saving
- Prevents "Cannot read properties of null" error when view structure changes
- Fields now properly populated after manual creation without requiring page refresh
3. **Fixed is_system_wide not being saved on creation**
- Removed backwards logic that only saved is_system_wide on cloud instances
- Added is_system_wide to GithubApp model casts for proper boolean handling
- System-wide checkbox now works correctly on self-hosted instances
4. **Fixed misleading preview deployment checkbox**
- Removed instantSave attribute from permission checkboxes in unconfigured state
- These are configuration options for GitHub App creation, not database fields
- Prevents "GitHub App updated" success message when nothing was actually saved
5. **Added validation for Refetch Permissions button**
- Validates App ID and Private Key are set before attempting to fetch
- Shows clear error messages: "Cannot fetch permissions. Please set the following required fields first: App ID, Private Key"
- Prevents crash when private key is null or invalid
6. **Better error handling for unsupported private key formats**
- Detects OpenSSH format keys vs RSA PEM format
- Shows helpful message: "Please use an RSA private key in PEM format (BEGIN RSA PRIVATE KEY). OpenSSH format keys are not supported."
- GitHub Apps require RSA PEM format, not OpenSSH format
7. **Made GitHub App view mobile responsive**
- Updated all flex layouts to stack vertically on mobile (flex-col sm:flex-row)
- Form fields, buttons, and sections now properly responsive
- No more cut-off fields on small screens
Added comprehensive test coverage:
- GithubSourceChangeTest.php with 7 tests
- GithubSourceCreateTest.php with 6 tests
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Replace horizontal scrolling with flex-wrap for checkbox containers
in environment variable forms to improve mobile responsiveness.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixed JavaScript error "Cannot set properties of null (setting 'fqdn')"
that occurred when typing in the domains input field.
Changed wire:model binding from "application.fqdn" to "fqdn" to properly
use the component property which is synced with the model via the
SynchronizesModelData trait and getModelBindings() method.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixes#6974
- Add max-height constraints to prevent modals from exceeding viewport
- Enable vertical scrolling with overflow-y-auto on content areas
- Improve mobile responsiveness with consistent padding
- Separate fixed header from scrollable content using flexbox
- Add touch scrolling support for iOS devices
This ensures buttons like "Back" and "Continue" remain accessible
on small devices by allowing users to scroll the modal content.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
The loading icon was appearing during automatic background status checks
(every 10 seconds) even when users didn't click anything, which caused
confusion and made it seem like something was running unexpectedly.
Changes:
- Added manualCheckStatus() method to Application, Database, and Service
Heading components that wraps the checkStatus() call
- Updated status component buttons to call manualCheckStatus() instead
of checkStatus()
- Added wire:target="manualCheckStatus" to loading directives so the
loading icon only appears when users explicitly click the refresh button
- Added delay.shortest to prevent flickering on fast operations
The automatic wire:poll.10000ms="checkStatus" now runs silently in the
background without showing the loading icon, while manual refreshes
still provide visual feedback to the user.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
This commit improves the visual presentation of service, application, and database logos on the new resource selection page:
- Remove grayscale filter: Logos now display in their original colors by default instead of being greyed out
- Dark mode support for SVGs: Updated SVG logos to use `fill="currentColor"` and added `text-black dark:text-white` wrapper for proper light/dark theme adaptation
- Consistent aspect ratios: Removed `aspect-square` and added `object-contain` to preserve original logo proportions
- Uniform sizing: Implemented fixed-size container (4.5rem × 4.5rem) with centered logo positioning to ensure all logos appear at consistent sizes regardless of intrinsic dimensions
- Improved mobile UX: Adjusted sticky search bar positioning from `top-10` to `top-20` to prevent navbar overlap
Files modified:
- resources/views/livewire/project/new/select.blade.php
- resources/views/components/resource-view.blade.php
- app/Livewire/Project/New/Select.php
- public/svgs/*.svg (12 SVG files updated with currentColor)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add a searchable category dropdown filter on the new resource page to help users filter services by category.
Features:
- Category dropdown positioned next to search input
- Auto-focus on search field when dropdown opens
- Case-insensitive category filtering
- Proper acronym formatting (AI, API, CI, etc. displayed in uppercase)
- Loading/disabled state while categories are being fetched
- Category search/filter within dropdown
- Alphabetical sorting (case-insensitive)
Backend changes:
- Extract unique categories from service templates
- Handle comma-separated categories
- Format common acronyms to uppercase
- Case-insensitive natural sorting
Frontend changes:
- Searchable dropdown component with Alpine.js
- Category filter integration with existing search
- Disabled state placeholder during loading
- Auto-focus behavior for better UX
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add minimal blocking script immediately after <html> tag to apply dark class before any rendering
- Move theme detection from body to run before <head> parsing
- Add color-scheme meta tag for browser-level dark mode support
- Update theme-color meta tag dynamically based on theme
- Improve queryTheme() logic in settings dropdown for consistent behavior
- Remove duplicate theme detection code from body script
This eliminates the white "flashbang" effect that occurs during Livewire page
navigation, especially noticeable for users with high latency connections.
The solution uses an ultra-minimal (~100 bytes) script that runs before <head>
parsing, preventing FOUC while maintaining optimal performance (~0.1ms impact).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
The modal height was changing when switching between "Source Compose"
and "Deployable Compose" views due to different heights between the
Monaco editor and regular textareas.
Changes:
- Set fixed height (512px) for Monaco editor via CSS
- Increased textarea rows to 25 to match Monaco editor height
- Wrapped both views in a container with consistent styling
- Modal now maintains same height regardless of view
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add ownedAndOnlySShKeys() method to filter out git-related keys
- Update Boarding component to use new filtering method
- Enhance datalist component with better multi-select and single-select handling
- Fix Alpine.js reactivity and improve UI interactions
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add a prominent call-to-action button linking to the onboarding guide when users don't find any search results. This helps guide new users to helpful documentation when they're searching but not finding what they need.
When creating a Hetzner server from the onboarding view, the redirect
to the server details page was not working properly due to modal context.
The standard redirect() call doesn't handle navigation from within modals.
Changes:
- Add from_onboarding flag to ByHetzner component
- Use wire:navigate redirect when in onboarding mode
- Pass from_onboarding=true from boarding view
This ensures proper navigation to the newly created server page instead
of staying on the onboarding view.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
When a docker compose service has multiple comma-separated domains, the
generate() method was only processing the first domain and truncating the rest.
The issue was that Url::fromString() can't parse comma-separated URLs - it only
parses the first one.
Fixed by:
1. Splitting comma-separated domains with explode(',', $domain_string)
2. Processing each domain individually in a foreach loop
3. Generating preview URLs for each domain using the same template/random/pr_id
4. Joining the results back with implode(',', $preview_fqdns)
This ensures all domains get properly transformed for preview deployments.
Example:
- Original: http://domain1.com,http://domain2.com
- Preview: http://57.domain1.com,http://57.domain2.com
- Before fix: http://57.domain1.com,http (truncated)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
The wire:dirty.class was being applied to all form inputs, even those without
wire:model bindings (like readonly fields). This caused the dirty state indicator
to appear on readonly fields when other fields in the form were modified.
Fixed by only applying wire:dirty.class when wire:model binding is present:
- input.blade.php: Moved wire:dirty.class inside @if($modelBinding !== 'null')
- textarea.blade.php: Applied same fix for all textarea variations
- select.blade.php: Applied same fix for select elements
This ensures only fields with actual Livewire bindings show dirty state indicators.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Resolved merge conflicts between Livewire model binding refactoring and UI/CSS updates from next branch. Key integrations:
- Preserved unique HTML ID generation for form components
- Maintained wire:model bindings using $modelBinding
- Integrated new wire:dirty.class styles (border-l-warning pattern)
- Kept both syncData(true) and validateDockerComposeForInjection in StackForm
- Merged security tests and helper improvements from next
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
