Make size inputs default to MB, not bytes

Author: askmeaboutlo0m

src/components/form.js

@@ -24,6 +24,23 @@ export const TextInput = ({long, enabled=true, value, update, pending}) => (
 	/>
 );
 
+export const SizeInput = ({long, enabled=true, value, update, pending}) => (
+	<input
+		type="text"
+		disabled={!enabled}
+		className={classNames({'input-text': true, long, pending})}
+		value={value}
+		onChange={(e) => {
+			const value = e.target.value;
+			if (/^\s*[0-9]+(\.[0-9]+)?\s*$/.test(value)) {
+				update(value, true, value + "MB");
+			} else {
+				update(value);
+			}
+		}}
+	/>
+);
+
 export const TextAreaInput = ({long=true, enabled=true, value, update, pending, rows=10, maxLength}) => (
 	<textarea
 		type="text"

src/pages/sessions/session.js

@@ -8,6 +8,7 @@ import {
   IntegerInput,
   ReadOnly,
   CheckboxInput,
+  SizeInput,
 } from "../../components/form.js";
 import { ModalContent } from "./modals.js";
 import {
@@ -71,15 +72,15 @@ const SessionInfo = ({ session, openModal, vprops, locked }) => {
         </Field>
         {session.overrideSize !== undefined && (
           <Field label="Override size limit">
-            <TextInput {...vprops("overrideSize")} />
+            <SizeInput {...vprops("overrideSize")} />
             <p className="details">
               A value of 0 MB will use the server-wide size limit of{" "}
               {(session.baseSize / (1024 * 1024)).toFixed(2)} MB.
             </p>
           </Field>
         )}
         <Field label="Autoreset threshold">
-          <TextInput {...vprops("resetThreshold")} />
+          <SizeInput {...vprops("resetThreshold")} />
           {session.effectiveResetThreshold && (
             <>
               {" effectively "}
@@ -705,15 +706,15 @@ export class SessionPage extends React.Component {
     this.setState({ session, locked: session._locked, error: null });
   }
 
-  updateSetting(key, value) {
+  updateSetting(key, value, haveChangeValue, changeValue) {
     this.setState((d) => ({
       session: {
         ...d.session,
         [key]: value,
       },
       changed: {
         ...d.changed,
-        [key]: value,
+        [key]: haveChangeValue ? changeValue : value,
       },
     }));
 
@@ -898,7 +899,8 @@ export class SessionPage extends React.Component {
     const { session, changed, error, modal, locked } = this.state;
     const vprops = (name, enabled = true) => ({
       value: session[name],
-      update: (value) => this.updateSetting(name, value),
+      update: (value, haveChangeValue, changeValue) =>
+        this.updateSetting(name, value, haveChangeValue, changeValue),
       pending: changed[name] !== undefined,
       enabled: !locked && enabled,
     });

src/pages/settings/index.js

@@ -6,6 +6,7 @@ import {
   TextInput,
   CheckboxInput,
   TextAreaInput,
+  SizeInput,
 } from "../../components/form.js";
 import * as API from "../../api";
 import {
@@ -29,15 +30,15 @@ export default class extends React.Component {
 
   debounceTimer = null;
 
-  updateSetting(key, value) {
+  updateSetting(key, value, haveChangeValue, changeValue) {
     this.setState((d) => ({
       settings: {
         ...d.settings,
         [key]: value,
       },
       changed: {
         ...d.changed,
-        [key]: value,
+        [key]: haveChangeValue ? changeValue : value,
       },
     }));
 
@@ -190,7 +191,8 @@ export default class extends React.Component {
       const changed = this.state.changed;
       const vprops = (name, enabled = true) => ({
         value: settings[name],
-        update: (value) => this.updateSetting(name, value),
+        update: (value, haveChangeValue, changeValue) =>
+          this.updateSetting(name, value, haveChangeValue, changeValue),
         pending: changed[name] !== undefined,
         enabled: enabled && !locked,
       });
@@ -285,11 +287,11 @@ export default class extends React.Component {
             <TextInput {...vprops("sessionSizeLimit")} />
           </Field>
           <Field label="Default autoreset threshold">
-            <TextInput {...vprops("autoResetThreshold")} />
+            <SizeInput {...vprops("autoResetThreshold")} />
           </Field>
           {settings["minimumAutoResetThreshold"] !== undefined && (
             <Field label="Minimum autoreset threshold">
-              <TextInput {...vprops("minimumAutoResetThreshold")} />
+              <SizeInput {...vprops("minimumAutoResetThreshold")} />
             </Field>
           )}
           <Field label="Max simultaneous sessions">