From 981fc127b5054c19ae3d71897e49d08f53cc6154 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Mon, 1 Dec 2025 13:51:21 +0100
Subject: [PATCH] fix: move base directory path normalization to frontend
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Change wire:model.blur to wire:model.defer to prevent backend requests
during form navigation. Add Alpine.js path normalization functions that
run on blur, fixing tab focus issues while keeping path validation
purely on the frontend.

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../Project/New/GithubPrivateRepository.php   | 10 ------
 .../Project/New/PublicGitRepository.php       | 20 ------------
 ...ub-private-repository-deploy-key.blade.php | 31 ++++++++++++++++---
 .../new/github-private-repository.blade.php   | 30 +++++++++++++++---
 .../new/public-git-repository.blade.php       | 31 ++++++++++++++++---
 5 files changed, 77 insertions(+), 45 deletions(-)

diff --git a/app/Livewire/Project/New/GithubPrivateRepository.php b/app/Livewire/Project/New/GithubPrivateRepository.php
index 27ecacb99..5dd508c29 100644
--- a/app/Livewire/Project/New/GithubPrivateRepository.php
+++ b/app/Livewire/Project/New/GithubPrivateRepository.php
@@ -75,16 +75,6 @@ public function mount()
         $this->github_apps = GithubApp::private();
     }
 
