Remove use of handler
functions in favour of Vue router route guards and loading data in the component setup function
#12875
Labels
TODO: needs clarification
Insufficient information to proceed
Current state
As a way to consistently handle data loading and redirection, we implemented a special wrapper for Vue Router that allows routes to define a
handler
property that is responsible for loading the data required to view the main page.This was deeply interconnected with some of our previous architecture that we have now phased out, such as the CoreBase component, the shared page state vuex state (now mostly, but not completely, unused), the "same page" tracker that was previously used for ConditionalPromise resolution, but now is used in a few places to prevent outdated requests from updating vuex state, and the global loading state. Lastly, a lot of this was done because of the limitations of route level guards, whereby only a routeEnter guard can be defined.
Expected state
Instead of our custom handler function, we should be using a combination of the existing route (which the handler functionality uses under the hood, but through a global guard, rather than route specific) and component guards, and defer data loading to composables and the
setup
function of the route component.For an (imperfect) example of a starting point on this work, the learn SPA handlers have been mostly reduced to stubs that do nothing more than handle redirect behaviour: https://github.com/learningequality/kolibri/blob/develop/kolibri/plugins/learn/assets/src/routes/index.js#L45
As such, Learn would be the easiest place to start, and see if the handler behaviour can be replaced by a
beforeEnter
route guard. This may not be possible, because some of the checks need to happen not just on route enter, but also route update - in this case, any logic would have to be handled in route guards in the route component, and not on the route itself.c.f. https://v3.router.vuejs.org/guide/advanced/navigation-guards.html#per-route-guard vs https://v3.router.vuejs.org/guide/advanced/navigation-guards.html#in-component-guards
Related issues
This is also interconnected with this issue, in coach specifically: #11219
The text was updated successfully, but these errors were encountered: