Finish user delete function

Author: perisicnikola37

app/Http/Controllers/UserController.php

@@ -63,6 +63,8 @@ public function update(Request $request, string $id)
      */
     public function destroy(string $id)
     {
-        //
+        User::destroy($id);
+
+        return back();
     }
-}
+}

app/Models/User.php

@@ -56,9 +56,10 @@ class User extends Authenticatable
      *
      * @var array<int, string>
      */
-    // protected $appends = [
-    //     'profile_photo_url',
-    // ];
+    protected $appends = [
+        'profile_photo_url',
+        'formatted_created_at'
+    ];
 
     public function getFormattedCreatedAtAttribute()
     {

resources/js/Pages/Roles/Index.vue

@@ -66,7 +66,7 @@
                             <tr v-for="role in roles" :key="role.id">
                                 <td class="px-6 py-4 whitespace-nowrap">
                                     <div class="flex items-center justify-center">
-                                        <div class="ml-4">
+                                        <div>
                                             <div class="text-sm font-medium text-gray-900">
                                                 {{ role.id }}
                                             </div>

resources/js/Pages/Users/Index.vue

@@ -65,18 +65,21 @@
 									</td>
 									<td class="px-6 py-4 whitespace-nowrap">
 										<div class="text-sm text-center text-gray-900">
+											<!-- Clickable user email address -->
 											<a :href="'mailto:' + user.email">{{ user.email }}</a>
 										</div>
 									</td>
 									<td class="px-6 py-4 whitespace-nowrap">
 										<div class="text-sm text-center text-gray-900">
-											{{ user.role.name }}
+											<!-- Covering the case when there is no role -->
+											{{ user.role ? user.role.name : 'Not available' }}
 										</div>
 									</td>
 									<td class="px-6 py-4 text-center whitespace-nowrap">
 										<span
 											class="inline-flex px-2 text-xs font-semibold leading-5 text-green-800 bg-green-100 rounded-full">
-											<!-- {{ user.formatted_created_at }} -->
+											<!-- Formatted from user model appends propety -->
+											{{ user.formatted_created_at }}
 										</span>
 									</td>
 									<td class="px-6 py-4 text-sm font-medium text-right whitespace-nowrap">
@@ -118,6 +121,12 @@ export default {
 	},
 	props: {
 		users: Object
+	},
+	methods: {
+		deleteUser(user) {
+			if (!confirm('Are you sure you want to delete user?')) return;
+			this.$inertia.delete(route('users.destroy', user.id));
+		}
 	}
 }
 </script>