router

import Vue from "vue";
import Router from "vue-router";
import Signup from "./views/Signup.vue";
import Signin from "./views/Signin.vue";
import Home from "./components/ClientsComponent";
import axios from "axios";
import { API_URL } from "./constants";

const url = API_URL + "secret";

Vue.use(Router);

async function validateJWT() {
  if (localStorage.token) {
    const config = {
      headers: { Authorization: `Bearer ${localStorage.token}` },
    };

    let validated = false;

    await axios.get(url, config).then(function(response) {
      console.log( response );
      return response.status === 200;
    });
  } else {
    return false;
  }
}

const router = new Router({
  mode: "history",
  routes: [
    {
      path: "/signup",
      name: "signup",
      component: Signup,
    },
    {
      path: "/signin",
      name: "signin",
      component: Signin,
    },
    {
      path: "/",
      name: "Home",
      component: Home,
    },
  ],
});

// protect the access
router.beforeEach((to, from, next) => {
  const publicPages = ['/signin', '/signup'];
  const authRequired = !publicPages.includes(to.path);
  const token = localStorage.getItem('token');

  // trying to access a restricted page + not logged in
  // redirect to login page
  if (authRequired && !token) {
    next('/signin');
  } else {
    validateJWT().then(() => {
      next();
    })
  }
});

export default router;