Team tests (ongoing)

src/views/Member.jsx

@@ -1,78 +1,78 @@
 // MARK: Definitions
 import React, { useState, useEffect } from 'react'
 import axios from 'axios'
-import history from  '../history.js'
+import history from '../history.js'
 // import config from '../config.json'
 import './Member.scss'
 
 export default function Member({ props }) {
-	// MARK: State
-	let [user, setUser] = useState(null)
-	let [teamNames, setTeamNames] = useState([])
+  // MARK: State
+  let [user, setUser] = useState(null)
+  let [teamNames, setTeamNames] = useState([])
 
-	// MARK: Effects
-	// MARK: - Load user info from Tempo backend on initialization
-	useEffect(() => {
-		let fetchData = async() => {
-			try {
-				let result = await axios.get(props.url)
-				if (result.data) {
-					setUser(result.data)
+  // MARK: Effects
+  // MARK: - Load user info from Tempo backend on initialization
+  useEffect(() => {
+    let fetchData = async () => {
+      try {
+        let result = await axios.get(props.url)
+        if (result.data) {
+          setUser(result.data)
 
-					result.data.member_teams.map(teamId => {
-						let arr = props.teams.filter(el => el.id === teamId)
-						setTeamNames(t => [...t, arr[0].name])
+          result.data.member_teams.map(teamId => {
+            let arr = props.teams.filter(el => el.id === teamId)
+            setTeamNames(t => [...t, arr[0].name])
 
-						return null
-					})
-				}
-			}
-			catch(err) {
-				history.push('/')
-			}
-		}
+            return null
+          })
+        }
+      } catch (err) {
+        history.push('/')
+      }
+    }
 
-		fetchData()
-	}, [props])
+    fetchData()
+  }, [props])
 
-	// MARK: Helpers
-	let navBack = () => {
-		history.push('/team')
-	}
+  // MARK: Helpers
+  let navBack = () => {
+    history.push('/team')
+  }
 
-	// MARK: Return
-	return (
-		<div className='member'>
+  // MARK: Return
+  return (
+    <div className="member">
+      {user === null ? (
+        <div data-testid="loading">Loading...</div>
+      ) : (
+        user !== undefined && (
+          <div>
+            <div className="header">
+              <span data-testid="resolved">
+                <h1>Member {user.name}</h1>
+              </span>
+            </div>
 
-			{user === null ? (<div data-testid='loading'>Loading...</div>) : (
-				user !== undefined &&
-				<div>
-					<div className='header'>
-						<span data-testid='resolved'><h1>Member {user.name}</h1></span>
-					</div>
+            <div className="back">
+              <button className="back-btn" onClick={navBack}>{`< Back to team`}</button>
+            </div>
 
-					<div className='back'>
-						<button className='back-btn' onClick={navBack}>{`< Back to team`}</button>
-					</div>
+            <h2>Username:</h2>
+            <div className="username">
+              <p>{user.username}</p>
+            </div>
 
-					<h2>Username:</h2>
-					<div className='username'>
-						<p>{user.username}</p>
-					</div>
-
-					<h2>Member of:</h2>
-					<ul className='list'>
-						{teamNames.map((name, index) => (
-							<li className='list-item' key={index}>
-								<div className='username'>
-									{name}
-								</div>
-							</li>
-						))}
-					</ul>
-				</div>
-			)}
-
-		</div>
-	)
+            <h2>Member of:</h2>
+            <ul className="list">
+              {teamNames.map((name, index) => (
+                <li className="list-item" key={index}>
+                  <div className="username">{name}</div>
+                </li>
+              ))}
+            </ul>
+          </div>
+        )
+      )}
+    </div>
+  )
 }