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

change button functions

Browse source
This commit is contained in:
luisa.bellitto 2025-06-24 13:47:13 +02:00 • committed by Rudi Regentonne
parent 775ba536fa
commit e09252bd76
7 changed files with 88 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

56
code/frontend/src/components/ChangeAvatarDialog.tsx
View file

@ -28,7 +28,13 @@ const BootstrapDialog = styled(Dialog)(({ theme }) => ({
},
}));
export default function CustomizedDialogs() {
export default function AvatarDialog({
ownAccount,
username,
}: {
ownAccount: boolean;
username: string;
}) {
const { openFilePicker, filesContent, loading } = useFilePicker({
accept: ".png, .jpg, .jpeg",
multiple: false,
@ -83,8 +89,10 @@ export default function CustomizedDialogs() {
className="small-title orange-text"
sx={{ m: 1.5, p: 2 }}
id="change-profile-picture-dialog"
>
Change Profile Picture
> { ownAccount ?
"Change Profile Picture" :
username
}
</DialogTitle>
<IconButton
aria-label="close"
@ -125,20 +133,36 @@ export default function CustomizedDialogs() {
></img>
))}
</Box>
<div className="change-avatar-button">
<IconButton
aria-label="upload picture"
onClick={() => openFilePicker()}
>
<EditSquareIcon className="edit-icon" />
</IconButton>
</div>
{ownAccount && (
<div className="change-avatar-button">
<IconButton
aria-label="upload picture"
onClick={() => openFilePicker()}
>
<EditSquareIcon className="edit-icon" />
</IconButton>
</div>
)}
</DialogContent>
<Divider variant="middle" className="divider" />
<DialogActions>
<ButtonRotkehlchen style="primary" label="Save Changes" onClick={handleSaveChanges} />
<ButtonRotkehlchen style="secondary" label="Cancel" onClick={handleClose} />
</DialogActions>
{ownAccount && (
<div>
<Divider variant="middle" className="divider" />
<DialogActions>
<ButtonRotkehlchen
style="primary"
label="Save Changes"
type="submit"
onClick={handleSaveChanges}
/>
<ButtonRotkehlchen
style="secondary"
label="Cancel"
type="reset"
onClick={handleClose}
/>
</DialogActions>
</div>
)}
</BootstrapDialog>
</React.Fragment>
);