From f5b7a4036c9ebf2dd9ed1cf3af43c51c8fb4f397 Mon Sep 17 00:00:00 2001
From: aglowinthefield <146008217+aglowinthefield@users.noreply.github.com>
Date: Fri, 19 Sep 2025 10:31:20 -0400
Subject: [PATCH] Utilize hinted select for MBID

---
 .../Components/Form/AlbumReleaseSelectInputConnector.js   | 8 ++++----
 .../AlbumRelease/SelectAlbumReleaseRow.js                 | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/Components/Form/AlbumReleaseSelectInputConnector.js b/frontend/src/Components/Form/AlbumReleaseSelectInputConnector.js
index fa8957213..22a1cdc1d 100644
--- a/frontend/src/Components/Form/AlbumReleaseSelectInputConnector.js
+++ b/frontend/src/Components/Form/AlbumReleaseSelectInputConnector.js
@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import shortenList from 'Utilities/String/shortenList';
 import titleCase from 'Utilities/String/titleCase';
-import SelectInput from './SelectInput';
+import EnhancedSelectInput from './EnhancedSelectInput';
 
 function createMapStateToProps() {
   return createSelector(
@@ -29,8 +29,8 @@ function createMapStateToProps() {
             `${disambiguation ? ' (' : ''}${titleCase(disambiguation)}${disambiguation ? ')' : ''}` +
             `, ${mediumCount} med, ${trackCount} tracks` +
             `${country && country.length > 0 ? `, ${shortenList(country)}` : ''}` +
-            `${format ? `, [${format}]` : ''}` +
-            `, [...${foreignReleaseId.toString().slice(-4)}]`
+            `${format ? `, [${format}]` : ''}`,
+          hint: `MBID: ${foreignReleaseId.toString().slice(0, 8)}`
         };
       });
 
@@ -65,7 +65,7 @@ class AlbumReleaseSelectInputConnector extends Component {
   render() {
 
     return (
-      <SelectInput
+      <EnhancedSelectInput
         {...this.props}
         onChange={this.onChange}
       />
diff --git a/frontend/src/InteractiveImport/AlbumRelease/SelectAlbumReleaseRow.js b/frontend/src/InteractiveImport/AlbumRelease/SelectAlbumReleaseRow.js
index b18c09ddd..12bb0b10e 100644
--- a/frontend/src/InteractiveImport/AlbumRelease/SelectAlbumReleaseRow.js
+++ b/frontend/src/InteractiveImport/AlbumRelease/SelectAlbumReleaseRow.js
@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
-import SelectInput from 'Components/Form/SelectInput';
+import EnhancedSelectInput from 'Components/Form/EnhancedSelectInput';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRow from 'Components/Table/TableRow';
 import shortenList from 'Utilities/String/shortenList';
@@ -55,7 +55,7 @@ class SelectAlbumReleaseRow extends Component {
             if (name === 'release') {
               return (
                 <TableRowCell key={name}>
-                  <SelectInput
+                  <EnhancedSelectInput
                     name={id.toString()}
                     values={_.map(releases, (r) => ({
                       key: r.id,
@@ -64,8 +64,8 @@ class SelectAlbumReleaseRow extends Component {
                         `, ${r.mediumCount} med, ${r.trackCount} tracks` +
                         `${r.country.length > 0 ? ', ' : ''}${shortenList(r.country)}` +
                         `${r.format ? ', [' : ''}${r.format}${r.format ? ']' : ''}` +
-                        `${r.monitored ? ', Monitored' : ''}` +
-                        `, [...${r.id.toString().slice(-4)}]`
+                        `${r.monitored ? ', Monitored' : ''}`,
+                      hint: `MBID: ${r.id.toString().slice(0, 8)}`
                     }))}
                     value={matchedReleaseId}
                     onChange={this.onInputChange}