Update to Livewire 3

flightsadmin · Jan 23, 2025 · ca72fd2 · ca72fd2
1 parent 3de65fc
commit ca72fd2
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 76 deletions.
diff --git a/resources/install/resources/views/layouts/app.blade.php.stub b/resources/install/resources/views/layouts/app.blade.php.stub
@@ -15,7 +15,6 @@
 
     <!-- Scripts -->
     @vite(['resources/js/app.js'])
-    @livewireStyles
 </head>
 <body>
     <div id="app">
@@ -79,13 +78,9 @@
             @yield('content')
         </main>
     </div>
-    @livewireScripts
     <script type="module">
-        const addModal = new bootstrap.Modal('#createDataModal');
-        const editModal = new bootstrap.Modal('#updateDataModal');
         window.addEventListener('closeModal', () => {
-           addModal.hide();
-           editModal.hide();
+            bootstrap.Modal.getInstance(document.getElementById('DataModal')).hide();
         })
     </script>
 </body>

diff --git a/src/Commands/LivewireGeneratorCommand.php b/src/Commands/LivewireGeneratorCommand.php
@@ -447,7 +447,7 @@ protected function modelReplacements()
 
             // Add quotes to the unwanted columns for fillable
             array_walk($filterColumns, function (&$value) {
-                $value = "\n\t\t\t'" . $value . "' => \$this-> " . $value;
+                $value = "\n\t\t\t\t'" . $value . "' => \$this-> " . $value;
             });
 
             // CSV format
@@ -475,7 +475,7 @@ protected function modelReplacements()
 
             // Add quotes to the unwanted columns for fillable */
             array_walk($filterColumns, function (&$value) {
-                $value = "\n\t\t\t'" . $value . "' => \$this->faker->name,";
+                $value = "\n\t\t\t'" . $value . "' => fake()->name(),";
             });
 
             // CSV format

diff --git a/src/stubs/Livewire.stub b/src/stubs/Livewire.stub
@@ -1,10 +1,11 @@
 <?php
 
-namespace App\Http\Livewire;
+namespace App\Livewire;
 
 use Livewire\Component;
 use Livewire\WithPagination;
 use App\Models\{{modelName}};
