MBS-12801: Warn users about "Disc n" titles on release merge

This is a basic warning, which is probably enough. We could also disable
submission unless they confirm, by erroring at the Perl level, but this
is less intrusive and hopefully does the trick still, since it appears
just below the name row as soon as the user enters the triggering name.

root/static/scripts/edit/components/ReleaseMergeStrategy.js

@@ -21,6 +21,7 @@ import {ExpandedArtistCreditList}
 import Warning from '../../common/components/Warning.js';
 import formatTrackLength
   from '../../common/utility/formatTrackLength.js';
+import isUselessMediumTitle from '../utility/isUselessMediumTitle.js';
 
 import FormRowSelect from './FormRowSelect.js';
 
@@ -40,6 +41,28 @@ const mergeStrategyOptions = {
   ],
 };
 
+const UselessMediumTitleWarning = ({name}: {name: string}) => (
+  <tr>
+    <td colSpan="4">
+      <span
+        className="error"
+        style={{margin: '0 12px 0 6px'}}
+      >
+        {exp.l(
+          `“{matched_text}” seems to indicate medium ordering rather than
+           a medium title. If this is the case, please set the appropriate
+           medium position instead of adding a title
+           (see {release_style|the guidelines}).`,
+          {
+            matched_text: name,
+            release_style: '/doc/Style/Release#Medium_title',
+          },
+        )}
+      </span>
+    </td>
+  </tr>
+);
+
 const ReleaseMergeStrategy = ({
   badRecordingMerges,
   form,
@@ -57,6 +80,24 @@ const ReleaseMergeStrategy = ({
   }
 
   const mediumsMap = form.field.medium_positions.field.map;
+
+  const [mediumTitles, setMediumTitles] =
+    React.useState(mediumsMap.field.map(
+      field => field.field.name.value,
+    ));
+
+  function updateTitles(
+    event: SyntheticEvent<HTMLSelectElement>,
+    index: number,
+  ) {
+    const mediumTitle = event.currentTarget.value;
+    setMediumTitles(prevTitles => {
+      const titles = [...prevTitles];
+      titles[index] = mediumTitle;
+      return titles;
+    });
+  }
+
   return (
     <>
       <FormRowSelect
@@ -109,6 +150,7 @@ const ReleaseMergeStrategy = ({
                       <input
                         defaultValue={mediumField.name.value}
                         name={mediumField.name.html_name}
+                        onChange={event => updateTitles(event, index)}
                         type="text"
                       />
                       <input
@@ -151,6 +193,11 @@ const ReleaseMergeStrategy = ({
                       )}
                     </th>
                   </tr>
+                  {isUselessMediumTitle(mediumTitles[index]) ? (
+                    <UselessMediumTitleWarning
+                      name={mediumTitles[index]}
+                    />
+                  ) : null}
                   {medium.tracks ? medium.tracks.map((track, index) => (
                     <tr className={loopParity(index)} key={track.id}>
                       <td className="pos t">

root/static/scripts/edit/utility/isUselessMediumTitle.js

@@ -0,0 +1,12 @@
+/*
+ * @flow strict
+ * Copyright (C) 2023 MetaBrainz Foundation
+ *
+ * This file is part of MusicBrainz, the open internet music database,
+ * and is licensed under the GPL version 2, or (at your option) any
+ * later version: http://www.gnu.org/licenses/gpl-2.0.txt
+ */
+
+export default function isUselessMediumTitle(title: string): boolean {
+  return /^(Cassette|CD|Dis[ck]|DVD|SACD|Vinyl)\s*\d+/i.test(title);
+}

root/static/scripts/release-editor/fields.js

@@ -29,6 +29,7 @@ import request from '../common/utility/request.js';
 import {fixedWidthInteger, uniqueId} from '../common/utility/strings.js';
 import mbEdit from '../edit/MB/edit.js';
 import * as dates from '../edit/utility/dates.js';
+import isUselessMediumTitle from '../edit/utility/isUselessMediumTitle.js';
 import * as validation from '../edit/validation.js';
 
 import recordingAssociation from './recordingAssociation.js';
@@ -466,7 +467,7 @@ class Medium {
       this.hasStrangeDigitalPackaging(),
     );
     this.hasUselessMediumTitle = ko.computed(function () {
-      return /^(Cassette|CD|Dis[ck]|DVD|SACD|Vinyl)\s*\d+/i.test(self.name());
+      return isUselessMediumTitle(self.name());
     });
     this.confirmedMediumTitle = ko.observable(this.hasUselessMediumTitle());
     this.needsTrackArtists = ko.computed(function () {

root/static/scripts/tests/edit/utility/isUselessMediumTitle.js

@@ -0,0 +1,32 @@
+/*
+ * @flow strict
+ * Copyright (C) 2023 MetaBrainz Foundation
+ *
+ * This file is part of MusicBrainz, the open internet music database,
+ * and is licensed under the GPL version 2, or (at your option) any
+ * later version: http://www.gnu.org/licenses/gpl-2.0.txt
+ */
+
+import test from 'tape';
+
+import isUselessMediumTitle
+  from '../../../edit/utility/isUselessMediumTitle.js';
+
+test('isUselessMediumTitle', function (t) {
+  t.plan(3);
+
+  t.ok(
+    !isUselessMediumTitle('The Happy Disc'),
+    'A normal title is not useless',
+  );
+
+  t.ok(
+    isUselessMediumTitle('DVD 42'),
+    'A "format plus number" title is useless',
+  );
+
+  t.ok(
+    isUselessMediumTitle('Disk1'),
+    'A "format plus number" title is still useless if not space-separated',
+  );
+});

root/static/scripts/tests/index-web.js

@@ -5,6 +5,7 @@ require('./common/immutable-entities.js');
 require('./Control/URLCleanup.js');
 require('./CoverArt.js');
 require('./edit.js');
+require('./edit/utility/isUselessMediumTitle.js');
 require('./edit/utility/linkPhrase.js');
 require('./entity.js');
 require('./GuessCase.js');