Support old values for nested form fields

blade-ui-kit · Sep 8, 2020 · 21e671f · 21e671f
1 parent a6dfc56
commit 21e671f
Show file tree

Hide file tree

Showing 18 changed files with 131 additions and 6 deletions.
diff --git a/resources/views/components/editors/easy-mde.blade.php b/resources/views/components/editors/easy-mde.blade.php
@@ -4,4 +4,4 @@
     name="{{ $name }}"
     id="{{ $id }}"
     {{ $attributes }}
->{{ old($name, $slot) }}</textarea>
+>{{ old($dotName, $slot) }}</textarea>
diff --git a/resources/views/components/editors/trix.blade.php b/resources/views/components/editors/trix.blade.php
@@ -1,4 +1,4 @@
 <div {{ $attributes }}>
-    <input name="{{ $name }}" id="{{ $id }}" value="{{ old($name, $slot) }}" type="hidden">
+    <input name="{{ $name }}" id="{{ $id }}" value="{{ old($dotName, $slot) }}" type="hidden">
     <trix-editor input="{{ $id }}" class="{{ $styling }}"></trix-editor>
 </div>
diff --git a/resources/views/components/forms/inputs/textarea.blade.php b/resources/views/components/forms/inputs/textarea.blade.php
@@ -3,4 +3,4 @@
     id="{{ $id }}"
     rows="{{ $rows }}"
     {{ $attributes }}
->{{ old($name, $slot) }}</textarea>
+>{{ old($dotName, $slot) }}</textarea>
diff --git a/src/Components/Editors/EasyMDE.php b/src/Components/Editors/EasyMDE.php
@@ -12,6 +12,9 @@ class EasyMDE extends BladeComponent
     /** @var string */
     public $name;
 
+    /** @var string */
+    public $dotName;
+
     /** @var string */
     public $id;
 
@@ -25,6 +28,7 @@ public function __construct(string $name, string $id = null, array $options = []
         $this->name = $name;
         $this->id = $id ?? $name;
         $this->options = $options;
+        $this->dotName = trim(str_replace(['[', ']', '..'], '.', $name), '.');
     }
 
     public function options(): array

diff --git a/src/Components/Editors/Trix.php b/src/Components/Editors/Trix.php
@@ -12,6 +12,9 @@ class Trix extends BladeComponent
     /** @var string */
     public $name;
 
+    /** @var string */
+    public $dotName;
+
     /** @var string */
     public $id;
 
@@ -25,6 +28,7 @@ public function __construct(string $name, string $id = null, string $styling = '
         $this->name = $name;
         $this->id = $id ?? $name;
         $this->styling = $styling;
+        $this->dotName = trim(str_replace(['[', ']', '..'], '.', $name), '.');
     }
 
     public function render(): View

diff --git a/src/Components/Forms/Error.php b/src/Components/Forms/Error.php
@@ -18,7 +18,7 @@ class Error extends BladeComponent
 
     public function __construct(string $field, string $bag = 'default')
     {
-        $this->field = $field;
+        $this->field = trim(str_replace(['[', ']', '..'], '.', $field), '.');
         $this->bag = $bag;
     }
 

diff --git a/src/Components/Forms/Inputs/Checkbox.php b/src/Components/Forms/Inputs/Checkbox.php
@@ -15,7 +15,7 @@ public function __construct(string $name, string $id = null, bool $checked = fal
     {
         parent::__construct($name, $id, 'checkbox');
 
-        $this->checked = (bool) old($name, $checked);
+        $this->checked = (bool) old($this->dotName, $checked);
     }
 
     public function render(): View

diff --git a/src/Components/Forms/Inputs/Input.php b/src/Components/Forms/Inputs/Input.php
@@ -12,6 +12,9 @@ class Input extends BladeComponent
     /** @var string */
     public $name;
 
+    /** @var string */
+    public $dotName;
+
     /** @var string */
     public $id;
 
@@ -26,7 +29,8 @@ public function __construct(string $name, string $id = null, string $type = 'tex
         $this->name = $name;
         $this->id = $id ?? $name;
         $this->type = $type;
-        $this->value = old($name, $value);
+        $this->dotName = trim(str_replace(['[', ']', '..'], '.', $name), '.');
+        $this->value = old($this->dotName, $value);
     }
 
     public function render(): View

diff --git a/src/Components/Forms/Inputs/Textarea.php b/src/Components/Forms/Inputs/Textarea.php
@@ -12,6 +12,9 @@ class Textarea extends BladeComponent
     /** @var string */
     public $name;
 
+    /** @var string */
+    public $dotName;
+
     /** @var string */
     public $id;
 
@@ -23,6 +26,7 @@ public function __construct(string $name, string $id = null, $rows = 3)
         $this->name = $name;
         $this->id = $id ?? $name;
         $this->rows = $rows;
+        $this->dotName = trim(str_replace(['[', ']', '..'], '.', $name), '.');
     }
 
     public function render(): View

diff --git a/tests/Components/Editors/EasyMDETest.php b/tests/Components/Editors/EasyMDETest.php
@@ -30,6 +30,18 @@ public function editor_can_have_old_values()
         $this->assertComponentRenders($expected, '<x-easy-mde name="about"/>');
     }
 
