fix compile and explicitly name acronym in link

Author: Dave MacFarlane

jsx/MFAPrompt.tsx

@@ -43,9 +43,17 @@ function Digit(props: {
 }
 
 type errorCallback = (msg: string) => void;
+type MFACode = [
+     number|null,
+    number|null,
+    number|null,
+    number|null,
+    number|null,
+    number|null];
+
 /**
- * Prompt for a multi-factor authentication code and call onValidate
- * after a valid code has been entered.
+ * Prompt for a multi-factor authentication code and call validate
+ * callback to validate the code after all 6 digits have been entered.
  *
  * @param props - React props
  * @param props.validate - Callback when a code is entered to validate it.
@@ -55,18 +63,12 @@ type errorCallback = (msg: string) => void;
 function MFAPrompt(props: {validate:
     (code: string, onError: errorCallback) => void
 }) {
-  const [code, setCode] = useState<[
-     number|null,
-    number|null,
-    number|null,
-    number|null,
-    number|null,
-    number|null]>([null, null, null, null, null, null]);
+  const [code, setCode] = useState<MFACode>([null, null, null, null, null, null]);
   const digitCallback = useCallback(
     (index: number, value: number): boolean => {
       if (value >= 0 && value <= 9) {
        setCode(prev => {
-        const newCode = [...prev];
+        const newCode: MFACode = [...prev];
         newCode[index] = value;
         return newCode;
       });

modules/my_preferences/jsx/mfa.tsx

@@ -90,8 +90,8 @@ function MFAIndex(): React.ReactElement {
       setup MFA in LORIS!</b>
     </p>
     <QRCode value={mfaUrl} />
-    <p>Can't scan the QR code?
-      <a href="#" onClick={() => setShowModal(true)}>Setup manually.</a>
+    <p>Can't scan the QR code? <a href="#" onClick={() => setShowModal(true)}>
+    Setup manually.</a>
     </p>
     <CodeValidator secret={key} />
   </div>;

modules/my_preferences/templates/form_my_preferences.tpl

@@ -69,7 +69,7 @@
           in a different form element with a smarty template and it's easier
           to create a new "fresh" page with modern react/etc than rewrite
           the whole page or do a hybrid here *}
-       <a href="{$baseurl}/my_preferences/mfa">Configure MFA</a>
+       <a href="{$baseurl}/my_preferences/mfa">Configure multi-factor authentication (MFA)</a>
 	</label>
     </div>