mirrors/VogelSocialMedia
1
0
Fork 0
mirror of https://github.com/bubblecup-12/VogelSocialMedia.git synced 2025-07-06 15:18:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

make profile page editable

Browse source
This commit is contained in:
luisa.bellitto 2025-06-20 11:22:32 +02:00 • committed by Rudi Regentonne
parent 2aeea4033a
commit 343fe1f704
8 changed files with 241 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

31
code/frontend/src/pages/Profile.tsx
View file

@ -16,8 +16,9 @@ import {
ThemeProvider,
Divider,
Button,
Tooltip,
} from "@mui/material";
import Bio from "../components/Bio";
import ProfilePictureDialog from "../components/ChagneAvatarDialog";
function Profile() {
const toggleEditMode = (event: React.MouseEvent<HTMLElement>) => {
@ -44,14 +45,12 @@ function Profile() {
<div className="profile-display">
<div className="user-info">
<div className="user">
<Avatar
alt="Username"
src="./assets/images/OwlSignUp.png"
className="profile-avatar"
>
U
</Avatar>
<span className="profile-username body-l">Username</span>
<ProfilePictureDialog />
<Tooltip title="Username12345678" placement="top" arrow>
<button className="profile-username body-l">
Username12345678
</button>
</Tooltip>
</div>
<div>
<Box
@ -65,6 +64,7 @@ function Profile() {
}}
noValidate
autoComplete="off"
onClick={editMode ? toggleEditMode : undefined}
>
<TextField
className="bio-input"
@ -73,12 +73,19 @@ function Profile() {
multiline
maxRows={4}
disabled={editMode}
onClick={editMode ? toggleEditMode : undefined}
/>
</Box>
{!editMode && <Button variant="contained" className="button" onClick={toggleEditMode}>Ok</Button>}
{!editMode && (
<Button
variant="contained"
className="button"
onClick={toggleEditMode}
>
Ok
</Button>
)}
</div>
<Divider variant="middle" className="divider"/>
<Divider variant="middle" className="divider" />
<div className="numeral-data">
<div className="data">
<span aria-label="current-post-number">50</span>