-    public function updatedBaseDirectory()
-    {
-        if ($this->base_directory) {
-            $this->base_directory = rtrim($this->base_directory, '/');
-            if (! str($this->base_directory)->startsWith('/')) {
-                $this->base_directory = '/'.$this->base_directory;
-            }
-        }
-    }
-
     public function updatedBuildPack()
     {
         if ($this->build_pack === 'nixpacks') {
diff --git a/app/Livewire/Project/New/PublicGitRepository.php b/app/Livewire/Project/New/PublicGitRepository.php
index 89814ee7f..2fffff6b9 100644
--- a/app/Livewire/Project/New/PublicGitRepository.php
+++ b/app/Livewire/Project/New/PublicGitRepository.php
@@ -107,26 +107,6 @@ public function mount()
         $this->query = request()->query();
     }
 
-    public function updatedBaseDirectory()
-    {
-        if ($this->base_directory) {
-            $this->base_directory = rtrim($this->base_directory, '/');
-            if (! str($this->base_directory)->startsWith('/')) {
-                $this->base_directory = '/'.$this->base_directory;
-            }
-        }
-    }
-
-    public function updatedDockerComposeLocation()
-    {
-        if ($this->docker_compose_location) {
-            $this->docker_compose_location = rtrim($this->docker_compose_location, '/');
-            if (! str($this->docker_compose_location)->startsWith('/')) {
-                $this->docker_compose_location = '/'.$this->docker_compose_location;
-            }
-        }
-    }
-
     public function updatedBuildPack()
     {
         if ($this->build_pack === 'nixpacks') {
diff --git a/resources/views/livewire/project/new/github-private-repository-deploy-key.blade.php b/resources/views/livewire/project/new/github-private-repository-deploy-key.blade.php
index 6d644ba2c..596559817 100644
--- a/resources/views/livewire/project/new/github-private-repository-deploy-key.blade.php
+++ b/resources/views/livewire/project/new/github-private-repository-deploy-key.blade.php
@@ -61,12 +61,33 @@ class="loading loading-xs dark:text-warning loading-spinner"></span>
                     @endif
                 </div>
                 @if ($build_pack === 'dockercompose')
-                    <div x-data="{ baseDir: '{{ $base_directory }}', composeLocation: '{{ $docker_compose_location }}' }" class="gap-2 flex flex-col">
-                        <x-forms.input placeholder="/" wire:model.blur="base_directory" label="Base Directory"
-                            helper="Directory to use as root. Useful for monorepos." x-model="baseDir" />
-                        <x-forms.input placeholder="/docker-compose.yaml" wire:model.blur="docker_compose_location"
+                    <div x-data="{
+                        baseDir: '{{ $base_directory }}',
+                        composeLocation: '{{ $docker_compose_location }}',
+                        normalizePath(path) {
+                            if (!path || path.trim() === '') return '/';
+                            path = path.trim();
+                            // Remove trailing slashes
+                            path = path.replace(/\/+$/, '');
+                            // Ensure leading slash
+                            if (!path.startsWith('/')) {
+                                path = '/' + path;
+                            }
+                            return path;
+                        },
+                        normalizeBaseDir() {
+                            this.baseDir = this.normalizePath(this.baseDir);
+                        },
+                        normalizeComposeLocation() {
+                            this.composeLocation = this.normalizePath(this.composeLocation);
+                        }
+                    }" class="gap-2 flex flex-col">
+                        <x-forms.input placeholder="/" wire:model.defer="base_directory" label="Base Directory"
+                            helper="Directory to use as root. Useful for monorepos." x-model="baseDir"
+                            @blur="normalizeBaseDir()" />
+                        <x-forms.input placeholder="/docker-compose.yaml" wire:model.defer="docker_compose_location"
                             label="Docker Compose Location" helper="It is calculated together with the Base Directory."
-                            x-model="composeLocation" />
+                            x-model="composeLocation" @blur="normalizeComposeLocation()" />
                         <div class="pt-2">
                             <span>
                                 Compose file location in your repository: </span><span class='dark:text-warning'
diff --git a/resources/views/livewire/project/new/github-private-repository.blade.php b/resources/views/livewire/project/new/github-private-repository.blade.php
index ddc5217c7..e7f90788e 100644
--- a/resources/views/livewire/project/new/github-private-repository.blade.php
+++ b/resources/views/livewire/project/new/github-private-repository.blade.php
@@ -95,15 +95,35 @@
                                     @endif
                                 </div>
                                 @if ($build_pack === 'dockercompose')
-                                    <div x-data="{ baseDir: '{{ $base_directory }}', composeLocation: '{{ $docker_compose_location }}' }" class="gap-2 flex flex-col">
-                                        <x-forms.input placeholder="/" wire:model.blur="base_directory"
+                                    <div x-data="{
+                                        baseDir: '{{ $base_directory }}',
+                                        composeLocation: '{{ $docker_compose_location }}',
+                                        normalizePath(path) {
+                                            if (!path || path.trim() === '') return '/';
+                                            path = path.trim();
+                                            // Remove trailing slashes
+                                            path = path.replace(/\/+$/, '');
+                                            // Ensure leading slash
+                                            if (!path.startsWith('/')) {
+                                                path = '/' + path;
+                                            }
+                                            return path;
+                                        },
+                                        normalizeBaseDir() {
+                                            this.baseDir = this.normalizePath(this.baseDir);
+                                        },
+                                        normalizeComposeLocation() {
+                                            this.composeLocation = this.normalizePath(this.composeLocation);
+                                        }
+                                    }" class="gap-2 flex flex-col">
+                                        <x-forms.input placeholder="/" wire:model.defer="base_directory"
                                             label="Base Directory"
                                             helper="Directory to use as root. Useful for monorepos."
-                                            x-model="baseDir" />
+                                            x-model="baseDir" @blur="normalizeBaseDir()" />
                                         <x-forms.input placeholder="/docker-compose.yaml"
-                                            wire:model.blur="docker_compose_location" label="Docker Compose Location"
+                                            wire:model.defer="docker_compose_location" label="Docker Compose Location"
                                             helper="It is calculated together with the Base Directory."
-                                            x-model="composeLocation" />
+                                            x-model="composeLocation" @blur="normalizeComposeLocation()" />
                                         <div class="pt-2">
                                             <span>
                                                 Compose file location in your repository: </span><span
diff --git a/resources/views/livewire/project/new/public-git-repository.blade.php b/resources/views/livewire/project/new/public-git-repository.blade.php
index a7804aad8..02489719a 100644
--- a/resources/views/livewire/project/new/public-git-repository.blade.php
+++ b/resources/views/livewire/project/new/public-git-repository.blade.php
@@ -52,12 +52,33 @@
                     @endif
                 </div>
                 @if ($build_pack === 'dockercompose')
-                    <div x-data="{ baseDir: '{{ $base_directory }}', composeLocation: '{{ $docker_compose_location }}' }" class="gap-2 flex flex-col">
-                        <x-forms.input placeholder="/" wire:model.blur="base_directory" label="Base Directory"
-                            helper="Directory to use as root. Useful for monorepos." x-model="baseDir" />
-                        <x-forms.input placeholder="/docker-compose.yaml" wire:model.blur="docker_compose_location"
+                    <div x-data="{
+                        baseDir: '{{ $base_directory }}',
+                        composeLocation: '{{ $docker_compose_location }}',
+                        normalizePath(path) {
+                            if (!path || path.trim() === '') return '/';
+                            path = path.trim();
+                            // Remove trailing slashes
+                            path = path.replace(/\/+$/, '');
+                            // Ensure leading slash
+                            if (!path.startsWith('/')) {
+                                path = '/' + path;
+                            }
+                            return path;
+                        },
+                        normalizeBaseDir() {
+                            this.baseDir = this.normalizePath(this.baseDir);
+                        },
+                        normalizeComposeLocation() {
+                            this.composeLocation = this.normalizePath(this.composeLocation);
+                        }
+                    }" class="gap-2 flex flex-col">
+                        <x-forms.input placeholder="/" wire:model.defer="base_directory" label="Base Directory"
+                            helper="Directory to use as root. Useful for monorepos." x-model="baseDir"
+                            @blur="normalizeBaseDir()" />
+                        <x-forms.input placeholder="/docker-compose.yaml" wire:model.defer="docker_compose_location"
                             label="Docker Compose Location" helper="It is calculated together with the Base Directory."
-                            x-model="composeLocation" />
+                            x-model="composeLocation" @blur="normalizeComposeLocation()" />
                         <div class="pt-2">
                             <span>
                                 Compose file location in your repository: </span><span class='dark:text-warning'