Once you've followed the process of Granting access to the dependencies you're able to install the Navigators by running the npm command:

npm i @oasis/masiv-navigators

# or upgrade to the latest version

npm update @oasis/masiv-navigators

IMPORTANT! Latest stable version: 1.0.4

After that, just go ahead and import the library in the main.js file of your project /src folder as follows:

import OasisNavigators from '@oasis/masiv-navigators';

// You must pass the store as a parameter
Vue.use(OasisNavigators, { store });

Using Navigators

To make use of the Navigators in your project, just go to the App.vue file and add the following code:

<template>
  <aq-main-layout>
    <router-view />
  </aq-main-layout>
</template>

Internationalization

To use internationalization, you should pass the internationalization prop as follows:

<template>
  <aq-main-layout internationalization>
    <router-view />
  </aq-main-layout>
</template>

Hide side menu

If you need to hide the side menu, you can make use of the hideMenu prop.

<template>
  <aq-main-layout hide-menu>
    <router-view />
  </aq-main-layout>
</template>

Show chatbot

Chatbot component is hidden by default.

To include the chatbot in your micro frontend, just pass the show-chat prop.

<template>
  <aq-main-layout show-chat>
    <router-view />
  </aq-main-layout>
</template>

Show Modal ChangePassword

Change Password Modal is hidden by default.