buttons work now after style tags removed

app/Http/Livewire/OauthClients.php

@@ -2,7 +2,7 @@
 
 namespace App\Http\Livewire;
 
-use Illuminate\Support\Facades\Auth;
+use Laravel\Passport\Client;
 use Laravel\Passport\ClientRepository;
 use Livewire\Component;
 
@@ -29,11 +29,12 @@ class OauthClients extends Component
 
         //$newClient = ;
 
-        $this->dispatchBrowserEvent('clientCreated', $newClient->accessToken);
+        //$this->dispatchBrowserEvent('clientCreated', $newClient->accessToken);
     }
 
-    public function deleteClient($clientId): void
+    public function deleteClient(Client $clientId): void
     {
-        Auth::user()->clients()->find($clientId)->delete();
+        //->delete must be of type Client - thus the model binding
+        app(ClientRepository::class)->delete($clientId);
     }
 }

resources/views/livewire/oauth-clients.blade.php

@@ -1,15 +1,4 @@
-<style scoped>
-    .action-link {
-        cursor: pointer;
-    }
-
-    .m-b-none {
-        margin-bottom: 0;
-    }
-</style>
-
-<template>
-    <div>
+<div>
     <div class="panel panel-default">
         <div class="panel-heading">
             <div style="display: flex; justify-content: space-between; align-items: center;">
@@ -34,9 +23,7 @@
             @endif
 
             @if($clients->count() > 0)
-                    <table class="table table-borderless m-b-none"
-    {{--                       v-if="clients.length > 0"--}}
-                    >
+                <table class="table table-borderless m-b-none">
                     <thead>
                         <tr>
                             <th>Client ID</th>
@@ -49,8 +36,7 @@
 
                     <tbody>
                         @foreach($clients as $client)
-                            <tr
-                            >
+                            <tr>
                                 <!-- ID -->
                                 <td style="vertical-align: middle;">
                                     {{ $client->id }}
@@ -76,11 +62,9 @@
                                 </td>
 
                                 <!-- Delete Button -->
-                                <td style="vertical-align: middle;">
-                                    <a class="action-link btn btn-danger btn-sm"
-                                       wire:click="deleteClient('{{ $client->id }}')"
-                                    >
-                                        Delete
+                                <td style="vertical-align: middle;" class="text-right">
+                                    <a class="action-link btn btn-danger btn-sm" wire:click="deleteClient('{{ $client->id }}')">
+                                        <i class="fas fa-trash"></i>
                                     </a>
                                 </td>
                             </tr>
@@ -174,7 +158,7 @@
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header">
-                        <button type="button " class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
 
                     <h4 class="modal-title">
                         Edit Client
@@ -246,5 +230,7 @@
             </div>
         </div>
     </div>
-    </div>
-</template>
+    <script>
+
+    </script>
+</div>

resources/views/settings/api.blade.php

@@ -15,7 +15,7 @@
     @if (!config('app.lock_passwords'))
         <div id="app">
             <livewire:oauth-clients />
-            <passport-clients clients-url="{{ url('oauth/clients') }}"></passport-clients>
+{{--            <passport-clients clients-url="{{ url('oauth/clients') }}"></passport-clients>--}}
             <passport-authorized-clients clients-url="{{ url('oauth/clients') }}" tokens-url="{{ url('oauth/tokens') }}"></passport-authorized-clients>
         </div>
     @else