I'm trying to give the user an option as to whether they want to upload an image or not. Below is my Livewire component (which works fine when the user selects an image, but, of course fails if they do not).
I've read LW's docs and checked several tutorials, but don't know how to set up a condition that checks whether an image has been added or not. Any suggested tutorials or help?
<?php
namespace App\Http\Livewire\Admin\Categories;
use Livewire\Component;
use Livewire\WithFileuploads;
use App\Models\Category;
class AdminCategoryCreate extends Component
{
use WithFileUploads;
public $name;
public $desc;
public $image;
public $rules = [
'name' => ['required', 'string', 'max:70', 'unique:categories,name'],
'desc' => ['nullable', 'string'],
'image' => ['nullable', 'image:mimes:jpg,jpeg,png'],
];
public function create()
{
$data = $this->validate();
$data['image'] = $this->file->store('images', 'public');
Category::create($data);
session()->flash('message', 'Your category was successfully created.');
$this->reset();
return redirect()->route('AdminCategoryIndex');
}
public function render()
{
return view('livewire.admin.categories.admin-category-create')->layout('layouts.admin.admin');
}
}
Here is the Blade file
<form wire:submit.prevent="create" enctype="multipart/form-data"
class="">
<div class="mb-4">
<label for="name" class="font-semibold">Name</label>
<input wire:model="name"
type="text" placeholder="Enter category name..."
class="w-full py-2 text-sm placeholder-gray-400 rounded-lg dark:bg-gray-700 dark:text-gray-400 focus:ring-blue-400"
/>
@error('name') <span class="text-sm text-red-500">{{ $message }}</span> @enderror
</div>
<div class="mb-4">
<label for="desc" class="font-semibold">Description</label>
<textarea wire:model="desc"
type="text" rows="5" placeholder="Enter category description..."
class="w-full py-2 text-sm placeholder-gray-400 rounded-lg dark:bg-gray-700 dark:text-gray-400 focus:ring-blue-400"
/></textarea>
@error('desc') <span class="text-sm text-red-500">{{ $message }}</span> @enderror
</div>
<div class="mb-4">
<label for="desc" class="font-semibold">Image</label>
<input wire:model="image" type="file" />
@error('image') <span class="text-sm text-red-500">{{ $message }}</span> @enderror
</div>
<div class="">
<x-button type="submit" class="py-2 tracking-widest text-white bg-blue-400 dark:bg-blue-500 dark:hover:bg-blue-600 hover:bg-blue-500">
Create New Category
</x-button>
<a href="{{ route('AdminCategoryIndex') }}" class="px-3 py-1.5 cursor-pointer text-xs font-semibold tracking-widest text-white uppercase bg-gray-500 rounded-lg dark:bg-gray-700 dark:hover:bg-gray-900 hover:bg-gray-900">
Cancel
</a>
</div>
</form>