blob: 929151fbcddf431333131b12a3edd4046ccb59fa (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
import React, {useRef} from 'react';
import Button from '@material-ui/core/Button';
import TextField from '@material-ui/core/TextField';
import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import DialogTitle from '@material-ui/core/DialogTitle';
import {patch} from "../../requests";
import {User} from 'which-types';
interface PropTypes {
displayD: boolean;
setDisplayD: (d: boolean) => void;
setUserInfo: (a: User) => void;
setUser: (a: User) => void
}
const UploadImage: React.FC<PropTypes> = ({displayD,setDisplayD,setUserInfo,setUser}) => {
const urlRef = useRef<HTMLInputElement>(null);
const handleClose = () => {
setDisplayD(false);
};
const updateAvatar = (event: any) => {
const id = localStorage.getItem('userId');
const newAvatar = urlRef.current?.value;
console.log(newAvatar);
patch(`/users/${id}`, {avatarUrl: newAvatar}).then(res => {
setUserInfo(res.data);
setUser(res.data);
});
setDisplayD(false);
};
return (
<div>
<Dialog open={displayD} onClose={handleClose} >
<DialogTitle id="form-dialog-title">Upload an Image</DialogTitle>
<DialogContent>
<DialogContentText>
Unfortunetly we do not support uploading images yet. Please provide a valid URL to your image.
</DialogContentText>
<TextField
autoFocus
margin="dense"
id="name"
label="Image URL"
type="text"
fullWidth
autoComplete="off"
inputRef={urlRef}
/>
</DialogContent>
<DialogActions>
<Button onClick={handleClose} color="primary">
Cancel
</Button>
<Button onClick={updateAvatar} color="primary">
Submit
</Button>
</DialogActions>
</Dialog>
</div>
);
};
export default UploadImage;
|
