[2.x] Upgrade Inertia

[claudiodekker]

This PR upgrades Jetstream to support and make use of the features shipped with @inertiajs/inertia-vue version 0.5.0.

Specifically, it migrates away from jetstream-js in favor of Inertia's own form helper, removes explicit 'error bag' definitions where possible, and also fixes a couple other minor issues found during this migration.

[reinink]

Oh my, the simplification here! 😍

[reinink]

This looks awesome @claudiodekker! The only thing I'm left wondering is whether any of the errorBag stuff is even required anymore, given that the errors are all automatically scoped to the individual forms? But maybe we do, simply because they are defined server-side as well, and I'm not sure we can remove them from there, as that code might be shared with Livewire.

One think I'm pretty sure we can remove is the shared errorBags data, as this is all handled through the errors prop now:

jetstream/src/Http/Middleware/ShareInertiaData.php

Lines 53 to 57 in bbaa2cb

	'errorBags' => function () {
	return collect(optional(Session::get('errors'))->getBags() ?: [])->mapWithKeys(function ($bag, $key) {
	return [$key => $bag->messages()];
	})->all();
	},

[taylorotwell]

Nice! ❤️

One thing I'm curious about is the removal of recentlySuccessful. That was pretty convenient compared to adding a separate "success" boolean variable for each form like in this PR. Is there a specific reason that wasn't ported over?

[claudiodekker]

Haha, thanks!

Yeah, @reinink and I had discussed it, and almost added it yesterday, but basically we found it difficult to really put a finger on when a form is considered recently submitted, and at what point it's modified too much (e.g. resetting fields or clearing errors) and should no longer be considered as such.

I think I can also speak for the both of us when I say that we do see the use cases & added value of something like this, but because we really wanted to get this release out of the door and didn't want to last-minute ship something we'd end up regretting, we decided to simply shelve the idea for now and to just implement it with local state instead.

Merry Christmas! 🎄

[bonzai]

There are still files that use form.recentlySuccessful:

• UpdateProfileInformationForm.vue#L60
• UpdateTeamNameForm.vue#l41

Also, text in ActionMessage component doesn't disappear anymore, so I think you should either try to fix it or remove the <transition> component in ActionMessage.vue.

[claudiodekker]

Thanks @bonzai! 👍

@taylorotwell Only after @bonzai's comment just now I noticed that recentlySuccessful in jetstream-js automatically resets after 2 seconds, which is something that I hadn't noticed before, and I don't think @reinink had either. I'll discuss this with him tomorrow, as this means that the implementation suddenly becomes very simple and makes a lot of sense

[taylorotwell]

@claudiodekker Thanks. Yeah, it was nice for transitions and such on those Saved indicators that fade out in Jetstream.

[claudiodekker]

@taylorotwell Done! We've added recentlySuccessful as of inertiajs/inertia#374 and have implemented those changes.

At the same time I made a few tweaks to some sensitive forms, to directly clear passwords from the page on the close of the model they're being shown in, instead of only when that model gets re-opened. 👍

[bonzai]

ConfirmsPassword.vue#L7:

-<jet-dialog-modal :show="confirmingPassword" @close="confirmingPassword = false">
+<jet-dialog-modal :show="confirmingPassword" @close="closeModal">

DeleteUserForm.vue#L23:

-<jet-dialog-modal :show="confirmingUserDeletion" @close="confirmingUserDeletion = false">
+<jet-dialog-modal :show="confirmingUserDeletion" @close="closeModal">

LogoutOtherBrowserSessionsForm.vue#L57:

-<jet-dialog-modal :show="confirmingLogout" @close="confirmingLogout = false">
+<jet-dialog-modal :show="confirmingLogout" @close="closeModal">

[claudiodekker]

@bonzai Thanks a lot for the review(s)! 💪 👍

[markvesterskov]

@claudiodekker I'm checking this pull request out, its awesome!

Shouldnt the Fortify actions be updated to not use error bags as well? eg. stubs/app/Actions/Fortify/UpdateUserProfileInformation.php

[claudiodekker]

@markvesterskov I'd like that, but you have to remember that Jetstream is just one implementation of Fortify. If we were to remove the error bags from there, it'd break any other Jetstream-like packages that may exist and rely on them being set.

This is also why some Inertia forms/requests in this PR still use a manually defined error bag, even after this PR.

[markvesterskov]

@markvesterskov I'd like that, but you have to remember that Jetstream is just one implementation of Fortify. If we were to remove the error bags from there, it'd break any other Jetstream-like packages that may exist and rely on them being set.

This is also why some Inertia forms/requests in this PR still use a manually defined error bag, even after this PR.

@claudiodekker Makes great sense, thanks for the reply, and thanks for the awesomeness with Jetstream and Inertia - I'm working on a new project using the master branch and it is a pleasure to work with.