ajout d'une table dans le detail, avec mana, health, attack

models/Card.tsx

@@ -77,22 +77,24 @@ export class Card {
     //     this._rarity = value ;
     // }
 
-    private _manaCost : number
+    private _manaCost: number;
-        get manaCost(): number {
+    get manaCost(): number {
-            return this.manaCost;
+        return this._manaCost;
-        }
+    }
-        set manaCost(value: number) {
+    
-            this._manaCost = value ;
+    set manaCost(value: number) {
-        }
+        this._manaCost = value;
+    }
+    
 
-    private _attack : number
+    private _attack : number;
         get attack(): number {
             return this._attack;
         }
         set attack(value: number) {
-            this._attack = value ;
+            this._attack = value;
         }
-    private _health : number
+    private _health : number;
         get health(): number {
             return this._health;
         }
@@ -108,7 +110,7 @@ export class Card {
     //         this._desc = value ;
     //     }
 
-    private _flavorText : string
+    private _flavorText : string;
     get flavorText(): string {
         return this._flavorText;
     }

package-lock.json

@@ -29,6 +29,7 @@
         "@babel/core": "^7.20.0",
         "@types/react": "~18.0.27",
         "@types/react-native": "~0.70.6",
+        "@types/react-native-table-component": "^1.2.4",
         "typescript": "^4.9.4"
       }
     },
@@ -5041,6 +5042,17 @@
         "@types/react": "*"
       }
     },
+    "node_modules/@types/react-native-table-component": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@types/react-native-table-component/-/react-native-table-component-1.2.4.tgz",
+      "integrity": "sha512-JxTc3HXkBPxY/aFJpb4XFot+CM8ismemFCcPy7GlguX9C7Xc+kCmVOmFmA/o1jX2BNPuM45OS264QL6BMlPa6Q==",
+      "dev": true,
+      "dependencies": {
+        "@types/react": "*",
+        "@types/react-native": "*",
+        "csstype": "^3.0.3"
+      }
+    },
     "node_modules/@types/scheduler": {
       "version": "0.16.2",
       "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
@@ -17756,6 +17768,17 @@
         "@types/react": "*"
       }
     },
+    "@types/react-native-table-component": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@types/react-native-table-component/-/react-native-table-component-1.2.4.tgz",
+      "integrity": "sha512-JxTc3HXkBPxY/aFJpb4XFot+CM8ismemFCcPy7GlguX9C7Xc+kCmVOmFmA/o1jX2BNPuM45OS264QL6BMlPa6Q==",
+      "dev": true,
+      "requires": {
+        "@types/react": "*",
+        "@types/react-native": "*",
+        "csstype": "^3.0.3"
+      }
+    },
     "@types/scheduler": {
       "version": "0.16.2",
       "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",

package.json

@@ -30,6 +30,7 @@
     "@babel/core": "^7.20.0",
     "@types/react": "~18.0.27",
     "@types/react-native": "~0.70.6",
+    "@types/react-native-table-component": "^1.2.4",
     "typescript": "^4.9.4"
   },
   "private": true

redux/actions/actionSelection.tsx

@@ -60,8 +60,7 @@ export const getAllCards = () => {
         }
         //'pageSize':'100'
       };
-      //! Actualisation de l'API (29/03) :
+      const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EUe6p4N9uLm8BbsHyYVZXIa4DDBP2hMR05', options);
-      const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EUrREr6QW0VZJgpRDgedTYqvX4P2BokjcC  ', options);
       //const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EUZvGOfXsMKYrjqLJp5mE7IJlhQuELMiPk  ', options);
       //const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EURTWhjBC2SRb4Ez42BT1kx8R2NcJc07kL', options);
       //console.log("FETCH")

screens/DetailCard.tsx

@@ -7,6 +7,7 @@ import { Table, Row, Rows } from 'react-native-table-component';
 
 //* Components
 import {ListItemComponent} from '../components/ListItemComponent'
+import { ScrollView } from 'react-native-gesture-handler';
 
 //@ts-ignore
 export default function DetailMain({ route }){
@@ -36,10 +37,12 @@ export default function DetailMain({ route }){
                 <ListItemComponent url={card.img}/>
             </View>
 
-            <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
+            <ScrollView>
-                <Row data={tableHead} style={styles.head} textStyle={styles.text}/>
+                <Table borderStyle={{borderWidth: 5, borderColor: '#c8e1ff'}}>
-                <Rows data={tableData} textStyle={styles.text}/>
+                    <Row data={tableHead} style={styles.head} textStyle={styles.text}/>
-            </Table>        
+                    <Rows data={tableData} textStyle={styles.text}/>
+                </Table>
+            </ScrollView>
         </View>
     );
 }
@@ -76,7 +79,8 @@ const styles = StyleSheet.create({
         borderRadius : 10,
         borderWidth: 10,
         borderColor: '#efefef',
+        maxHeight:100
     },
-    head: { height: 40, backgroundColor: '#f1f8ff' },
+    head: { height: 40, backgroundColor: '#f1f8ff', minWidth: '90%'},
     text: { margin: 6 }
 });

yarn.lock

@@ -1926,7 +1926,16 @@
   "resolved" "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz"
   "version" "15.7.5"
 
-"@types/react-native@~0.70.6":
+"@types/react-native-table-component@^1.2.4":
+  "integrity" "sha512-JxTc3HXkBPxY/aFJpb4XFot+CM8ismemFCcPy7GlguX9C7Xc+kCmVOmFmA/o1jX2BNPuM45OS264QL6BMlPa6Q=="
+  "resolved" "https://registry.npmjs.org/@types/react-native-table-component/-/react-native-table-component-1.2.4.tgz"
+  "version" "1.2.4"
+  dependencies:
+    "@types/react" "*"
+    "@types/react-native" "*"
+    "csstype" "^3.0.3"
+
+"@types/react-native@*", "@types/react-native@~0.70.6":
   "integrity" "sha512-0C6sIo13ztzM2llaWdTq0Vpscx3VdU0T8F45kEurWv3l5n+BHm/Mkr8Z+N29eXDYGhTvCz5y2jegB8JyiVa5kw=="
   "resolved" "https://registry.npmjs.org/@types/react-native/-/react-native-0.70.9.tgz"
   "version" "0.70.9"
@@ -2923,7 +2932,7 @@
   dependencies:
     "hyphenate-style-name" "^1.0.3"
 
-"csstype@^3.0.2":
+"csstype@^3.0.2", "csstype@^3.0.3":
   "integrity" "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
   "resolved" "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz"
   "version" "3.1.1"