From 6addde3fa9a1e9701309ce270c85ff6987cd0b0e Mon Sep 17 00:00:00 2001
From: Roland Bernard <rolbernard@unibz.it>
Date: Tue, 1 Jun 2021 13:22:42 +0200
Subject: [PATCH] Fixed some bugs concerning the user settings
---
.../src/components/forms/UserForm/index.tsx | 2 +-
client/src/components/ui/Avatar/avatar.scss | 5 -----
client/src/components/ui/Avatar/index.tsx | 20 +------------------
client/src/pages/Settings/index.tsx | 17 ++++++++--------
4 files changed, 11 insertions(+), 33 deletions(-)
diff --git a/client/src/components/forms/UserForm/index.tsx b/client/src/components/forms/UserForm/index.tsx
index 20e8db1..dac9e60 100644
--- a/client/src/components/forms/UserForm/index.tsx
+++ b/client/src/components/forms/UserForm/index.tsx
@@ -19,7 +19,7 @@ interface Props {
user: User
}
-const validTypes = ['image/jpg', 'image/png', 'image/gif', 'image/svg']
+const validTypes = ['image/jpeg', 'image/png', 'image/gif', 'image/svg']
function validateEmail(email?: string): string | null {
if (email && email.length > 0) {
diff --git a/client/src/components/ui/Avatar/avatar.scss b/client/src/components/ui/Avatar/avatar.scss
index 424b21e..d487a3a 100644
--- a/client/src/components/ui/Avatar/avatar.scss
+++ b/client/src/components/ui/Avatar/avatar.scss
@@ -6,11 +6,6 @@
overflow: hidden;
img {
- width: 100%;
- height: auto;
- }
-
- .standard-image {
width: 100%;
height: 100%;
background: s.$secondary;
diff --git a/client/src/components/ui/Avatar/index.tsx b/client/src/components/ui/Avatar/index.tsx
index 58e96bc..6096333 100644
--- a/client/src/components/ui/Avatar/index.tsx
+++ b/client/src/components/ui/Avatar/index.tsx
@@ -1,6 +1,4 @@
-import { useCallback, useState } from 'react';
-
import { getUserImageUri, User } from 'adapters/user';
import './avatar.scss';
@@ -10,27 +8,11 @@ interface Props {
}
export default function Avatar({ user }: Props) {
- const [error, setError] = useState(false);
const avatarSrc = user && getUserImageUri(user.id);
- const onError = useCallback(() => {
- setError(true);
- }, [setError]);
-
return (
<div className="avatar">
- {
- !error && (
- <img src={avatarSrc} alt={user?.username} onError={onError} />
- )
- }
- {
- error && (
- <div className="standard-image">
- {user?.username && user.username.charAt(0)}
- </div>
- )
- }
+ <img src={avatarSrc} alt={user?.username.charAt(0) ?? "?"} />
</div>
)
}
diff --git a/client/src/pages/Settings/index.tsx b/client/src/pages/Settings/index.tsx
index 543d876..daad87b 100644
--- a/client/src/pages/Settings/index.tsx
+++ b/client/src/pages/Settings/index.tsx
@@ -2,6 +2,7 @@
import { useHistory } from 'react-router';
import { useCallback, useEffect, useState } from 'react';
+import { reload } from 'index';
import { getCurrentUser, updateUser, updateUserImage, User } from 'adapters/user';
import Callout from 'components/ui/Callout';
@@ -16,21 +17,21 @@ export default function Settings() {
const history = useHistory();
useEffect(() => {
- getCurrentUser().then((user) => setUser(user))
+ getCurrentUser().then(setUser)
}, []);
const handleSubmit = useCallback(async (name?: string, email?: string, avatar?: File) => {
try {
- if (user && updateUser({ realname: name, email })) {
- if (avatar) {
- updateUserImage(avatar);
- }
- history.push('/tasks');
- }
+ await Promise.all([
+ updateUser({ realname: name, email: email }),
+ avatar && updateUserImage(avatar)
+ ])
+ history.push('/tasks');
+ reload();
} catch (e) {
setError('There was an issue with saving your settings. Please try again!')
}
- }, [history, user]);
+ }, [history]);
return (
user
--
GitLab