Support programatic navigation from viewModel

[pavsaund]

Is there a way to hook into the history object in a ViewModel so we can navigate programmatically?

I think the only way right now is to do so from a view using the useHistory()-hook from the component, which kinda breaks the flow when we're reacting to changes from within a ViewModel that are not trigger by a user interaction.

Some context: We have a viewmodel set up with a subscription to changes from the portal search. On each change we want to navigate to the search page within the microservice with the search query.

 constructor(private readonly _messenger: IMessenger) {
        _messenger.subscribeTo(
            SearchRequest,
            (request) => { //Navigate using history.push('/search/querystring')} // <---how to access the history object?
        );
    }

[einari]

There is, but lacks documentation. I’ll register an issue for the documentation of it.

But basically you can use a dependency called INavigator:

import { INavigator } from ‘@dolittle/vanir-web/dist/routing’;
import { injectable } from ‘tsyringe’;

@injectable()
export class MyViewModel {
   constructor(private readonly _navigator: INavigator) {
   }

   doStuff() {
      this._.navigator.navigateTo(‘...route’);
   }
}

This will publish a message called NavigatedTo.

This could be leveraged in other parts of your system if you need to know that navigation has occurred.

[einari]

Closing this as it is covered by other issues.