integration with marbas

Dockerfile

@@ -8,5 +8,6 @@ RUN npm run build
 FROM nginx:alpine
 ENV NGINX_ENVSUBST_OUTPUT_DIR=/usr/share/nginx/html
 COPY --from=build /app/dist /usr/share/nginx/html
-RUN mv -rf /usr/share/nginx/html/index.html /etc/nginx/templates/index.html.template
+RUN mkdir etc/nginx/templates && \
+    mv /usr/share/nginx/html/index.html /etc/nginx/templates/index.html.template
 COPY nginx.conf /etc/nginx/conf.d/default.conf

src/market/acquisition/AcquiredItem.ts

@@ -1,8 +0,0 @@
-import { MarketType } from "..";
-import { AcquiredMarketItem } from "./acquisition";
-
-export type AcquiredItem = Omit<AcquiredMarketItem, 'type'> & {
-    type: MarketType,
-    buy: number,
-    sell: number
-}

src/market/acquisition/AcquiredType.ts

@@ -0,0 +1,8 @@
+import { MarketType } from "..";
+import { AcquiredMarketType } from "./acquisition";
+
+export type AcquiredType = Omit<AcquiredMarketType, 'type'> & {
+    type: MarketType,
+    buy: number,
+    sell: number
+}

src/market/acquisition/AcquisitionResultTable.vue

@@ -5,7 +5,7 @@ import { MarketType, MarketTypeLabel, TaxInput, useMarketTaxStore } from "@/mark
 import { MinusIcon, PlusIcon } from '@heroicons/vue/24/outline';
 import { useStorage } from '@vueuse/core';
 import { computed, ref } from 'vue';
-import { AcquiredItem } from './AcquiredItem';
+import { AcquiredType } from './AcquiredType';
 import AcquisitionQuantilsTooltip from './AcquisitionQuantilsTooltip.vue';
 
 type Result = {
@@ -21,7 +21,7 @@ type Result = {
 }
 
 interface Props {
-    items?: AcquiredItem[];
+    items?: AcquiredType[];
 }
 
 interface Emits {

src/market/acquisition/BuyModal.vue

@@ -3,10 +3,10 @@ import { Modal } from '@/components';
 import { formatIsk } from '@/formaters';
 import { MarketType, MarketTypeLabel } from '@/market';
 import { ref } from 'vue';
-import { useAcquiredItemStore } from './acquisition';
+import { useAcquiredTypesStore } from './acquisition';
 
 
-const acquiredItemStore = useAcquiredItemStore();
+const acquiredTypesStore = useAcquiredTypesStore();
 
 const modalOpen = ref<boolean>(false);
 const type = ref<MarketType>();
@@ -38,7 +38,7 @@ const add = () => {
         return;
     }
 
-    acquiredItemStore.addAcquiredItem(id, count.value, price.value);
+    acquiredTypesStore.addType(id, count.value, price.value);
     modalOpen.value = false;
 }
 

src/market/acquisition/SellModal.vue

@@ -2,10 +2,10 @@
 import { Modal } from '@/components';
 import { MarketType, MarketTypeLabel } from '@/market';
 import { ref } from 'vue';
-import { useAcquiredItemStore } from './acquisition';
+import { useAcquiredTypesStore } from './acquisition';
 
 
-const acquiredItemStore = useAcquiredItemStore();
+const acquiredTypesStore = useAcquiredTypesStore();
 
 const modalOpen = ref<boolean>(false);
 const type = ref<MarketType>();
@@ -24,7 +24,7 @@ const remove = () => {
         return;
     }
 
-    acquiredItemStore.removeAcquiredItem(id, count.value);
+    acquiredTypesStore.removeType(id, count.value);
     modalOpen.value = false;
 }
 

src/market/acquisition/acquisition.ts

@@ -2,7 +2,7 @@ import { marbasAxiosInstance } from "@/service";
 import { defineStore } from "pinia";
 import { computed, ref } from "vue";
 
