I tried exactly the same process (different component name) and got exactly the same results - no success/error message but also no modal. Did you ever figure anything out?
Laravel Nova custom action response modal
I'm trying to register and use action response modal.
To start, I generated an asset with:
php artisan nova:asset acme/ApiTokenCopier
It then generates the nova-components folder, npm dependences, assets, etc Then I created a components folder with a custom modal in a vue file. nova-components/ApiTokenCopier/resources/js/components/ApiTokenCopier.vue
<template>
<modal
@modal-close="handleClose"
data-testid="ApiTokenCopier"
tabindex="-1"
role="dialogue"
>
<div class="bg-white rounded-lg shadow-lg overflow-hidden" style="width: 400px">
<p class="text-80 px-8 my-8">{{ data.message } </p>
<p class="text-80 px-8 my-8">{{ data.token } </p>
</div>
<div class="bg-white rounded-lg shadow-lg overflow-hidden" style="width: 400px">
<button
class="bg-primary text-white h-9 p-4" type="button"
@click.prevent="handleClose()"
>
Close
</button>
</div>
</modal>
</template>
<script>
export default {
props:{
data:{ type: Object },
},
methods:{
handleClose(){
this.$emit('close')
},
},
}
</script>
Next, I went to register the component for use: In the generated app/nova-components/ApiTokenCopier/resources/js/asset.js file
import ApiTokenCopier from './components/ApiTokenCopier'
Nova.booting(app => {
app.component('ApiTokenCopier', ApiTokenCopier)
})
After registering, I navigated back to /nova-components/ApiTokenCopier and ran these commands to compile/build the asset files.
npm run dev && npm run prod
Lastly, I went to my nova action file, and in the handle() method added:
return Action::modal('ApiTokenCopier', [
'message' => 'The API token was generated!',
'token' => $token,
]);
Yet when that action is activated, it succeeds but the modal doesn't appear. No errors either, so I'm not really sure what could be wrong. I'm either missing a step/connection somewhere or I've done something incorrectly unknowingly. Any input would be appreciated.
Please or to participate in this conversation.