added some more error-handling

src/components/ScoreTeam.vue

@@ -175,7 +175,7 @@ export default {
         }
       } else if (team === 2) {
         arr = []
-        for (let i = 5; i < 10; i++) {
+        for (let i = 5; i < store.state.matchDetails.stats.length; i++) {
           arr.push(store.state.matchDetails.stats[i])
         }
       }

src/utils/ApiRequests.js

@@ -2,26 +2,35 @@ import axios from "axios";
 import {errorHandling} from "@/utils/Utils";
 
 const API_URL = process.env.VUE_APP_API_URL
+const TIMEOUT = 10_000
 
 export const GetMatches = async () => {
   try {
-    const res = await axios.get(`${API_URL}/matches`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/matches`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200)
       return res.data
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load matches')
   }
 }
 
 export const GetUser = async (id) => {
   try {
-    const res = await axios.get(`${API_URL}/player/${id}`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/player/${id}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200)
       return res.data
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load user')
   }
 }
 
@@ -44,8 +53,15 @@ export const TrackMe = async (id64, authcode, sharecode = '') => {
   }
 
   try {
-    const res = await axios
-      .post(`${API_URL}/player/${id64}/track`, `authcode=${authcode}&sharecode=${sharecode}`)
+    // const res = await axios
+    //   .post(`${API_URL}/player/${id64}/track`, `authcode=${authcode}&sharecode=${sharecode}`)
+
+    const res = await axios({
+      method: 'post',
+      url: `${API_URL}/player/${id64}/track`,
+      data: `authcode=${authcode}&sharecode=${sharecode}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 202) {
       status = res.status
@@ -67,73 +83,96 @@ export const TrackMe = async (id64, authcode, sharecode = '') => {
 
 export const GetPlayerValue = async (match_id) => {
   try {
-    const res = await axios.get(`${API_URL}/match/${match_id}/rounds`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/match/${match_id}/rounds`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not get player value')
   }
 }
 
 export const GetMatchDetails = async (match_id) => {
   try {
-    const res = await axios.get(`${API_URL}/match/${match_id}`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/match/${match_id}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load match details')
   }
 }
 
 export const LoadMoreMatches = async (player_id, date) => {
   try {
-    const res = await axios.get(`${API_URL}/player/${player_id}/next/${date}`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/player/${player_id}/next/${date}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load more matches')
   }
 }
 
 export const GetPlayerMeta = async (player_id, limit = 4) => {
   try {
-    const res = await axios.get(`${API_URL}/player/${player_id}/meta/${limit}`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/player/${player_id}/meta/${limit}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
-      // console.log(res.data)
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load player metadata')
   }
 }
 
 export const GetWeaponDmg = async (match_id) => {
   try {
-    const res = await axios.get(`${API_URL}/match/${match_id}/weapons`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/match/${match_id}/weapons`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not calculate weapon damage')
   }
 }
 
 export const LoadMoreMatchesExplore = async (date) => {
   try {
-    const res = await axios.get(`${API_URL}/matches/next/${date}`)
+    const res = await axios({
+      method: 'get',
+      url: `${API_URL}/matches/next/${date}`,
+      timeout: TIMEOUT
+    })
 
     if (res.status === 200) {
       return res.data
     }
-  } catch (err) {
-    errorHandling(err.response.status)
+  } catch {
+    console.log('Could not load more matches')
   }
 }

src/views/Explore.vue

@@ -4,14 +4,22 @@
   <div class="wrapper">
     <div class="container-lg text-center">
       <h3>Recent matches</h3>
+      <div v-if="data.matches">
         <MatchesTable :key="data.matches" :explore="true" :matches="data.matches"/>
 
-      <div v-if="data.matches" class="load-more text-center">
+        <div class="load-more text-center">
           <button :key="scrollToPos(store.state.scroll_state)" class="btn border-2 btn-outline-info"
                   @click="setMoreMatches">Load More
           </button>
         </div>
       </div>
+
+      <div v-else>
+        <hr>
+        <h6>There seems to be a problem loading the content</h6>
+        <h6>Please try again later</h6>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -47,6 +55,7 @@ export default {
     onMounted(async () => {
       data.matches = await GetMatches()
 
+      if (data.matches) {
         if (data.matches[0].map) {
           await LoadImage(data.matches[0].map)
         } else if (!data.matches[0].map && MatchNotParsedTime(data.matches[0].date) && data.matches[1].map) {
@@ -54,10 +63,13 @@ export default {
         } else {
           await LoadImage('random')
         }
+      }
 
       scrollToPos(store.state.scroll_state)
 
+      if (data.matches) {
         console.log(data.matches)
+      }
     })
 
     onBeforeUnmount(() => {

src/views/Player.vue

@@ -3,6 +3,7 @@
 
   <div class="wrapper">
     <div class="container">
+      <div v-if="store.state.playerDetails.name">
         <div class="card mb-3 bg-transparent border-0">
           <div class="row g-0">
             <div class="img-container col-md-2 pt-3">
@@ -125,7 +126,7 @@
 
           <div v-if="store.state.playerDetails.matches" class="side-info-container">
 
-          <PlayerSideInfo :player_meta="data.playerMeta" />
+            <PlayerSideInfo :player_meta="data.playerMeta"/>
 
           </div>
         </div>
@@ -135,6 +136,14 @@
           </button>
         </div>
       </div>
+
+      <div v-else class="text-center pt-5">
+        <h3>Player-Page</h3>
+        <hr>
+        <h6>There seems to be a problem loading the player</h6>
+        <h6>Please try again later</h6>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -153,11 +162,11 @@ import {
   LoadImage,
   LoadMoreMatches,
   MatchNotParsedTime,
+  ProcessName,
   SaveLastVisitedToLocalStorage,
   scrollToPos,
   setTitle,
-  TrackMe,
-  ProcessName
+  TrackMe
 } from "../utils";
 import {FOOTER_HEIGHT, NAV_HEIGHT} from "@/constants";
 import MatchesTable from "@/components/MatchesTable";
@@ -459,6 +468,7 @@ export default {
   .matches {
     width: 75%;
   }
+
   .side-info-container {
     width: 25%;
   }