refactor submit functions

web/source/settings-panel/admin/actions.js

@@ -25,6 +25,7 @@ const Redux = require("react-redux");
 const Submit = require("../components/submit");
 
 const api = require("../lib/api");
+const submit = require("../lib/submit");
 
 module.exports = function AdminActionPanel() {
 	const dispatch = Redux.useDispatch();
@@ -34,18 +35,10 @@ module.exports = function AdminActionPanel() {
 	const [errorMsg, setError] = React.useState("");
 	const [statusMsg, setStatus] = React.useState("");
 
-	function submit() {
+	const removeMedia = submit(
-		setStatus("PATCHing");
+		() => dispatch(api.admin.mediaCleanup(days)),
-		setError("");
+		{setStatus, setError}
-		return Promise.try(() => {
+	);
-			return dispatch(api.admin.mediaCleanup(days));
-		}).then(() => {
-			setStatus("Saved!");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
 	return (
 		<>
@@ -61,7 +54,7 @@ module.exports = function AdminActionPanel() {
 					<label htmlFor="days">Days: </label>
 					<input id="days" type="number" value={days} onChange={(e) => setDays(e.target.value)}/>
 				</div>
-				<Submit onClick={submit} label="Remove media" errorMsg={errorMsg} statusMsg={statusMsg} />
+				<Submit onClick={removeMedia} label="Remove media" errorMsg={errorMsg} statusMsg={statusMsg} />
 			</div>
 		</>
 	);

web/source/settings-panel/admin/federation.js

@@ -28,6 +28,7 @@ const { formFields } = require("../components/form-fields");
 
 const api = require("../lib/api");
 const adminActions = require("../redux/reducers/admin").actions;
+const submit = require("../lib/submit");
 
 const base = "/settings/admin/federation";
 
@@ -334,31 +335,15 @@ function InstancePage({domain, Form}) {
 		}
 	}
 
-	function submit() {
+	const updateBlock = submit(
-		setStatus("PATCHing");
+		() => dispatch(api.admin.updateDomainBlock(domain)),
-		setError("");
+		{setStatus, setError}
-		return Promise.try(() => {
+	);
-			return dispatch(api.admin.updateDomainBlock(domain));
-		}).then(() => {
-			setStatus("Saved!");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
-	function removeBlock() {
+	const removeBlock = submit(
-		setStatus("removing");
+		() => dispatch(api.admin.removeDomainBlock(domain)),
-		setError("");
+		{setStatus, setError, startStatus: "Removing", successStatus: "Removed!"}
-		return Promise.try(() => {
+	);
-			return dispatch(api.admin.removeDomainBlock(domain));
-		}).then(() => {
-			setStatus("removed");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
 	return (
 		<div>
@@ -381,7 +366,7 @@ function InstancePage({domain, Form}) {
 			/>
 
 			<div className="messagebutton">
-				<button type="submit" onClick={submit}>{entry.new ? "Add block" : "Save block"}</button>
+				<button type="submit" onClick={updateBlock}>{entry.new ? "Add block" : "Save block"}</button>
 
 				{!entry.new &&
 					<button className="danger" onClick={removeBlock}>Remove block</button>

web/source/settings-panel/admin/settings.js

@@ -25,6 +25,8 @@ const Redux = require("react-redux");
 const Submit = require("../components/submit");
 
 const api = require("../lib/api");
+const submit = require("../lib/submit");
+
 const adminActions = require("../redux/reducers/instances").actions;
 
 const {
@@ -35,23 +37,14 @@ 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("");
 
-	function submit() {
+	const updateSettings = submit(
-		setStatus("PATCHing");
+		() => dispatch(api.admin.updateInstance()),
-		setError("");
+		{setStatus, setError}
-		return Promise.try(() => {
+	);
-			return dispatch(api.admin.updateInstance());
-		}).then(() => {
-			setStatus("Saved!");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
 	return (
 		<div>
@@ -111,7 +104,7 @@ module.exports = function AdminSettings() {
 					/>
 				</div>
 			</div> */}
-			<Submit onClick={submit} label="Save" errorMsg={errorMsg} statusMsg={statusMsg} />
+			<Submit onClick={updateSettings} label="Save" errorMsg={errorMsg} statusMsg={statusMsg} />
 		</div>
 	);
 };

web/source/settings-panel/lib/submit.js

@@ -34,7 +34,6 @@ module.exports = function submit(func, {
 		}).then(() => {
 			setStatus(successStatus);
 			if (onSuccess != undefined) {
-				console.log("running", onSuccess);
 				return onSuccess();
 			}
 		}).catch((e) => {

web/source/settings-panel/user/profile.js

@@ -26,6 +26,7 @@ const Submit = require("../components/submit");
 
 const api = require("../lib/api");
 const user = require("../redux/reducers/user").actions;
+const submit = require("../lib/submit");
 
 const { formFields } = require("../components/form-fields");
 
@@ -46,18 +47,10 @@ module.exports = function UserProfile() {
 	const [errorMsg, setError] = React.useState("");
 	const [statusMsg, setStatus] = React.useState("");
 
-	function submit() {
+	const saveProfile = submit(
-		setStatus("PATCHing");
+		() => dispatch(api.user.updateProfile()),
-		setError("");
+		{setStatus, setError}
-		return Promise.try(() => {
+	);
-			return dispatch(api.user.updateProfile());
-		}).then(() => {
-			setStatus("Saved!");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
 	return (
 		<div className="user-profile">
@@ -114,7 +107,7 @@ module.exports = function UserProfile() {
 					<a href="https://docs.gotosocial.org/en/latest/user_guide/custom_css" target="_blank" className="moreinfolink" rel="noreferrer">Learn more about custom profile CSS (opens in a new tab)</a>
 				</TextArea>
 			}
-			<Submit onClick={submit} label="Save profile info" errorMsg={errorMsg} statusMsg={statusMsg} />
+			<Submit onClick={saveProfile} label="Save profile info" errorMsg={errorMsg} statusMsg={statusMsg} />
 		</div>
 	);
 };

web/source/settings-panel/user/settings.js

@@ -24,6 +24,7 @@ const Redux = require("react-redux");
 
 const api = require("../lib/api");
 const user = require("../redux/reducers/user").actions;
+const submit = require("../lib/submit");
 
 const Languages = require("../components/languages");
 const Submit = require("../components/submit");
@@ -39,18 +40,10 @@ module.exports = function UserSettings() {
 	const [errorMsg, setError] = React.useState("");
 	const [statusMsg, setStatus] = React.useState("");
 
-	function submit() {
+	const updateSettings = submit(
-		setStatus("PATCHing");
+		() => dispatch(api.user.updateSettings()),
-		setError("");
+		{setStatus, setError}
-		return Promise.try(() => {
+	);
-			return dispatch(api.user.updateSettings());
-		}).then(() => {
-			setStatus("Saved!");
-		}).catch((e) => {
-			setError(e.message);
-			setStatus("");
-		});
-	}
 
 	return (
 		<>
@@ -82,7 +75,7 @@ module.exports = function UserSettings() {
 					name="Mark my posts as sensitive by default"
 				/>
 
-				<Submit onClick={submit} label="Save post settings" errorMsg={errorMsg} statusMsg={statusMsg}/>
+				<Submit onClick={updateSettings} label="Save post settings" errorMsg={errorMsg} statusMsg={statusMsg}/>
 			</div>
 			<div>
 				<PasswordChange/>
@@ -101,7 +94,7 @@ function PasswordChange() {
 	const [newPassword, setNewPassword] = React.useState("");
 	const [newPasswordConfirm, setNewPasswordConfirm] = React.useState("");
 
-	function submit() {
+	function changePassword() {
 		if (newPassword !== newPasswordConfirm) {
 			setError("New password and confirm new password did not match!");
 			return;
@@ -141,7 +134,7 @@ function PasswordChange() {
 				<label htmlFor="confirm-new-password">Confirm new password</label>
 				<input name="confirm-new-password" id="confirm-new-password" type="password" autoComplete="new-password" value={newPasswordConfirm} onChange={(e) => setNewPasswordConfirm(e.target.value)} />
 			</div>
-			<Submit onClick={submit} label="Save new password" errorMsg={errorMsg} statusMsg={statusMsg}/>
+			<Submit onClick={changePassword} label="Save new password" errorMsg={errorMsg} statusMsg={statusMsg}/>
 		</>
 	);
 }