diff --git a/src/components/account.js b/src/components/account.js index 625bb32..47dda3e 100644 --- a/src/components/account.js +++ b/src/components/account.js @@ -1,5 +1,6 @@ import React from 'react'; import UserContext from '../contexts/user'; +import { Image } from 'antd' import {useContext} from 'react'; @@ -36,6 +37,7 @@ function Account(props) { return ( <>

Account

+ avatarURL

Username: {user.username}

Email: {user.email}

{Object.keys(profile).map(key =>
  • {key}: {profile[key]}
  • )} diff --git a/src/components/dog.js b/src/components/dog.js index 1622652..c2da5ec 100644 --- a/src/components/dog.js +++ b/src/components/dog.js @@ -4,9 +4,13 @@ import { Image, Row, Col, Typography, Space, Button } from 'antd' import DogIcon from './dogicon'; import { status, json } from '../utilities/requestHandlers'; +import UserContext from '../contexts/user'; + const { Title, Paragraph } = Typography; class Dog extends React.Component { + + static contextType = UserContext; constructor(props) { super(props); @@ -61,20 +65,20 @@ class Dog extends React.Component { } render() { - const user = this.state.user; const dog = this.state.dog; - /* + //Error Here!! Change the user.role to a valid verification let adminSpace = - if(user.role == 'admin'){ + if(this.context.user.loggedIn){ + if(this.context.user.loggedIn){ adminSpace = - + } - */ - - if (!this.state.dog) { + } + + if (!dog) { return

    Loading dogs...

    } @@ -85,18 +89,21 @@ class Dog extends React.Component { ); - return( //add {adminSpace here + return( //add {adminSpace} here //Add shelter name and breed
    - Dog + Dog {dog.name} - {dog.about} + About: {dog.about} + Breed: {dog.breedsID} + Shelter: {dog.sheltersID} {icons} + {adminSpace}
    diff --git a/src/components/editDog.js b/src/components/editDog.js index a38930d..0e9543d 100644 --- a/src/components/editDog.js +++ b/src/components/editDog.js @@ -33,46 +33,32 @@ class EditDog extends React.Component { handleBreedChange=event=>{ this.setState({ - breed: event.target.value + name: event.target.value }) } handleAgeChange=event=>{ this.setState({ - age: event.target.value + about: event.target.value }) } - - handleSizeChange=event=>{ - this.setState({ - size: event.target.value - }) - } - - handleDescriptionChange=event=>{ - this.setState({ - description: event.target.value - }) - } - + handleImageChange=event=>{ this.setState({ - selectedFile: event.target.files[0], + imageURL: event.target.files[0], loaded: 0, }) } onClickHandler = () => { const data = new FormData() - if(this.state.selectedFile){data.append('upload', this.state.selectedFile)} - if(this.state.breed){data.append('breed', this.state.breed)} - if(this.state.age){data.append('age', this.state.age)} - if(this.state.size){data.append('size', this.state.size)} - if(this.state.description){data.append('description', this.state.description)} + if(this.state.imageURL){data.append('upload', this.state.imageURL)} + if(this.state.name){data.append('name', this.state.name)} + if(this.state.about){data.append('about', this.state.about)} axios.put(`https://animal-hello-3000.codio-box.uk/api/v1/dogs/${this.state.dogID}`, data, { auth: { - username: 'daniel', - password: 'abc' + username: 'joe', + password: '1234' }, headers: { 'content-type': 'multipart/form-data' @@ -88,18 +74,12 @@ class EditDog extends React.Component { return (
    Edit dog - + - + - - - - -