From b87a433bea18c2b7adbc7dee17cbe78cf8868a62 Mon Sep 17 00:00:00 2001
From: Mahimaanand <47138963+Mahimaanand@users.noreply.github.com>
Date: Sat, 9 Nov 2019 12:14:21 +0800
Subject: [PATCH] web: make management page dynamic

---
 web/package.json             |  1 +
 web/src/components/Tutors.js | 58 ++++++++++++++----------------------
 web/yarn.lock                | 27 +++++++++++++++++
 3 files changed, 50 insertions(+), 36 deletions(-)

diff --git a/web/package.json b/web/package.json
index e386055de..a283581cc 100644
--- a/web/package.json
+++ b/web/package.json
@@ -5,6 +5,7 @@
   "private": true,
   "dependencies": {
     "antd": "^3.12.4",
+    "axios": "^0.19.0",
     "eslint": "^6.2.2",
     "firebase": "^5.8.1",
     "formik": "^1.4.2",
diff --git a/web/src/components/Tutors.js b/web/src/components/Tutors.js
index 91ca7c257..2df1bf41f 100644
--- a/web/src/components/Tutors.js
+++ b/web/src/components/Tutors.js
@@ -1,43 +1,29 @@
-import { Card, Col, Row } from 'antd';
 import React from 'react';
+import { Card, Col, Row } from 'antd';
+import axios from 'axios';
 
-const tutorsData = [
-  {
-    email: "deanmed@hku.hk",
-    floors: [5,6],
-    image: "http://www.rcblockb.hku.hk/wp-content/uploads/2015/09/Prof_Leung_selected_Day1_0003-e1470374068270-300x300.jpg",
-    name: "Professor Gabriel Leung",
-    position: "Master",
-    rank: 4
-  },
-  {
-    email: "rainbow.wong@hku.hk",
-    floors: [5,6],
-    image: "http://www.rcblockb.hku.hk/wp-content/uploads/2016/08/rainbow-104-y-sq-300x300.jpg",
-    name: "Ms Rainbow Wong",
-    position: "Senior Tutor",
-    rank: 4
-  },
-  {
-    email: "adasante2@gmail.com",
-    floors: [6,7],
-    image: "http://www.rcblockb.hku.hk/wp-content/uploads/2019/08/Derek_pic.png",
-    name: "Mr Derek Abankwa",
-    position: "Tutor",
-    rank: 4
-  },
-  {
-    email: "siling@connect.hku.hk",
-    floors: [8,9,10],
-    image: "http://www.rcblockb.hku.hk/wp-content/uploads/2019/08/Siling.png",
-    name: "Dr Siling Pang",
-    position: "Tutor",
-    rank: 4
+
+const Tutors = () => {
+  const [tutorsData,setTutorsData] = React.useState([])
+  React.useEffect(()=>{
+
+    axios.post('https://hkuchisuncollege.herokuapp.com/graphql', {
+    query: `query {
+  management{
+    email
+    floors
+    image
+    name
+    id
+    position
+    rank
   }
+}`
+}).then((response)=>{setTutorsData(response.data.data.management)})
+
+},[]);
 
-]
 
-const Tutors = () => {
 
   return (
   <div>
@@ -47,7 +33,7 @@ const Tutors = () => {
   <p>
   For information on the tutorial team, <a href="http://www.chisuncollege.hku.hk/management-tutorial-team">click here </a>
   </p>
-  <Row>{tutorsData.map(tutor=><Col span={6}><Card style={{margin:"auto",width:240,marginBottom:10}}title={tutor.name}><img src={tutor.image} width="200" height="200" alt={tutor.name}/></Card></Col>)}</Row>
+  <Row>{tutorsData.map(tutor=><Col span={6} key = {tutor.id}><Card style={{margin:"auto",width:240,marginBottom:10}}title={tutor.name}><img src={tutor.image} alt = {tutor.name} width="200" height="200"/></Card></Col>)}</Row>
   </div>
 )}
 export default Tutors
diff --git a/web/yarn.lock b/web/yarn.lock
index 672aaf4f3..f6f6c9eef 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -2071,6 +2071,14 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
   integrity sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==
 
+axios@^0.19.0:
+  version "0.19.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.19.0.tgz#8e09bff3d9122e133f7b8101c8fbdd00ed3d2ab8"
+  integrity sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==
+  dependencies:
+    follow-redirects "1.5.10"
+    is-buffer "^2.0.2"
+
 axobject-query@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.0.2.tgz#ea187abe5b9002b377f925d8bf7d1c561adf38f9"
@@ -3423,6 +3431,13 @@ debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.8, debug@^2.6.
   dependencies:
     ms "2.0.0"
 
+debug@=3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
+  dependencies:
+    ms "2.0.0"
+
 debug@^3.0.0, debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
@@ -4658,6 +4673,13 @@ flush-write-stream@^1.0.0:
     inherits "^2.0.3"
     readable-stream "^2.3.6"
 
+follow-redirects@1.5.10:
+  version "1.5.10"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
+  integrity sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==
+  dependencies:
+    debug "=3.1.0"
+
 follow-redirects@^1.0.0:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.8.1.tgz#24804f9eaab67160b0e840c085885d606371a35b"
@@ -5609,6 +5631,11 @@ is-buffer@^1.0.2, is-buffer@^1.1.5:
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
   integrity sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==
 
+is-buffer@^2.0.2:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.4.tgz#3e572f23c8411a5cfd9557c849e3665e0b290623"
+  integrity sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A==
+
 is-callable@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"