Fix: Aphrodite UI enhancements

* New: Display UI before movies have loaded

* Revised webpack bundling

* New: Option for production build with profiling

* Fixed: Faster hasDifferentItems and specialized OrOrder version

* Fixed: Faster movie selector

* Fixed: Speed up release processing, add indices (migration 161)

* Fixed: Use a worker for UI fuzzy search

* Fixed: Don't loop over all movies if we know none selected

* Fixed: Strip UrlBase from UI events before sending to sentry

Should mean that source maps are picked up correctly.

* Better selection of jump bar items

Show first, last and most common items

* Fixed: Don't repeatedly re-render cells

* Rework Movie Index and virtualTable

* Corresponding improvements for AddListMovie and ImportMovie

frontend/src/Activity/Blacklist/BlacklistRow.js

@@ -53,6 +53,10 @@ class BlacklistRow extends Component {
       onRemovePress
     } = this.props;
 
+    if (!movie) {
+      return null;
+    }
+
     return (
       <TableRow>
         {

frontend/src/Activity/History/History.js

@@ -24,6 +24,9 @@ class History extends Component {
       isFetching,
       isPopulated,
       error,
+      isMoviesFetching,
+      isMoviesPopulated,
+      moviesError,
       items,
       columns,
       selectedFilterKey,
@@ -34,7 +37,9 @@ class History extends Component {
       ...otherProps
     } = this.props;
 
-    const hasError = error;
+    const isFetchingAny = isFetching || isMoviesFetching;
+    const isAllPopulated = isPopulated && (isMoviesPopulated || !items.length);
+    const hasError = error || moviesError;
 
     return (
       <PageContent title="History">
@@ -71,12 +76,12 @@ class History extends Component {
 
         <PageContentBodyConnector>
           {
-            isFetching && !isPopulated &&
+            isFetchingAny && !isAllPopulated &&
               <LoadingIndicator />
           }
 
           {
-            !isFetching && hasError &&
+            !isFetchingAny && hasError &&
               <div>Unable to load history</div>
           }
 
@@ -91,7 +96,7 @@ class History extends Component {
           }
 
           {
-            isPopulated && !hasError && !!items.length &&
+            isAllPopulated && !hasError && !!items.length &&
               <div>
                 <Table
                   columns={columns}
@@ -130,6 +135,9 @@ History.propTypes = {
   isFetching: PropTypes.bool.isRequired,
   isPopulated: PropTypes.bool.isRequired,
   error: PropTypes.object,
+  isMoviesFetching: PropTypes.bool.isRequired,
+  isMoviesPopulated: PropTypes.bool.isRequired,
+  moviesError: PropTypes.object,
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   columns: PropTypes.arrayOf(PropTypes.object).isRequired,
   selectedFilterKey: PropTypes.string.isRequired,

frontend/src/Activity/History/HistoryConnector.js

@@ -10,8 +10,12 @@ import History from './History';
 function createMapStateToProps() {
   return createSelector(
     (state) => state.history,
-    (history) => {
+    (state) => state.movies,
+    (history, movies) => {
       return {
+        isMoviesFetching: movies.isFetching,
+        isMoviesPopulated: movies.isPopulated,
+        moviesError: movies.error,
         ...history
       };
     }

frontend/src/Activity/Queue/Queue.js

@@ -104,6 +104,9 @@ class Queue extends Component {
       isFetching,
       isPopulated,
       error,
+      isMoviesFetching,
+      isMoviesPopulated,
+      moviesError,
       items,
       columns,
       totalRecords,
@@ -122,8 +125,9 @@ class Queue extends Component {
       isPendingSelected
     } = this.state;
 
-    const isRefreshing = isFetching || isCheckForFinishedDownloadExecuting;
-    const hasError = error;
+    const isRefreshing = isFetching || isMoviesFetching || isCheckForFinishedDownloadExecuting;
+    const isAllPopulated = isPopulated && (isMoviesPopulated || !items.length || items.every((e) => !e.movieId));
+    const hasError = error || moviesError;
     const selectedCount = this.getSelectedIds().length;
     const disableSelectedActions = selectedCount === 0;
 
@@ -175,7 +179,7 @@ class Queue extends Component {
 
         <PageContentBodyConnector>
           {
-            isRefreshing && !isPopulated &&
+            isRefreshing && !isAllPopulated &&
               <LoadingIndicator />
           }
 
@@ -194,7 +198,7 @@ class Queue extends Component {
           }
 
           {
-            isPopulated && !hasError && !!items.length &&
+            isAllPopulated && !hasError && !!items.length &&
               <div>
                 <Table
                   columns={columns}
@@ -247,6 +251,9 @@ Queue.propTypes = {
   isFetching: PropTypes.bool.isRequired,
   isPopulated: PropTypes.bool.isRequired,
   error: PropTypes.object,
+  isMoviesFetching: PropTypes.bool.isRequired,
+  isMoviesPopulated: PropTypes.bool.isRequired,
+  moviesError: PropTypes.object,
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   columns: PropTypes.arrayOf(PropTypes.object).isRequired,
   totalRecords: PropTypes.number,

frontend/src/Activity/Queue/QueueConnector.js

@@ -12,11 +12,15 @@ import Queue from './Queue';
 
 function createMapStateToProps() {
   return createSelector(
+    (state) => state.movies,
     (state) => state.queue.options,
     (state) => state.queue.paged,
     createCommandExecutingSelector(commandNames.CHECK_FOR_FINISHED_DOWNLOAD),
-    (options, queue, isCheckForFinishedDownloadExecuting) => {
+    (movies, options, queue, isCheckForFinishedDownloadExecuting) => {
       return {
+        isMoviesFetching: movies.isFetching,
+        isMoviesPopulated: movies.isPopulated,
+        moviesError: movies.error,
         isCheckForFinishedDownloadExecuting,
         ...options,
         ...queue