Use axiosInstance for all components

src/axios.ts

@@ -5,6 +5,7 @@ import JSONbig from 'json-big'
 const axiosInstance = axios.create({
   baseURL: import.meta.env.VITE_API_URL,
   timeout: 5000,
+  withCredentials: true,
   transformResponse: [
     function transform(data) {
       // Replacing the default transformResponse in axios because this uses JSON.parse and causes problems

src/components/ConeSearch.vue

@@ -26,10 +26,10 @@
 
 <script lang="ts" setup>
 
-import { ref, Ref } from 'vue'
-import axios from 'axios'
-import { useRouter } from 'vue-router'
-import { useAppStore } from '@/store/app'
+import axiosInstance from '@/axios';
+import { useAppStore } from '@/store/app';
+import { ref, Ref } from 'vue';
+import { useRouter } from 'vue-router';
 
 // get the application state store and router
 const store = useAppStore()
@@ -82,7 +82,7 @@ function parseInput(input: string): [string, string, { radius: number, units: st
 
 async function callApi(ra: string, dec: string, { radius, units }: { radius: number, units: string }): Promise<void> {
     const endpoint = import.meta.env.VITE_API_URL + `/query/cone?ra=${ra}&dec=${dec}&radius=${radius}&units=${units}`
-    await axios.get(endpoint)
+    await axiosInstance.get(endpoint)
         .then(response => {
         // Handle the response data
 

src/components/LoginForm.vue

@@ -37,9 +37,9 @@
 
 <script lang="ts" setup>
 
-import { ref } from 'vue'
-import { useAppStore } from '@/store/app'
-import axios from 'axios'
+import axiosInstance from '@/axios';
+import { useAppStore } from '@/store/app';
+import { ref } from 'vue';
 
 // get the application state store
 const store = useAppStore()
@@ -67,7 +67,7 @@ async function login() {
     // login via the valis API
     console.log('logging in now')
 
-    await axios.post(import.meta.env.VITE_API_URL + '/auth/login',
+    await axiosInstance.post(import.meta.env.VITE_API_URL + '/auth/login',
         {"username": user.value, "password": password.value},
         {headers: {'Content-Type': 'multipart/form-data'}})
         .then((response) => {
@@ -84,7 +84,7 @@ async function login() {
 
 async function get_user() {
     // get the user member info
-    await axios.post(import.meta.env.VITE_API_URL + '/auth/user', {}, {headers: store.get_auth_hdr()})
+    await axiosInstance.post(import.meta.env.VITE_API_URL + '/auth/user', {}, {headers: store.get_auth_hdr()})
         .then((response) => {
             // store the user info
             store.user = response.data

src/components/ReleaseSelect.vue

@@ -16,10 +16,9 @@
 // see https://vuejs.org/guide/introduction.html#api-styles
 // and https://vuejs.org/api/sfc-script-setup.html
 
-import { computed } from 'vue'
-import axios from 'axios'
-import { onMounted } from 'vue'
-import { useAppStore } from '@/store/app'
+import axiosInstance from '@/axios';
+import { useAppStore } from '@/store/app';
+import { computed, onMounted } from 'vue';
 
 // get the application state store
 const store = useAppStore()
@@ -45,7 +44,7 @@ async function get_releases() {
 
     // function to get the data release from Valis
     // using public = false and a hard-coded public release to get all releases
-    await axios.get(import.meta.env.VITE_API_URL + '/envs/releases?public=False&release=DR17')
+    await axiosInstance.get(import.meta.env.VITE_API_URL + '/envs/releases?public=False&release=DR17')
         .then((response) => {
             console.log('resp data', response.data)
             // remove the MPLs and work release

src/components/Solara.vue

@@ -7,8 +7,8 @@
 
 <script lang="ts" setup>
 
-import axios from 'axios'
-import { ref, onMounted } from 'vue'
+import axiosInstance from '@/axios';
+import { onMounted, ref } from 'vue';
 
 
 // define which properties are passed in from the parent, i.e. ":xxx"
@@ -27,7 +27,7 @@ console.log('url', url)
 
 async function check_solara() {
 
-    await axios.get(import.meta.env.VITE_API_URL + '/solara/embed/', {withCredentials: true})
+    await axiosInstance.get(import.meta.env.VITE_API_URL + '/solara/embed/', {withCredentials: true})
         .then((response) => {
             console.log('solara response', response)
             valid.value = true

src/components/TargetResolver.vue

@@ -28,8 +28,8 @@
 
 <script lang="ts" setup>
 
-import { ref, defineProps, watch} from 'vue'
-import axios from 'axios'
+import axiosInstance from '@/axios';
+import { defineProps, ref, watch } from 'vue';
 
 // define which properties are passed in from the parent, i.e. ":xxx"
 const props = defineProps<{
@@ -54,7 +54,7 @@ async function fetchResolutionResults() {
     // resolve the target coordinates using the valis endpoint
     const url = import.meta.env.VITE_API_URL + `/target/resolve/coord?coord=${props.ra}&coord=${props.dec}&cunit=deg&radius=3&runit=arcmin`;
 
-    await axios.get(url)
+    await axiosInstance.get(url)
     .then((response) => {
         results.value = response.data
     })
@@ -71,4 +71,4 @@ watch(dialog, async (newVal) => {
 })
 
 
-</script>
+</script>