Fixed: Backend Updates from Sonarr

Co-Authored-By: Mark McDowall <markus101@users.noreply.github.com>
Co-Authored-By: taloth <taloth@users.noreply.github.com>

frontend/src/Components/Page/Header/MovieSearchInput.js

@@ -154,8 +154,33 @@ class MovieSearchInput extends Component {
   }
 
   onSuggestionsFetchRequested = ({ value }) => {
-    const fuse = new Fuse(this.props.movies, fuseOptions);
-    const suggestions = fuse.search(value);
+    const { movies } = this.props;
+    let suggestions = [];
+
+    if (value.length === 1) {
+      suggestions = movies.reduce((acc, s) => {
+        if (s.firstCharacter === value.toLowerCase()) {
+          acc.push({
+            item: s,
+            indices: [
+              [0, 0]
+            ],
+            matches: [
+              {
+                value: s.title,
+                key: 'title'
+              }
+            ],
+            arrayIndex: 0
+          });
+        }
+
+        return acc;
+      }, []);
+    } else {
+      const fuse = new Fuse(movies, fuseOptions);
+      suggestions = fuse.search(value);
+    }
 
     this.setState({ suggestions });
   }

frontend/src/Components/Page/Header/MovieSearchInputConnector.js

@@ -2,6 +2,7 @@ import { connect } from 'react-redux';
 import { push } from 'connected-react-router';
 import { createSelector } from 'reselect';
 import createAllMoviesSelector from 'Store/Selectors/createAllMoviesSelector';
+import createDeepEqualSelector from 'Store/Selectors/createDeepEqualSelector';
 import createTagsSelector from 'Store/Selectors/createTagsSelector';
 import MovieSearchInput from './MovieSearchInput';
 
@@ -26,9 +27,16 @@ function createCleanMovieSelector() {
           sortTitle,
           images,
           alternateTitles,
-          tags: tags.map((id) => {
-            return allTags.find((tag) => tag.id === id);
-          })
+          firstCharacter: title.charAt(0).toLowerCase(),
+          tags: tags.reduce((acc, id) => {
+            const matchingTag = allTags.find((tag) => tag.id === id);
+
+            if (matchingTag) {
+              acc.push(matchingTag);
+            }
+
+            return acc;
+          }, [])
         };
       });
     }
@@ -36,7 +44,7 @@ function createCleanMovieSelector() {
 }
 
 function createMapStateToProps() {
-  return createSelector(
+  return createDeepEqualSelector(
     createCleanMovieSelector(),
     (movies) => {
       return {