i can't blame this on livewire - animations or something?

This commit is contained in:
spencerrlongg 2023-11-16 11:24:54 -06:00
parent a9d82bf157
commit c3e02286d3
2 changed files with 16 additions and 1 deletions

View file

@ -12,6 +12,13 @@ class PersonalAccessTokens extends Component
public $name; public $name;
public $newTokenString; public $newTokenString;
protected $listeners = ['openModal' => 'autoFocusModalEvent'];
public function autoFocusModalEvent()
{
$this->dispatchBrowserEvent('autoFocusModal');
}
public function render() public function render()
{ {
return view('livewire.personal-access-tokens', [ return view('livewire.personal-access-tokens', [

View file

@ -4,6 +4,7 @@
<div class="text-right" style="display: flex; justify-content: space-between; align-items: center;"> <div class="text-right" style="display: flex; justify-content: space-between; align-items: center;">
<a class="btn btn-info btn-sm action-link pull-right" <a class="btn btn-info btn-sm action-link pull-right"
onclick="$('#modal-create-token').modal('show');" onclick="$('#modal-create-token').modal('show');"
wire:click="$emit('openModal')"
> >
Create New Token Create New Token
</a> </a>
@ -98,6 +99,7 @@
wire:keydown.enter="createToken(name)" wire:keydown.enter="createToken(name)"
{{-- defer because it's submitting as i type if i don't --}} {{-- defer because it's submitting as i type if i don't --}}
wire:model.defer="name" wire:model.defer="name"
autofocus
> >
</div> </div>
@ -175,10 +177,16 @@
</div> </div>
</div> </div>
<script> <script>
window.addEventListener('tokenCreated', token => { window.addEventListener('tokenCreated', function() {
$('#modal-create-token').modal('hide'); $('#modal-create-token').modal('hide');
$('#modal-access-token').modal('show'); $('#modal-access-token').modal('show');
}) })
window.addEventListener('autoFocusModal', function() {
$('#modal-create-token').on('shown.bs.modal', function() {
$(this).find('[autofocus]').focus();
});
})
// was trying to do a submit on the form when enter was pressed
window.addEventListener("keydown", function (event) { window.addEventListener("keydown", function (event) {
if (event.key === 'Enter') { if (event.key === 'Enter') {
event.preventDefault(); event.preventDefault();