Lesson 2 source

app/Livewire/CreatePost.php

@@ -2,37 +2,27 @@
 
 namespace App\Livewire;
 
-use App\Models\Post;
-use Livewire\Attributes\Validate;
 use Livewire\Component;
+use App\Livewire\Forms\PostForm;
 
 class CreatePost extends Component
 {
-    #[Validate('required|min:5')]
-    public string $title = '';
-
-    #[Validate('required|min:5')]
-    public string $body = '';
+    public PostForm $form;
 
     public bool $success = false;
 
-    public function render()
-    {
-        return view('livewire.create-post');
-    }
-
     public function save(): void
     {
         $this->validate();
 
-        Post::create([
-            'title' => $this->title,
-            'body' => $this->body,
-        ]);
+        $this->form->save();
 
         $this->success = true;
+    }
 
-        $this->reset('title', 'body');
+    public function render()
+    {
+        return view('livewire.create-post');
     }
 
 }

app/Livewire/EditPost.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Livewire;
+
+use App\Models\Post;
+use Livewire\Component;
+use App\Livewire\Forms\PostForm;
+
+class EditPost extends Component
+{
+    public PostForm $form;
+
+    public bool $success = false;
+
+    public function mount(Post $post): void
+    {
+        $this->form->setPost($post);
+    }
+
+    public function update(): void
+    {
+        $this->validate();
+
+        $this->form->update();
+
+        $this->success = true;
+    }
+
+    public function render()
+    {
+        return view('livewire.edit-post');
+    }
+}

app/Livewire/Forms/PostForm.php

@@ -0,0 +1,39 @@
+<?php
+
+namespace App\Livewire\Forms;
+
+use App\Models\Post;
+use Livewire\Attributes\Validate;
+use Livewire\Form;
+
+class PostForm extends Form
+{
+    public ?Post $post;
+
+    #[Validate('required|min:5')]
+    public string $title = '';
+
+    #[Validate('required|min:5')]
+    public string $body = '';
+
+    public function setPost(Post $post): void
+    {
+        $this->post = $post;
+
+        $this->title = $post->title;
+
+        $this->body = $post->body;
+    }
+
+    public function save(): void
+    {
+        Post::create($this->all());
+
+        $this->reset('title', 'body');
+    }
+
+    public function update(): void
+    {
+        $this->post->update($this->all());
+    }
+}

resources/views/livewire/create-post.blade.php

@@ -3,19 +3,19 @@
         <span class="block mb-4 text-green-500">Post saved successfully.</span>
     @endif
 
-    <form method="POST" wire:submit="save">
+    <form wire:submit="save">
         <div>
             <label for="title" class="block font-medium text-sm text-gray-700">Title</label>
-            <input id="title" wire:model="title" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm" type="text" />
-            @error('title')
+            <input id="title" wire:model="form.title" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm" type="text" />
+            @error('form.title')
             <span class="mt-2 text-sm text-red-600">{{ $message }}</span>
             @enderror
         </div>
 
         <div class="mt-4">
             <label for="body" class="block font-medium text-sm text-gray-700">Body</label>
-            <textarea id="body" wire:model="body" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm"></textarea>
-            @error('body')
+            <textarea id="body" wire:model="form.body" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm"></textarea>
+            @error('form.body')
             <span class="mt-2 text-sm text-red-600">{{ $message }}</span>
             @enderror
         </div>

resources/views/livewire/edit-post.blade.php

@@ -0,0 +1,27 @@
+<div>
+    @if($success)
+        <span class="block mb-4 text-green-500">Post saved successfully.</span>
+    @endif
+
+    <form wire:submit="update">
+        <div>
+            <label for="title" class="block font-medium text-sm text-gray-700">Title</label>
+            <input id="title" wire:model="form.title" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm" type="text" />
+            @error('form.title')
+            <span class="mt-2 text-sm text-red-600">{{ $message }}</span>
+            @enderror
+        </div>
+
+        <div class="mt-4">
+            <label for="body" class="block font-medium text-sm text-gray-700">Body</label>
+            <textarea id="body" wire:model="form.body" class="block mt-1 w-full border-gray-300 rounded-md shadow-sm"></textarea>
+            @error('form.body')
+            <span class="mt-2 text-sm text-red-600">{{ $message }}</span>
+            @enderror
+        </div>
+
+        <button class="mt-4 px-4 py-2 bg-gray-800 rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700">
+            Save
+        </button>
+    </form>
+</div>

resources/views/posts/edit.blade.php

@@ -0,0 +1,17 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
+            {{ __('Edit Post') }}
+        </h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
+                <div class="p-6 text-gray-900 dark:text-gray-100">
+                    <livewire:edit-post :post="$post" />
+                </div>
+            </div>
+        </div>
+    </div>
+</x-app-layout>

routes/web.php

@@ -29,4 +29,5 @@
 
 require __DIR__.'/auth.php';
 
-Route::view('posts/create', 'posts.create');
+Route::view('posts/create', 'posts.create');
+Route::view('posts/{post}/edit', 'posts.edit');