Skip to content

Commit

Permalink
improve navbartop & fix minor react warnings
Browse files Browse the repository at this point in the history
  • Loading branch information
LauraKapitza committed Oct 3, 2021
1 parent ba7155b commit 5952f3b
Show file tree
Hide file tree
Showing 13 changed files with 74 additions and 442 deletions.
4 changes: 0 additions & 4 deletions olympi-client/src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,9 @@ class App extends Component {
}

fetchUser = () => {
console.log('fetch')
authService.loggedin()
.then(data => {
this.setState({user: data})
console.log("user: ", this.state.user);
})
.catch(err => {
this.setState({user: null})
Expand All @@ -43,12 +41,10 @@ class App extends Component {
};

componentDidMount() {
console.log('component did mount')
this.fetchUser();
}

render() {
console.log('render')
return (
<Route render={props => (
<div className="App" data-route={props.location.pathname}> {/* data-route="/" allow us to style pages */}
Expand Down
6 changes: 1 addition & 5 deletions olympi-client/src/components/Explore/Explore.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useState } from 'react';
import React from 'react';
import moment from 'moment';
import ExploreBottomNavBar from '../feed/FeedFooter.js'
import Filters from './Filters/Filters'
Expand All @@ -22,10 +22,6 @@ class Explore extends React.Component {
.catch(err => this.setState({videos: false}))
}

// useEffect(() => {
// loadVideos()
// }, [category, sortBy]);

updateVotes(video) {
feedService.updateVotes(video)
.then(data => {
Expand Down
168 changes: 14 additions & 154 deletions olympi-client/src/components/Profile/PersonalBio/PersonalBio.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,6 @@
import React, {useEffect, useState, Redirect} from 'react'
import React, {Redirect} from 'react'
import "./PersonalBio.css"
import Modal from "react-modal"
import axios from "axios"
import authService from '../../auth/auth-service'
import VideoUpload from '../UpdateProfile/UpdateProfile'



export default class PersonalBio extends React.Component {

logout = (event) => {
Expand Down Expand Up @@ -37,151 +31,17 @@ export default class PersonalBio extends React.Component {
if (this.props.user === false) return <Redirect to="/" />

return (
<>



<div className="PersonalBioContainer">
<div className="BioTitle"> <span> Profile</span> </div>

<img className="avatar" src={this.props.user.image || "/assets/photos/lyaphoto.jpeg"} />
<div className="UsersName">{this.props.user.username}</div>
<div className="UsersCity">{this.props.user.city}</div>
<div className="ShortBio">{this.props.user.about}</div>







</div>

</>
)
}
}















// //const baseUrl = process.env.REACT_APP_APIURL
// //const customStyles = {
// content: {
// top: '50%',
// left: '50%',
// right: 'auto',
// bottom: 'auto',
// marginRight: '-50%',
// transform: 'translate(-50%, -50%)',
// width: "350px",
// zIndex: 1
// },
// };
// function PersonalBio({user}) {
// const [profile, setProfile] = useState({
// username:"",
// email:"",
// city:"",
// fav_exercise:"",
// about:""
// })
// Modal.setAppElement(document.getElementById("root"))
// let subtitle;
// const [modalIsOpen, setIsOpen] = useState(false);

// function openModal() {
// setIsOpen(true);
// }

// function afterOpenModal() {
// // references are now sync'd and can be accessed.
// subtitle.style.color = '#f00';
// }

// function closeModal() {
// setIsOpen(false);
// }
// async function fetchUser(user)
// {
// await axios.get(`${baseUrl}/auth/user?id=${user}`)
// .then((response) => {
// if(response.status == 201)
// {
<>
<div className="PersonalBioContainer">
<div className="BioTitle"> <span> Profile</span> </div>

// const data = response.data
// setProfile({
// username: data.username,
// email: data.email,
// city: data.city,
// fav_exercise: data.fav_exercise,
// about: data.about
// })
// }
// })
// .catch((e) => console.log("Not Found", e))
// }
// const handleChange = (event) => {
// const {name, value} = event.target;
// setProfile({...profile, [name]: value});
// }
// const onUpdate = async() => {
// const result = await axios.put(`${baseUrl}/auth/updateUser?id=${user._id}`, profile)
// if(result.status == 201)
// {
// setProfile(result.data)
// setIsOpen(false)
// }
// }
// useEffect(() =>{
// fetchUser(user._id)
// }, [])
// return (
// <div className="PersonalBioContainer">

// <div className="BioTitle"> <span>User Profile</span> </div>

// <div className="editImage" onClick={openModal}><img src="/assets/icons/editbutton.svg" alt=""></img>Edit </div>


// <Modal
// isOpen={modalIsOpen}
// onAfterOpen={afterOpenModal}
// onRequestClose={closeModal}
// style={customStyles}
// >
// <h2 ref={(_subtitle) => (subtitle = _subtitle)}>Edit profile</h2>
// {/* <button onClick={closeModal}>close</button> */}
// <div>Edit your profile info</div>
// <div>
// <p> <input type="text" name="username" onChange={handleChange} value={profile.username} placeholder="Username" /> </p>
// <p> <input type="email" name="email" onChange={handleChange} value={profile.email} placeholder="Email" /> </p>
// <p> <input type="text" name="about" onChange={handleChange} value={profile.about} placeholder="About" /> </p>
// <p><input type="text" name="city" onChange={handleChange} value={profile.city} placeholder="City" /> </p>
// <p><input type="text" name="fav_exercise" onChange={handleChange} value={profile.fav_exercise} placeholder="Favorite Exercise" /></p>
// <button type={"button"} onClick={onUpdate} className={"updateButton"}>Update</button>
// </div>
// </Modal>
// <img src="/assets/icons/noprofilephoto.svg" alt=""></img>
// <div className="UsersName">{profile.username}</div>
// <div className="UsersCity">{profile.city}</div>
// <div className="ShortBio">{profile.about}</div>



// </div>
// )
// }

// export default PersonalBio
<img className="avatar" src={this.props.user.image || "/assets/photos/lyaphoto.jpeg"} alt="" />
<div className="UsersName">{this.props.user.username}</div>
<div className="UsersCity">{this.props.user.city}</div>
<div className="ShortBio">{this.props.user.about}</div>

</div>
</>
)
}
}
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
import React, {useState, useEffect, Redirect} from 'react'
import React, {Redirect} from 'react'
import "./PersonalRecord.css"
import Modal from "react-modal"
import axios from "axios"
import moment from "moment"
import feedService from '../../feed/feed-service'


Expand Down Expand Up @@ -66,85 +63,3 @@ import feedService from '../../feed/feed-service'
)
}
}









// const baseUrl = process.env.REACT_APP_APIURL
// function PersonalRecord({user}) {
// const [records, setRecords]= useState(null)
// async function loadRecords(creator){
// const dd = await axios.get(`${baseUrl}/videos/loadUserVideos?creator=${creator}`)
// .then((response) => {
// setRecords(response.data);
// })
// .catch((e) => console.log("not found", e))
// }
// useEffect(() => {
// user._id && loadRecords(user._id)
// console.log("rcord", records)
// }, []);


// Modal.setAppElement(document.getElementById("root"))
// let subtitle;
// const [modalIsOpen, setIsOpen] = useState(false);

// function openModal() {
// setIsOpen(true);
// }



// const EXERCISES = [
// 'Overhead press',
// 'Deadlift',
// 'Squat',
// 'Bench press'
// ]


// return (
// <div className="PersonalRecordContainer">

// <div className="PRtitle">Personal Record

// </div>

// <div className="RecordTableContainer">
// <table>
// <thead>
// <tr>
// <th>Exercise</th>
// <th>Weight</th>
// <th>Date</th>
// </tr>
// </thead>
// <tbody>
// {records && records.map((record, index) => {
// return <tr key={index}>
// <td> {record.exercise}</td>
// <td>{`${record.weight} ${record.weight_metric}`}</td>
// <td>{moment(record.createdAt).format("LL")}</td>
// </tr>
// })}

// </tbody>
// </table>
// </div>



// </div>



// )
// }

// export default PersonalRecord
Loading

0 comments on commit 5952f3b

Please sign in to comment.