# Routing

### Configure Route

Open `resources\ts\plugins\1.router\guards.ts` You will find the below example code. In the below code, we have shown routes. **default** is the main layout routing you see after login.

```typescript
router.beforeEach((to) => {
    /*  for page loader (before page load it is show) */
    const uiStore = useUIStore();

    uiStore.isLoading = true;

    /*
     * If it's a public route, continue navigation. This kind of pages are allowed to visited by login & non-login users. Basically, without any restrictions.
     * Examples of public routes are, 404, under maintenance, etc.
     */
    if (to.meta.public) return;

    /**
     * Check if user is logged in by checking if token & user data exists in local storage
     */
    const isLoggedIn = !!(
      useCookie("userData").value && useCookie("accessToken").value
    );

    /*
      If user is logged in and is trying to access login like page, redirect to home
      else allow visiting the page
      (Don't allow executing further by return statement because next code will check for permissions)
     */
    if (to.meta.unauthenticatedOnly) {
      if (isLoggedIn) return "/";
      else return undefined;
    }

    if (!canNavigate(to) && to.matched.length) {
      // Get query string - fallback to getting it directly from URL if reactive value is empty
      let currentQueryString = queryString.value;
      if (!currentQueryString && typeof window !== "undefined") {
        const params = new URLSearchParams(window.location.search);
        currentQueryString = params.toString() ? `?${params.toString()}` : "";
      }

      // Build the full URL properly
      let fullUrl = to.fullPath;

      // Add query string if we have one and it's not already in the URL
      if (currentQueryString) {
        const queryParams = currentQueryString.startsWith("?")
          ? currentQueryString.substring(1)
          : currentQueryString;
        if (queryParams && !to.fullPath.includes(queryParams)) {
          const separator = to.fullPath.includes("?") ? "&" : "?";
          fullUrl = `${to.fullPath}${separator}${queryParams}`;
        }
      }

      return isLoggedIn
        ? { path: "/" }
        : {
            path: `/authentication/auth1/login1`,
            query: {
              ...to.query,
              to: to.fullPath !== "/" ? fullUrl : undefined,
            },
          };
    }
  });
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://phoenixcoded.gitbook.io/able-pro/vue-laravel/development/routing.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.