[feature] Make instance thumbnail configurable via admin panel (#973)

* [feature] Make instance thumbnail configurable via admin panel

* log db errors in InstanceToAPIInstance

* only update instance in db if necessary

* start adding tests

* finish test

2 files changed, 20 insertions, 23 deletions

diff --git a/web/source/settings/admin/settings.js b/web/source/settings/admin/settings.js
index eb6e8b267..88f32624a 100644
--- a/web/source/settings/admin/settings.js
+++ b/web/source/settings/admin/settings.js
@@ -36,6 +36,7 @@ const {
 
 module.exports = function AdminSettings() {
 	const dispatch = Redux.useDispatch();
+	const instance = Redux.useSelector(state => state.instances.adminSettings);
 
 	const [errorMsg, setError] = React.useState("");
 	const [statusMsg, setStatus] = React.useState("");
@@ -54,6 +55,23 @@ module.exports = function AdminSettings() {
 				placeHolder="My GoToSocial instance"
 			/>
 
+			<div className="file-upload">
+				<h3>Instance thumbnail</h3>
+				<div>
+					<img className="preview avatar" src={instance.thumbnail} alt={instance.thumbnail ? `Thumbnail image for the instance` : "No instance thumbnail image set"} />
+					<File 
+						id="thumbnail"
+						fileType="image/*"
+					/>
+				</div>
+			</div>
+
+			<TextInput
+				id="thumbnail_description"
+				name="Instance thumbnail description"
+				placeHolder="A cute little picture of a smiling sloth."
+			/>
+
 			<TextArea
 				id="short_description"
 				name="Short description"
@@ -82,27 +100,6 @@ module.exports = function AdminSettings() {
 				placeHolder=""
 			/>
 
-			{/* <div className="file-upload">
-				<h3>Instance avatar</h3>
-				<div>
-					<img className="preview avatar" src={instance.avatar} alt={instance.avatar ? `Avatar image for the instance` : "No instance avatar image set"} />
-					<File 
-						id="avatar"
-						fileType="image/*"
-					/>
-				</div>
-			</div>
-
-			<div className="file-upload">
-				<h3>Instance header</h3>
-				<div>
-					<img className="preview header" src={instance.header} alt={instance.header ? `Header image for the instance` : "No instance header image set"} />
-					<File 
-						id="header"
-						fileType="image/*"
-					/>
-				</div>
-			</div> */}
 			<Submit onClick={updateSettings} label="Save" errorMsg={errorMsg} statusMsg={statusMsg} />
 		</div>
 	);
diff --git a/web/source/settings/lib/api/admin.js b/web/source/settings/lib/api/admin.js
index 5f4fa1d1f..4ac17ee6a 100644
--- a/web/source/settings/lib/api/admin.js
+++ b/web/source/settings/lib/api/admin.js
@@ -32,9 +32,9 @@ module.exports = function ({ apiCall, getChanges }) {
 					const state = getState().instances.adminSettings;
 
 					const update = getChanges(state, {
-						formKeys: ["title", "short_description", "description", "contact_account.username", "email", "terms"],
+						formKeys: ["title", "short_description", "description", "contact_account.username", "email", "terms", "thumbnail_description"],
 						renamedKeys: {"contact_account.username": "contact_username"},
-						// fileKeys: ["avatar", "header"]
+						fileKeys: ["thumbnail"]
 					});
 
 					return dispatch(apiCall("PATCH", "/api/v1/instance", update, "form"));