Better use of $attributes and minor fixes

Author: pascalbaljet

CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to `laravel-form-components` will be documented in this file
 
+## 1.0.1 - 2020-07-18
+
+- added `hasErrorAndShow` method to components
+- use `$slot` and added `$attributes` to `form-button`
+- added `$attibutes` to `form-group` and `form-label`
+- fixed translation bug
+
 ## 1.0.0 - 2020-07-17
 
 - initial release

resources/views/tailwind/form-checkbox.blade.php

@@ -13,7 +13,7 @@
         <span class="ml-2">{{ $label }}</span>
     </label>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

resources/views/tailwind/form-errors.blade.php

@@ -1,7 +1,5 @@
-@if($name)
-    @error($name)
-        <p {!! $attributes->merge(['class' => 'text-red-500 text-xs italic']) !!}>
-            {{ $message }}
-        </p>
-    @enderror
-@endif
+@error($name)
+    <p {!! $attributes->merge(['class' => 'text-red-500 text-xs italic']) !!}>
+        {{ $message }}
+    </p>
+@enderror

resources/views/tailwind/form-group.blade.php

@@ -1,11 +1,11 @@
-<div class="mt-4">
+<div {!! $attributes->merge(['class' => 'mt-4']) !!}>
     <x-form-label :label="$label" />
 
     <div class="@if($label) mt-2 @endif @if($inline) flex flex-wrap space-x-6 @endif">
         {!! $slot !!}
     </div>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

resources/views/tailwind/form-input.blade.php

@@ -11,7 +11,7 @@
         />
     </label>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

resources/views/tailwind/form-label.blade.php

@@ -1,3 +1,3 @@
 @if($label)
-    <span class="text-gray-700">{{ $label }}</span>
+    <span {!! $attributes->merge(['class' => 'text-gray-700']) !!}>{{ $label }}</span>
 @endif

resources/views/tailwind/form-radio.blade.php

@@ -13,7 +13,7 @@
         <span class="ml-2">{{ $label }}</span>
     </label>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

resources/views/tailwind/form-select.blade.php

@@ -18,7 +18,7 @@
         </select>
     </label>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

resources/views/tailwind/form-submit.blade.php

@@ -1,5 +1,8 @@
 <div class="mt-6 flex items-center justify-between">
-    <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" type="submit">
-        {{ $label }}
+    <button {!! $attributes->merge([
+        'class' => 'bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline',
+        'type' => 'submit'
+    ]) !!}>
+        {!! trim($slot) ?: __('Submit') !!}
     </button>
 </div>

resources/views/tailwind/form-textarea.blade.php

@@ -8,7 +8,7 @@
             name="{{ $name }}">{!! $value !!}</textarea>
     </label>
 
-    @if($showErrors)
+    @if($hasErrorAndShow($name))
         <x-form-errors :name="$name" />
     @endif
 </div>

src/Components/FormSubmit.php

@@ -4,15 +4,4 @@
 
 class FormSubmit extends Component
 {
-    public string $label;
-
-    /**
-     * Create a new component instance.
-     *
-     * @return void
-     */
-    public function __construct(string $label = '')
-    {
-        $this->label = $label ?: __('Submit');
-    }
 }

src/Components/HandlesDefaultAndOldValue.php

@@ -20,7 +20,9 @@ private function setValue(
 
         $bind = $this->getBoundTarget($bind, $name);
 
-        $default = $bind->getTranslation($name, $language, false) ?: $default;
+        if ($bind) {
+            $default = $bind->getTranslation($name, $language, false) ?: $default;
+        }
 
         $this->value = old("{$name}.{$language}", $default);
     }

src/Components/HandlesValidationErrors.php

@@ -2,7 +2,22 @@
 
 namespace ProtoneMedia\LaravelFormComponents\Components;
 
+use Illuminate\Support\ViewErrorBag;
+
 trait HandlesValidationErrors
 {
     public $showErrors = true;
+
+    public function hasErrorAndShow(string $name, string $bag = 'default'): bool
+    {
+        if (!$this->showErrors) {
+            return false;
+        }
+
+        $errors = request()->session()->get('errors') ?: new ViewErrorBag;
+
+        $name = str_replace(['[', ']'], ['.', ''], $name);
+
+        return $errors->getBag($bag)->has($name);
+    }
 }

tests/Feature/TranslationTest.php

@@ -8,25 +8,35 @@
 class TranslationTest extends TestCase
 {
     /** @test */
-    public function it_can_bind_a_target_to_the_form()
+    public function it_can_have_no_target_bound_to_the_form()
     {
         $this->registerTestRoute('translation');
 
         $this->visit('/translation')
+            ->seeElement('input[name="input[nl]"][value=""]')
+            ->seeElement('input[name="input[en]"][value=""]');
+    }
+
+    /** @test */
+    public function it_can_bind_a_target_to_the_form()
+    {
+        $this->registerTestRoute('translation-with-bind');
+
+        $this->visit('/translation-with-bind')
             ->seeElement('input[name="input[nl]"][value="hallo"]')
             ->seeElement('input[name="input[en]"][value="hello"]');
     }
 
     /** @test */
     public function it_shows_the_validation_errors_and_old_values_correctly()
     {
-        $this->registerTestRoute('translation', function (Request $request) {
+        $this->registerTestRoute('translation-with-bind', function (Request $request) {
             $request->validate([
                 'input.*' => 'min:5',
             ]);
         });
 
-        $this->visit('/translation')
+        $this->visit('/translation-with-bind')
             ->type('hoi', 'input[nl]')
             ->type('hey', 'input[en]')
             ->press('Submit')

tests/Feature/views/translation-with-bind.blade.php

@@ -0,0 +1,13 @@
+@php
+    $target = new \ProtoneMedia\LaravelFormComponents\Tests\Feature\TranslatableModel;
+    $target->setTranslations('input', ['nl' => 'hallo', 'en' => 'hello']);
+@endphp
+
+<x-form>
+    @bind($target)
+        <x-form-input name="input" language="nl" />
+        <x-form-input name="input" language="en" />
+
+        <x-form-submit />
+    @endbind
+</x-form>

tests/Feature/views/translation.blade.php

@@ -1,13 +1,5 @@
-@php
-    $target = new \ProtoneMedia\LaravelFormComponents\Tests\Feature\TranslatableModel;
-    $target->setTranslations('input', ['nl' => 'hallo', 'en' => 'hello']);
-@endphp
-
 <x-form>
-    @bind($target)
-        <x-form-input name="input" language="nl" />
-        <x-form-input name="input" language="en" />
-
-        <x-form-submit />
-    @endbind
+    <x-form-input name="input" language="nl" />
+    <x-form-input name="input" language="en" />
+    <x-form-submit />
 </x-form>