+    /** @test */
+    public function nested_editor_can_have_old_values()
+    {
+        $this->flashOld(['profile.about' => 'About me text']);
+
+        $expected = <<<HTML
+<textarea x-data x-init="new EasyMDE({ element: \$el , ...{&quot;forceSync&quot;:true} })" name="profile[about]" id="profile[about]">About me text</textarea>
+HTML;
+
+        $this->assertComponentRenders($expected, '<x-easy-mde name="profile[about]"/>');
+    }
+
     /** @test */
     public function editor_can_have_options()
     {

diff --git a/tests/Components/Editors/TrixTest.php b/tests/Components/Editors/TrixTest.php
@@ -37,4 +37,20 @@ public function editor_can_have_old_values()
 
         $this->assertComponentRenders($expected, '<x-trix name="about"/>');
     }
+
+    /** @test */
+    public function nested_editor_can_have_old_values()
+    {
+        $this->flashOld(['profile.about' => 'About me text']);
+
+        $expected = <<<HTML
+<div>
+    <input name="profile[about]" id="profile[about]" value="About me text" type="hidden">
+    <trix-editor input="profile[about]" class="trix-content">
+    </trix-editor>
+</div>
+HTML;
+
+        $this->assertComponentRenders($expected, '<x-trix name="profile[about]"/>');
+    }
 }
diff --git a/tests/Components/Forms/ErrorTest.php b/tests/Components/Forms/ErrorTest.php
@@ -48,4 +48,18 @@ public function it_can_be_slotted()
 
         $this->assertComponentRenders($expected, $template);
     }
+
+    /** @test */
+    public function it_supports_field_names_in_array_notation()
+    {
+        $this->withViewErrors(['profile.first_name' => 'Incorrect first name.']);
+
+        $expected = <<<HTML
+<div class="text-red-500">
+    Incorrect first name.
+</div>
+HTML;
+
+        $this->assertComponentRenders($expected, '<x-error field="profile[first_name]" class="text-red-500"/>');
+    }
 }
diff --git a/tests/Components/Forms/Inputs/CheckboxTest.php b/tests/Components/Forms/Inputs/CheckboxTest.php
@@ -36,4 +36,15 @@ public function inputs_can_have_old_values()
             '<x-checkbox name="remember_me"/>'
         );
     }
+
+    /** @test */
+    public function nested_inputs_can_have_old_values()
+    {
+        $this->flashOld(['login.remember_me' => true]);
+
+        $this->assertComponentRenders(
+            '<input name="login[remember_me]" type="checkbox" id="login[remember_me]" checked />',
+            '<x-checkbox name="login[remember_me]"/>'
+        );
+    }
 }
diff --git a/tests/Components/Forms/Inputs/EmailTest.php b/tests/Components/Forms/Inputs/EmailTest.php
@@ -36,4 +36,15 @@ public function inputs_can_have_old_values()
             '<x-email/>'
         );
     }
+
+    /** @test */
+    public function nested_inputs_can_have_old_values()
+    {
+        $this->flashOld(['profile.email' => 'Eloquent']);
+
+        $this->assertComponentRenders(
+            '<input name="profile[email]" type="email" id="profile[email]" value="Eloquent" />',
+            '<x-email name="profile[email]"/>'
+        );
+    }
 }
diff --git a/tests/Components/Forms/Inputs/InputTest.php b/tests/Components/Forms/Inputs/InputTest.php
@@ -36,4 +36,15 @@ public function inputs_can_have_old_values()
             '<x-input name="search" />'
         );
     }
+
+    /** @test */
+    public function nested_inputs_can_have_old_values()
+    {
+        $this->flashOld(['filters.search' => 'Eloquent']);
+
+        $this->assertComponentRenders(
+            '<input name="filters[search]" type="text" id="filters[search]" value="Eloquent" />',
+            '<x-input name="filters[search]" />'
+        );
+    }
 }
diff --git a/tests/Components/Forms/Inputs/PasswordTest.php b/tests/Components/Forms/Inputs/PasswordTest.php
@@ -36,4 +36,15 @@ public function inputs_cannot_have_old_values()
             '<x-password/>'
         );
     }
+
+    /** @test */
+    public function nested_inputs_cannot_have_old_values()
+    {
+        $this->flashOld(['login.password' => 'secret']);
+
+        $this->assertComponentRenders(
+            '<input name="login[password]" type="password" id="login[password]" />',
+            '<x-password name="login[password]"/>'
+        );
+    }
 }
diff --git a/tests/Components/Forms/Inputs/PikadayTest.php b/tests/Components/Forms/Inputs/PikadayTest.php
@@ -29,4 +29,16 @@ public function pikaday_can_have_old_values()
 
         $this->assertComponentRenders($expected, '<x-pikaday name="birthday"/>');
     }
+
+    /** @test */
+    public function nested_pikaday_can_have_old_values()
+    {
+        $this->flashOld(['profile.birthday' => '23/03/1989']);
+
+        $expected = <<<HTML
+<input x-data x-init="new Pikaday({ field: \$el , ...{&quot;format&quot;:&quot;DD\/MM\/YYYY&quot;} })" name="profile[birthday]" type="text" id="profile[birthday]" placeholder="DD/MM/YYYY" value="23/03/1989" />
+HTML;
+
+        $this->assertComponentRenders($expected, '<x-pikaday name="profile[birthday]"/>');
+    }
 }
diff --git a/tests/Components/Forms/Inputs/TextareaTest.php b/tests/Components/Forms/Inputs/TextareaTest.php
@@ -36,4 +36,15 @@ public function inputs_can_have_old_values()
             '<x-textarea name="about"/>'
         );
     }
+
+    /** @test */
+    public function nested_inputs_can_have_old_values()
+    {
+        $this->flashOld(['profile.about' => 'About me text']);
+
+        $this->assertComponentRenders(
+            '<textarea name="profile[about]" id="profile[about]" rows="3">About me text</textarea>',
+            '<x-textarea name="profile[about]"/>'
+        );
+    }
 }