Filament•17mo ago

Wizard steps / pages - hybrid

My app includes a workflow with a lot of steps. I started out using a Wizard. But I'm running into some problems now; - apparently there are steps that include some sub-wizard inside, where you can add related items, including custom buttons to send notifications, etc. - steps need custom actions, not only on the last step - steps need to be saved separately All in all, I figured that a Wizard isn't suited for my case. So I switched to a bunch of custom Resource Pages. Every page contains what used to be a Wizard Step. And on the left side, tab links to all the other pages. Every "step" is a simple <a href> link to another Page. Which of course means full page reloads and content jumping around. I'm afraid I'm not very experienced in Livewire and even less in Alpine. Would it be hard to refactor my current approach to mimic the Wizard behaviour?

10 Replies

Unknown User•17mo ago

Message Not Public

JohnOP•17mo ago

I'm looking for an alternative, yes. I'm looking to this now: https://filamentphp.com/docs/2.x/forms/getting-started#using-multiple-forms I guess I need that anyway if I want each step to be a separate form. I guess what I'm saying is, I don't want a Wizard. I want a page with tabs, each tab containing a separate form with separate actions. The complete thing loaded at once, switching tabs client side.

Unknown User•17mo ago

Message Not Public

JohnOP•17mo ago

Nah. They have the same "problem" as Wizards. I need custom actions per tab. Some tabs contain custom forms and multiple (sub)pages.

awcodes•17mo ago

With this much level of functionality it would probably be best to build the whole thing as a custom livewire component and use it on a custom page. Then you’ll have complete control over how it all works, including the view.

JohnOP•17mo ago

Yea I think so too. I guess I'll still need a custom page (https://filamentphp.com/docs/2.x/admin/resources/custom-pages), and build something with https://filamentphp.com/docs/2.x/forms/getting-started#using-multiple-forms and peek at Wizard how to handle the "tabs" client side...

awcodes•17mo ago

Yea. Personally I would stay away from tabs though so you can prevent users from going to other steps if there’s validation errors on any of the previous steps. If that’s a requirement.

JohnOP•17mo ago

Actually, in the old project I'm rebuilding, every field is saved on change. So I'm going to

            ->lazy()
            ->afterStateUpdated(function (?Model $record, Field $component, $state) {
                if (!$record) {
                    return;
                }

                $record->{$component->getStatePath(false)} = $state;
                $record->save();
            })

            ->lazy()
            ->afterStateUpdated(function (?Model $record, Field $component, $state) {
                if (!$record) {
                    return;
                }

                $record->{$component->getStatePath(false)} = $state;
                $record->save();
            })

every field. This skips validation. Which is good, because it's more like a draft save. When a "step" is proceeded to the next step with a custom action, I do want validation to trigger. Only then change some statuses, do some backend stuff.

awcodes•17mo ago

Yea, was just mentioning possible caveats. Good luck. Could be a good use case / blog article when you get it all working.

JohnOP•17mo ago

Thanks! Much appreciated. @Kaas Thanks to you too!

Gaming

Programming

Wizard steps / pages - hybrid