diff --git a/package.json b/package.json
index 20016efb..61f2c455 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,8 @@
"react-dom": "^16.13.1",
"react-modal": "^3.11.2",
"react-toastify": "^6.0.8",
- "supports-webp": "^2.0.1"
+ "supports-webp": "^2.0.1",
+ "lodash.merge": "4.6.2"
},
"devDependencies": {
"react-scripts": "3.4.3",
diff --git a/src/App.jsx b/src/App.jsx
index 5df2c224..68a29987 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -13,7 +13,7 @@ import Navbar from './components/Navbar';
import SettingsFunctions from './modules/settingsFunctions';
import { ToastContainer } from 'react-toastify';
import Modal from 'react-modal';
-import { merge } from './modules/merge';
+import merge from 'lodash.merge';
import RoomIcon from '@material-ui/icons/Room';
// Modals are lazy loaded as a user won't use them every time they open a tab
diff --git a/src/components/widgets/Background.jsx b/src/components/widgets/Background.jsx
index e903cc12..786ba226 100644
--- a/src/components/widgets/Background.jsx
+++ b/src/components/widgets/Background.jsx
@@ -14,9 +14,10 @@ export default class Background extends React.PureComponent {
if (credit === 'false') document.querySelector('#credits').style.display = 'none'; // Hide the credit
}
- setCredit(photographer) {
- document.querySelector('#photographer').append(` ${photographer}`); // Append credit
- document.getElementById('credit').textContent = photographer;
+ setCredit(photographer, unsplash, url) {
+ let credit = photographer;
+ if (unsplash) credit = `${photographer} on Unsplash`;
+ document.querySelector('#photographer').insertAdjacentHTML("beforeend", ` ${credit}`); // Append credit
}
doOffline() { // Handles setting the background if the user is offline
@@ -72,10 +73,10 @@ export default class Background extends React.PureComponent {
const data = await (await fetch(requestURL)).json(); // Fetch JSON data from requestURL
- if (data.statusCode === 429) {
- this.doOffline(); // If we hit the rate limit, fallback to local images
- } else { // Otherwise, set the background and credit from remote data
+ if (data.statusCode === 429) this.doOffline(); // If we hit the rate limit, fallback to local images
+ else { // Otherwise, set the background and credit from remote data
this.setBackground(data.file);
+ if (localStorage.getItem('backgroundAPI') === 'unsplash') return this.setCredit(data.photographer, 'unsplash', data.photographer_page);
this.setCredit(data.photographer);
}
diff --git a/src/modules/merge.js b/src/modules/merge.js
deleted file mode 100644
index 82626757..00000000
--- a/src/modules/merge.js
+++ /dev/null
@@ -1,17 +0,0 @@
-/**
- * Merges 2 objects into a huge one
- * @template T The original object
- * @template U The object that is returned
- * @param {...T} items The objects to merge
- * @returns {U} The merged object
- */
-export const merge = (...items) => {
- const obj = {};
- for (let i = 0; i < items.length; i++) {
- for (const k in items[i]) {
- if (!obj.hasOwnProperty(k)) obj[k] = items[i][k];
- }
- }
-
- return obj;
-};
\ No newline at end of file
diff --git a/src/scss/index.scss b/src/scss/index.scss
index 4614e6b8..f5591191 100644
--- a/src/scss/index.scss
+++ b/src/scss/index.scss
@@ -91,4 +91,9 @@ body {
#searchEngine {
width: 130px;
+}
+
+.creditlink {
+ text-decoration: none;
+ color: white;
}
\ No newline at end of file