From cb129238cb7a03bd581f61e7b8f0615fd9d81932 Mon Sep 17 00:00:00 2001
From: David Ralph <ohlookitsderpy@protonmail.com>
Date: Thu, 6 May 2021 18:30:57 +0100
Subject: [PATCH] fix: improvements and fixes to about tab and photoinformation

---
 src/components/modals/main/scss/index.scss          |  6 ++++++
 .../modals/main/settings/sections/About.jsx         | 13 ++++++++-----
 .../widgets/background/PhotoInformation.jsx         |  4 ++--
 src/modules/constants.js                            |  2 +-
 4 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/components/modals/main/scss/index.scss b/src/components/modals/main/scss/index.scss
index 88d56edc..d2bae84b 100644
--- a/src/components/modals/main/scss/index.scss
+++ b/src/components/modals/main/scss/index.scss
@@ -367,6 +367,12 @@ li {
   }
 }
 
+.aboutLogo {
+  height: 100px;
+  width: auto;
+  margin-left: -15px;
+}
+
 .MuiFormControl-root {
   margin-top: 10px !important;
 }
diff --git a/src/components/modals/main/settings/sections/About.jsx b/src/components/modals/main/settings/sections/About.jsx
index eb5c91be..f9889ba9 100644
--- a/src/components/modals/main/settings/sections/About.jsx
+++ b/src/components/modals/main/settings/sections/About.jsx
@@ -4,6 +4,8 @@ import Tooltip from '../../../../helpers/tooltip/Tooltip';
 import EmailIcon from '@material-ui/icons/Email';
 import TwitterIcon from '@material-ui/icons/Twitter';
 import ForumIcon from '@material-ui/icons/Forum';
+import InstagramIcon from '@material-ui/icons/Instagram';
+import FacebookIcon from '@material-ui/icons/Facebook';
 
 const other_contributors = require('../../../../../modules/other_contributors.json');
 
@@ -84,23 +86,24 @@ export default class About extends React.PureComponent {
     return (
       <>
         <h2>{this.language.title}</h2>
-        <img draggable='false' style={{'height': '100px', 'width': 'auto'}} src='./././icons/logo_horizontal.png' alt='Mue logo'></img>
+        <img draggable='false' className='aboutLogo' src='./././icons/logo_horizontal.png' alt='Mue logo'></img>
         <p>{this.language.copyright} 2018-{new Date().getFullYear()} Mue Tab (BSD-3 License)</p>
         <p>{this.language.version.title} {window.constants.VERSION} ({this.state.update})</p>
 
         <h3>{this.language.contact_us}</h3>
         <a href='mailto:hello@muetab.com' className='aboutIcon' target='_blank' rel='noopener noreferrer'><EmailIcon/></a>
         <a href='https://twitter.com/getmue' className='aboutIcon' target='_blank' rel='noopener noreferrer'><TwitterIcon/></a>
+        <a href='https://instagram.com/mue.tab' className='aboutIcon' target='_blank' rel='noopener noreferrer'><InstagramIcon/></a>
+        <a href='https://facebook.com/muetab' className='aboutIcon' target='_blank' rel='noopener noreferrer'><FacebookIcon/></a>
         <a href='https://discord.gg/zv8C9F8' className='aboutIcon' target='_blank' rel='noopener noreferrer'><ForumIcon/></a>
 
         <h3>{this.language.support_mue}</h3>
         <p><a href='https://github.com/sponsors/davidjcralph' className='aboutLink' target='_blank' rel='noopener noreferrer'>GitHub Sponsors</a> • <a href='https://ko-fi.com/davidjcralph' className='aboutLink' target='_blank' rel='noopener noreferrer'>Ko-Fi</a> • <a href='https://patreon.com/davidjcralph' className='aboutLink' target='_blank' rel='noopener noreferrer'>Patreon</a></p>
 
         <h3>{this.language.resources_used.title}</h3>
-        <p>Pexels ({this.language.resources_used.bg_images})</p>
-        <p>Unsplash ({this.language.resources_used.bg_images})</p>
-        <p>Google ({this.language.resources_used.pin_icon})</p>
-        <p>Undraw ({this.language.resources_used.welcome_img})</p>
+        <p><a href='https://www.pexels.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Pexels</a>, <a href='https://unsplash.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Unsplash</a> ({this.language.resources_used.bg_images})</p>
+        <p><a href='https://fonts.google.com/icons?selected=Material+Icons' className='aboutLink' target='_blank' rel='noopener noreferrer'>Google Fonts</a> ({this.language.resources_used.pin_icon})</p>
+        <p><a href='https://undraw.co/' className='aboutLink' target='_blank' rel='noopener noreferrer'>Undraw</a> ({this.language.resources_used.welcome_img})</p>
 
         <h3>{this.language.contributors}</h3>
         <p>{this.state.loading}</p>
diff --git a/src/components/widgets/background/PhotoInformation.jsx b/src/components/widgets/background/PhotoInformation.jsx
index 4ff3a74b..0ce7e725 100644
--- a/src/components/widgets/background/PhotoInformation.jsx
+++ b/src/components/widgets/background/PhotoInformation.jsx
@@ -37,11 +37,11 @@ export default function PhotoInformation(props) {
 
   // unsplash and pexels credit
   if (props.info.photographerURL && props.info.photographerURL !== '' && !props.info.offline && props.api) {
-    photo = <a href={props.info.photoURL} target='_blank' rel='noopener noreferrer'>{language.credit}</a>;
-
     if (props.api === 'unsplash') {
+      photo = <a href={props.info.photoURL + '?utm_source=mue'} target='_blank' rel='noopener noreferrer'>{language.credit}</a>;
       credit = <><a href={props.info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://unsplash.com?utm_source=mue' target='_blank' rel='noopener noreferrer'>{language.unsplash}</a></>;
     } else {
+      photo = <a href={props.info.photoURL} target='_blank' rel='noopener noreferrer'>{language.credit}</a>;
       credit = <><a href={props.info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://pexels.com' target='_blank' rel='noopener noreferrer'>{language.pexels}</a></>;
     }
   }
diff --git a/src/modules/constants.js b/src/modules/constants.js
index 938dc79c..090fedbf 100644
--- a/src/modules/constants.js
+++ b/src/modules/constants.js
@@ -11,4 +11,4 @@ export const FEEDBACK_FORM = 'https://api.formcake.com/api/form/349b56cb-7e2b-40
 export const DDG_PROXY = 'https://external-content.duckduckgo.com/iu/?u=';
 export const OFFLINE_IMAGES = 20;
 export const BETA_VERSION = false;
-export const VERSION = '5.0.0'; 
+export const VERSION = '5.0.1';