From a47d382e71ffabf03a2147e5b486220385c756c3 Mon Sep 17 00:00:00 2001
From: aminecmi <aminecmi@gmail.com>
Date: Sat, 30 Oct 2021 16:45:47 +0200
Subject: [PATCH] Error handeling.

---
 src/components/Table.vue    | 13 +++++++++----
 src/services/DeckService.js | 15 +++++++++++----
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/components/Table.vue b/src/components/Table.vue
index 7cac8c2..66bcb33 100644
--- a/src/components/Table.vue
+++ b/src/components/Table.vue
@@ -5,7 +5,7 @@
     <button v-on:click="initHand()">Tirer des cartes</button>
     <div v-if="cards != null && cards.length > 0">
       <h2>Cartes</h2>
-      <div v-for="card in cards" v-bind:key="card">
+      <div v-for="card in cards" v-bind:key="JSON.stringify(card)">
         {{card}}
       </div>
       <button v-on:click="sortMyHand()">Tirer des cartes</button>
@@ -14,7 +14,7 @@
       <h2>Cartes Triées</h2>
       <h3><em>Shape order : {{sortResult.shapeOrder}}</em></h3>
       <h3><em>Number order : {{sortResult.numberOrder}}</em></h3>
-      <div v-for="card in sortResult.sortedCards" v-bind:key="card">
+      <div v-for="card in sortResult.sortedCards" v-bind:key="JSON.stringify(card)">
         {{card}}
       </div>
     </div>
@@ -36,12 +36,17 @@ export default {
   methods: {
     initHand() {
       this.sortResult = null;
-      getHand().then(r => {
+      this.cards = null;
+      getHand().catch(() => {
+        window.alert("Deck not full enough")
+      }).then(r => {
         this.cards = r;
       })
     },
     sortMyHand() {
-      sortHand(this.cards).then(r => {
+      sortHand(this.cards).catch(() => {
+        window.alert("Can't sort cards")
+      }).then(r => {
         this.sortResult = r;
       });
     },
diff --git a/src/services/DeckService.js b/src/services/DeckService.js
index e4486c1..d5b94c6 100644
--- a/src/services/DeckService.js
+++ b/src/services/DeckService.js
@@ -1,6 +1,10 @@
 export async function getHand() {
   const response = await fetch('http://localhost:8080/api/deck/hand');
-  return await response.json();
+  if (response.status >= 200 && response.status <= 299) {
+    return  await response.json();
+  } else {
+    throw Error(response.statusText);
+  }
 }
 
 export async function sortHand(hand) {
@@ -9,12 +13,15 @@ export async function sortHand(hand) {
     headers: {'Content-Type': 'application/json'},
     body: JSON.stringify(hand)
   })
-  return await response.json();
+  if (response.status >= 200 && response.status <= 299) {
+    return  await response.json();
+  } else {
+    throw Error(response.statusText);
+  }
 }
 
 export async function resetDeck() {
-  const response = await fetch(`http://localhost:8080/api/deck:reset`, {
+  return  await fetch(`http://localhost:8080/api/deck:reset`, {
     method: 'PUT'
   })
-  await response;
 }