Tweak avatars

src/Components/MemberCard.js

@@ -90,7 +90,7 @@ export default function MemberCard(props) {
         } else setPronouns('')
 
         if (member.avatar_url) {
-            setAvatar(member.avatar_url)
+            setAvatar(member.avatar_url.replace('?width=256&height=256&format=jpeg', ''))
         } else setAvatar('')
         
         if (member.color) {
@@ -202,7 +202,7 @@ export default function MemberCard(props) {
             { member.avatar_url ?   <Popup trigger={<BS.Image src={`${member.avatar_url}`} style={{width: 50, height: 50}} tabIndex="0" className="float-right" roundedCircle />} className="avatar" modal>
                 {close => (
                     <div className="text-center w-100 m-0" onClick={() => close()}>
-                    <BS.Image src={`${member.avatar_url}`} style={{width: 500, height: 'auto'}} thumbnail />
+                    <BS.Image src={`${avatar}`} style={{width: 500, height: 'auto'}} thumbnail />
                     </div>
                 )}
             </Popup> : 

src/Components/Profile.js

@@ -18,6 +18,7 @@ export default function Profile () {
     const [ tag, setTag ] = useState("");
     const [ timezone, setTimezone ] = useState("");
     const [ desc, setDesc ] = useState("");
+    const [ avatar, setAvatar ] = useState('');
 
     const [ isLoading, setIsLoading ] = useState(true);
     const [ isError, setIsError ] = useState(false);
@@ -44,6 +45,10 @@ export default function Profile () {
             setName(system.name);
         } else setName('');
 
+        if (system.avatar_url) {
+            setAvatar(system.avatar_url.replace('?width=256&height=256&format=jpeg', ''))
+        } else setAvatar('')
+
         if (system.tag) {
             setTag(system.tag);
         } else setTag('');
@@ -66,7 +71,7 @@ export default function Profile () {
            { system.avatar_url ? <Popup trigger={<BS.Image src={`${system.avatar_url}`} style={{width: 50, height: 50}} tabIndex="0" className="float-right" roundedCircle />} className="avatar" modal>
          {close => (
              <div className="text-center w-100 m-0" onClick={() => close()}>
-             <BS.Image src={`${system.avatar_url}`} style={{width: 500, height: 'auto'}} thumbnail />
+             <BS.Image src={`${avatar}`} style={{'max-width': 500, height: 'auto'}} thumbnail />
              </div>
          )}
      </Popup> : 

src/Components/ProfileCard.js

@@ -14,6 +14,7 @@ export default function MemberCard(props) {
 
     const member = props.member;
 
+    const [ avatar, setAvatar ] = useState('')
     const [ displayName, setDisplayName ] = useState("");
     const [ birthday, setBirthday ] = useState("");
     const [ pronouns, setPronouns ] = useState("");
@@ -46,6 +47,10 @@ export default function MemberCard(props) {
         } else { setBirthday('');
     }
 
+    if (member.avatar_url) {
+        setAvatar(member.avatar_url.replace('?width=256&height=256&format=jpeg', ''))
+    } else setAvatar('')
+
         if (member.pronouns) {
             setPronouns(member.pronouns)
         } else setPronouns('')
@@ -66,7 +71,7 @@ export default function MemberCard(props) {
             { member.avatar_url ?   <Popup trigger={<BS.Image src={`${member.avatar_url}`} style={{width: 50, height: 50}} tabIndex="0" className="float-right" roundedCircle />} className="avatar" modal>
                 {close => (
                     <div className="text-center w-100 m-0" onClick={() => close()}>
-                    <BS.Image src={`${member.avatar_url}`} style={{width: 500, height: 'auto'}} thumbnail />
+                    <BS.Image src={`${avatar}`} style={{'max-width': 500, height: 'auto'}} thumbnail />
                     </div>
                 )}
             </Popup> : 

src/Components/System.js

@@ -59,7 +59,7 @@ export default function System(props) {
     } else setTimezone('');
 
     if (user.avatar_url) {
-        setAvatar(user.avatar_url)
+        setAvatar(user.avatar_url.replace('?width=256&height=256&format=jpeg', ''))
     } else setAvatar('')
 
     if (user.description) {
@@ -118,7 +118,7 @@ const submitPrivacy = data => {
                   { user.avatar_url ? <Popup trigger={<BS.Image src={`${user.avatar_url}`} style={{width: 50, height: 50}} tabIndex="0" className="float-right" roundedCircle />} className="avatar" modal>
                 {close => (
                     <div className="text-center w-100 m-0" onClick={() => close()}>
-                    <BS.Image src={`${user.avatar_url}`} style={{width: 500, height: 'auto'}} thumbnail />
+                    <BS.Image src={`${avatar}`} style={{'max-width': 500, height: 'auto'}} thumbnail />
                     </div>
                 )}
             </Popup> :