+use Livewire\Attributes\Computed;
 
 class {{modelName}}s extends Component
 {
@@ -13,57 +14,50 @@ class {{modelName}}s extends Component
 	protected $paginationTheme = 'bootstrap';
     public $selected_id, $keyWord, {{updatefield}};
 
-    public function render()
-    {
-		$keyWord = '%'.$this->keyWord .'%';
-        return view('livewire.{{modelNamePluralLowerCase}}.view', [
-            '{{modelNamePluralLowerCase}}' => {{modelName}}::latest(){{search}}
-						->paginate(10),
-        ]);
-    }
+    #[Computed]
+	public function filtered{{modelName}}s()
+	{
+		$keyWord = '%' . $this->keyWord . '%';
+		return {{modelName}}::latest()
+			->where(function ($query) use ($keyWord) {
+				$query{{search}};
+			})
+			->paginate(10);
+	}
+
+	public function render()
+	{
+		return view('livewire.{{modelNamePluralLowerCase}}.view', [
+			'{{modelNamePluralLowerCase}}' => $this->filtered{{modelName}}s,
+		]);
+	}
 
     public function cancel()
     {
-        $this->resetInput();
-    }
-
-    private function resetInput()
-    {		{{resetfields}}
+        $this->reset();
     }
 
-    public function store()
+    public function save()
     {
         $this->validate([{{rules}}
         ]);
 
-        {{modelName}}::create([ {{addfields}}
-        ]);
-
-        $this->resetInput();
-		$this->dispatchBrowserEvent('closeModal');
-		session()->flash('message', '{{modelName}} Successfully created.');
-    }
+        Flight::updateOrCreate(
+			['id' => $this->selected_id],
+			[{{addfields}}
+			]
+		);
 
-    public function edit($id)
-    {
-        $record = {{modelName}}::findOrFail($id);
-        $this->selected_id = $id; {{editfields}}
+        $message = $this->selected_id ? '{{modelName}} Successfully updated.' : '{{modelName}} Successfully created.';
+		$this->dispatch('closeModal');
+        $this->reset();
+		session()->flash('message', $message);
     }
 
-    public function update()
+    public function edit($id)
     {
-        $this->validate([{{rules}}
-        ]);
-
-        if ($this->selected_id) {
-			$record = {{modelName}}::find($this->selected_id);
-            $record->update([ {{addfields}}
-            ]);
-
-            $this->resetInput();
-            $this->dispatchBrowserEvent('closeModal');
-			session()->flash('message', '{{modelName}} Successfully updated.');
-        }
+        $this->selected_id = $id;
+		$this->fill({{modelName}}::findOrFail($id)->toArray());
     }
 
     public function destroy($id)

diff --git a/src/stubs/views/modals.stub b/src/stubs/views/modals.stub
@@ -1,40 +1,22 @@
-<!-- Add Modal -->
-<div wire:ignore.self class="modal fade" id="createDataModal" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="createDataModalLabel" aria-hidden="true">
+<!-- Modal -->
+<div wire:ignore.self class="modal fade" id="DataModal" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="DataModalLabel" aria-hidden="true">
     <div class="modal-dialog" role="document">
         <div class="modal-content">
             <div class="modal-header">
-                <h5 class="modal-title" id="createDataModalLabel">Create New {{modelTitle}}</h5>
+                <h5 class="modal-title" id="DataModalLabel">{{ $selected_id ? 'Update {{modelTitle}}' : 'Create {{modelTitle}}' }}</h5>
                 <button wire:click.prevent="cancel()" type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
            <div class="modal-body">
-				<form>{{form}}
+				<form>
+                @if ($selected_id)
+                    <input type="hidden" wire:model="selected_id">
+                @endif{{form}}
                 </form>
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-secondary close-btn" data-bs-dismiss="modal">Close</button>
-                <button type="button" wire:click.prevent="store()" class="btn btn-primary">Save</button>
+                <button type="button" wire:click.prevent="save()" class="btn btn-primary">{{ $selected_id ? 'Update' : 'Create' }}</button>
             </div>
         </div>
     </div>
-</div>
-
-<!-- Edit Modal -->
-<div wire:ignore.self class="modal fade" id="updateDataModal" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel" aria-hidden="true">
-    <div class="modal-dialog" role="document">
-       <div class="modal-content">
-            <div class="modal-header">
-                <h5 class="modal-title" id="updateModalLabel">Update {{modelTitle}}</h5>
-                <button wire:click.prevent="cancel()" type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            </div>
-            <div class="modal-body">
-                <form>
-					<input type="hidden" wire:model="selected_id">{{form}}
-                </form>
-            </div>
-            <div class="modal-footer">
-                <button type="button" wire:click.prevent="cancel()" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                <button type="button" wire:click.prevent="update()" class="btn btn-primary">Save</button>
-            </div>
-       </div>
-    </div>
-</div>
+</div>
diff --git a/src/stubs/views/view.stub b/src/stubs/views/view.stub
@@ -15,7 +15,7 @@
 						<div>
 							<input wire:model.live='keyWord' type="text" class="form-control" name="search" id="search" placeholder="Search {{modelTitle}}s">
 						</div>
-						<div class="btn btn-sm btn-info" data-bs-toggle="modal" data-bs-target="#createDataModal">
+						<div class="btn btn-sm btn-info" data-bs-toggle="modal" data-bs-target="#DataModal">
 						<i class="bi-plus-lg"></i>  Add {{modelTitle}}s
 						</div>
 					</div>
@@ -39,7 +39,7 @@
 											Actions
 										</a>
 										<ul class="dropdown-menu">
-											<li><a data-bs-toggle="modal" data-bs-target="#updateDataModal" class="dropdown-item" wire:click="edit({{$row->id}})"><i class="bi-pencil-square"></i> Edit </a></li>
+											<li><a data-bs-toggle="modal" data-bs-target="#DataModal" class="dropdown-item" wire:click="edit({{$row->id}})"><i class="bi-pencil-square"></i> Edit </a></li>
 											<li><a class="dropdown-item" onclick="confirm('Confirm Delete {{modelTitle}} id {{$row->id}}? \nDeleted {{modelTitle}}s cannot be recovered!')||event.stopImmediatePropagation()" wire:click="destroy({{$row->id}})"><i class="bi-trash3-fill"></i> Delete </a></li>  
 										</ul>
 									</div>