import React, { useState } from 'react' import { Link, useHistory } from 'react-router-dom' import Container from '@material-ui/core/Container' import Grid from '@material-ui/core/Grid' import TextField from '@material-ui/core/TextField' import Button from '@material-ui/core/Button' import { makeStyles } from '@material-ui/core/styles' import logout from '@wasp/auth/logout.js' import updateUser from '@wasp/actions/updateUser' import Navbar from '../../Navbar' const UserSettingsPage = ({ user }) => { return ( ) } const useStyles = makeStyles((theme) => ({ textField: { //width: '25ch', marginBottom: theme.spacing(3) }, logoutButton: { marginTop: theme.spacing(3) } })) const UserSettings = (props) => { const classes = useStyles() const user = props.user const history = useHistory() const [profilePictureUrl, setProfilePictureUrl] = useState(user.profilePictureUrl || '') const [username, setUsername] = useState(user.username || '') const [bio, setBio] = useState(user.bio || '') const [email, setEmail] = useState(user.email || '') const [newPassword, setNewPassword] = useState('') const [submitError, setSubmitError] = useState(null) const handleSubmit = async (event) => { event.preventDefault() setSubmitError(null) try { await updateUser({ profilePictureUrl, username, bio, email, newPassword }) // TODO: If update was successful, send user to his profile (/@). history.push(`/@${username}`) } catch (err) { setSubmitError(err) } } const handleLogout = async () => { await logout() history.push('/') } return (
{ submitError && (

{ submitError.message || submitError }

) }
setProfilePictureUrl(e.target.value)} /> setUsername(e.target.value)} /> setBio(e.target.value)} /> setEmail(e.target.value)} /> setNewPassword(e.target.value)} />
) } export default UserSettingsPage