-export type AcquiredMarketItem = {
+export type AcquiredMarketType = {
     id: number;
     type: number;
     quantity: number;
@@ -13,34 +13,34 @@ export type AcquiredMarketItem = {
     user: number;
 }
 
-const endpoint = '/api/acquisitions';
+const endpoint = '/api/acquisitions/';
 
-export const useAcquiredItemStore = defineStore('market-acquisition', () => {
+export const useAcquiredTypesStore = defineStore('market-acquisition', () => {
-    const acquiredItems = ref<AcquiredMarketItem[]>([]);
+    const acquiredTypes = ref<AcquiredMarketType[]>([]);
 
-    const types = computed(() => acquiredItems.value);
+    const types = computed(() => acquiredTypes.value);
-    const addAcquiredItem = async (type: number, quantity: number, price: number) => { 
+    const addType = async (type: number, quantity: number, price: number) => { 
-        acquiredItems.value = [...acquiredItems.value, (await marbasAxiosInstance.post<AcquiredMarketItem>(endpoint, {
+        acquiredTypes.value = [...acquiredTypes.value, (await marbasAxiosInstance.post<AcquiredMarketType>(endpoint, {
             type: type,
             quantity: quantity,
             remaining: quantity,
             price: price,
             date: new Date(),
-            source: 'bo',
+            source: 'bo'
         })).data];
     };
-    const removeAcquiredItem = async (type: number, quantity: number) => {
+    const removeType = async (type: number, quantity: number) => {
-        const found = acquiredItems.value.find(item => item.type === type);
+        const found = acquiredTypes.value.find(item => item.type === type);
 
         if (!found) {
             return;
         }
 
         if (found.remaining <= 0) {
-            acquiredItems.value = acquiredItems.value.filter(i => i.type !== type);
+            acquiredTypes.value = acquiredTypes.value.filter(i => i.type !== type);
 
         } else {
-            acquiredItems.value = acquiredItems.value.map(i => {
+            acquiredTypes.value = acquiredTypes.value.map(i => {
                 if (i.type === item.type) {
                     return item;
                 } else {
@@ -54,10 +54,10 @@ export const useAcquiredItemStore = defineStore('market-acquisition', () => {
             remaining: found.remaining - quantity
         };
 
-        await marbasAxiosInstance.put(`${endpoint}/${item.id}`, item);
+        await marbasAxiosInstance.put(`${endpoint}${item.id}`, item);
     };
     
-    marbasAxiosInstance.get<AcquiredMarketItem[]>(endpoint).then(res => acquiredItems.value = res.data.filter(item => item.remaining > 0));
+    marbasAxiosInstance.get<AcquiredMarketType[]>(endpoint).then(res => acquiredTypes.value = res.data.filter(item => item.remaining > 0));
 
-    return { types, addAcquiredItem, removeAcquiredItem };
+    return { types, addType, removeType };
 });

src/market/acquisition/index.ts

@@ -1,4 +1,4 @@
-export * from './AcquiredItem';
+export * from './AcquiredType';
 export * from './acquisition';
 
 export { default as AcquisitionResultTable } from './AcquisitionResultTable.vue';

src/market/tracking/tracking.ts

@@ -11,20 +11,30 @@ export type TrackingResult = {
     orderCount: number,
 }
 
+type MarketTracking = {
+    id: number,
+    type: number
+};
+
+const endpoint = '/api/types_tracking/';
+
 export const useMarketTrackingStore = defineStore('marketTracking', () => {
     const trackedTypes = ref<number[]>([]);
 
     const types = computed(() => trackedTypes.value ?? []);
     const addType = async (type: number) => {
         if (!trackedTypes.value.includes(type)) {
-            await marbasAxiosInstance.post(`/api/types_tracked`, { type });
+            await marbasAxiosInstance.post(endpoint, { type });
         }
     }
     const removeType = async (type: number) => {
         if (trackedTypes.value.includes(type)) {
-            await marbasAxiosInstance.delete(`/api/types_tracked/${type}`);
+            await marbasAxiosInstance.delete(`${endpoint}${type}`);
         }
     }
+
+    marbasAxiosInstance.get<MarketTracking[]>(endpoint).then(res => trackedTypes.value = res.data.map(item => item.type));
+
     return { types, addType, removeType };
 });
 

src/pages/market/Acquisitions.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { MarketTypePrice, getMarketTypes, useApraisalStore } from "@/market";
-import { AcquiredItem, AcquisitionResultTable, BuyModal, SellModal, useAcquiredItemStore } from '@/market/acquisition';
+import { AcquiredType, AcquisitionResultTable, BuyModal, SellModal, useAcquiredTypesStore } from '@/market/acquisition';
 import { ref, watch } from 'vue';
 
 const buyModal = ref<typeof BuyModal>();
@@ -8,10 +8,10 @@ const sellModal = ref<typeof SellModal>();
 
 
 const apraisalStore = useApraisalStore();
-const acquiredItemStore = useAcquiredItemStore();
+const acquiredTypesStore = useAcquiredTypesStore();
-const items = ref<AcquiredItem[]>([]);
+const items = ref<AcquiredType[]>([]);
 
-watch(() => acquiredItemStore.types, async itms => {
+watch(() => acquiredTypesStore.types, async itms => {
     if (itms.length === 0) {
         return;
     }

src/pages/market/TypeInfo.vue

@@ -72,7 +72,7 @@ watch(useRoute(), async route => {
     <template v-if="item">
         <hr>
         <div class="p-2 mb-4 flex">
-            <img v-if="item.id" :src="`https://images.evetech.net/types/${item.id}/icon?size=64`" class="type-image inline-block me-2" />
+            <img v-if="item.id" :src="`https://images.evetech.net/types/${item.id}/icon?size=64`" class="type-image inline-block me-2" alt="" />
             <div class="inline-block align-top w-full">
                 <div class="flex">
                     <span class="text-lg font-semibold">{{ item.name }}</span>

src/service.ts

@@ -2,16 +2,15 @@ import { useAuthStore } from '@/auth';
 import axios, { AxiosInstance } from 'axios';
 import log from 'loglevel';
 
-
 export const logResource = (a: AxiosInstance) => {
     a.interceptors.response.use(r => {
         log.debug(`[${r.config.method?.toUpperCase()}] ${r.config.url}`);
         return r;
     }, e => {
-        if (e instanceof Error) {
+        if (!e?.config) {
-            log.error(e.message);
+            log.error(e.message, e);
         }
-        log.error(`[${e.config?.method?.toUpperCase()}] ${e.config?.url} failed with ${e.response?.status} ${e.response?.statusText}`);
+        log.error(`[${e.config?.method?.toUpperCase()}] ${e.config?.url} failed with ${e.response?.status} ${e.response?.statusText}`, e);
         return Promise.reject(e);
     });
 }
@@ -20,10 +19,21 @@ export const marbasAxiosInstance = axios.create({
     baseURL: import.meta.env.VITE_MARBAS_URL,
     headers: {
         'Accept': 'application/json',
-        "Content-Type": "application/json"
+        "Content-Type": "application/json",
     },
 })
 marbasAxiosInstance.interceptors.request.use(r => {
+    const authStore = useAuthStore();
+
+    if (!authStore.isLoggedIn) {
+        throw new Error("Not logged in");
+    }
+    
+    const accessToken = authStore.accessToken;
+
+    if (accessToken) {
+        r.headers.Authorization = `Bearer ${accessToken}`;
+    }
     if (!r.params?.page_size) {
         r.params = { ...r.params, page_size: 250 };
     }
@@ -46,27 +56,12 @@ marbasAxiosInstance.interceptors.response.use(async r => {
     }
     return r;
 })
-marbasAxiosInstance.interceptors.request.use(r => {
-    const authStore = useAuthStore();
-
-    if (!authStore.isLoggedIn) {
-        throw new Error("Not logged in");
-    }
-    
-    const accessToken = authStore.accessToken;
-
-    if (accessToken) {
-        r.headers.Authorization = `Bearer ${accessToken}`;
-    }
-    return r;
-})
 
 export const esiAxiosInstance = axios.create({
     baseURL: import.meta.env.VITE_ESI_URL,
     headers: {
         'Accept': 'application/json',
-        "Content-Type": "application/json",
+        "Content-Type": "application/json"
-        "User-Agent": import.meta.env.VITE_ESI_USER_AGENT
     },
 })
 logResource(esiAxiosInstance)