Fixed: UI Selector, Rendering Improvements

frontend/src/Store/Selectors/createArtistClientSideCollectionItemsSelector.js

@@ -0,0 +1,36 @@
+import { createSelector } from 'reselect';
+import createDeepEqualSelector from './createDeepEqualSelector';
+import createClientSideCollectionSelector from './createClientSideCollectionSelector';
+
+function createUnoptimizedSelector(uiSection) {
+  return createSelector(
+    createClientSideCollectionSelector('artist', uiSection),
+    (artist) => {
+      const items = artist.items.map((s) => {
+        const {
+          id,
+          sortName
+        } = s;
+
+        return {
+          id,
+          sortName
+        };
+      });
+
+      return {
+        ...artist,
+        items
+      };
+    }
+  );
+}
+
+function createArtistClientSideCollectionItemsSelector(uiSection) {
+  return createDeepEqualSelector(
+    createUnoptimizedSelector(uiSection),
+    (artist) => artist
+  );
+}
+
+export default createArtistClientSideCollectionItemsSelector;

frontend/src/Store/Selectors/createArtistLanguageProfileSelector.js

@@ -0,0 +1,16 @@
+import { createSelector } from 'reselect';
+import createArtistSelector from './createArtistSelector';
+
+function createArtistLanguageProfileSelector() {
+  return createSelector(
+    (state) => state.settings.languageProfiles.items,
+    createArtistSelector(),
+    (languageProfiles, artist) => {
+      return languageProfiles.find((profile) => {
+        return profile.id === artist.languageProfileId;
+      });
+    }
+  );
+}
+
+export default createArtistLanguageProfileSelector;

frontend/src/Store/Selectors/createArtistMetadataProfileSelector.js

@@ -0,0 +1,16 @@
+import { createSelector } from 'reselect';
+import createArtistSelector from './createArtistSelector';
+
+function createArtistMetadataProfileSelector() {
+  return createSelector(
+    (state) => state.settings.metadataProfiles.items,
+    createArtistSelector(),
+    (metadataProfiles, artist) => {
+      return metadataProfiles.find((profile) => {
+        return profile.id === artist.metadataProfileId;
+      });
+    }
+  );
+}
+
+export default createArtistMetadataProfileSelector;

frontend/src/Store/Selectors/createArtistQualityProfileSelector.js

@@ -0,0 +1,16 @@
+import { createSelector } from 'reselect';
+import createArtistSelector from './createArtistSelector';
+
+function createArtistQualityProfileSelector() {
+  return createSelector(
+    (state) => state.settings.qualityProfiles.items,
+    createArtistSelector(),
+    (qualityProfiles, artist) => {
+      return qualityProfiles.find((profile) => {
+        return profile.id === artist.qualityProfileId;
+      });
+    }
+  );
+}
+
+export default createArtistQualityProfileSelector;

frontend/src/Store/Selectors/createDeepEqualSelector.js

@@ -0,0 +1,9 @@
+import { createSelectorCreator, defaultMemoize } from 'reselect';
+import _ from 'lodash';
+
+const createDeepEqualSelector = createSelectorCreator(
+  defaultMemoize,
+  _.isEqual
+);
+
+export default createDeepEqualSelector;

frontend/src/Store/Selectors/createLanguageProfileSelector.js

@@ -1,4 +1,3 @@
-import _ from 'lodash';
 import { createSelector } from 'reselect';
 
 function createLanguageProfileSelector() {
@@ -6,7 +5,9 @@ function createLanguageProfileSelector() {
     (state, { languageProfileId }) => languageProfileId,
     (state) => state.settings.languageProfiles.items,
     (languageProfileId, languageProfiles) => {
-      return _.find(languageProfiles, { id: languageProfileId });
+      return languageProfiles.find((profile) => {
+        return profile.id === languageProfileId;
+      });
     }
   );
 }

frontend/src/Store/Selectors/createMetadataProfileSelector.js

@@ -1,4 +1,3 @@
-import _ from 'lodash';
 import { createSelector } from 'reselect';
 
 function createMetadataProfileSelector() {
@@ -6,7 +5,9 @@ function createMetadataProfileSelector() {
     (state, { metadataProfileId }) => metadataProfileId,
     (state) => state.settings.metadataProfiles.items,
     (metadataProfileId, metadataProfiles) => {
-      return _.find(metadataProfiles, { id: metadataProfileId });
+      return metadataProfiles.find((profile) => {
+        return profile.id === metadataProfileId;
+      });
     }
   );
 }

frontend/src/Store/Selectors/createQualityProfileSelector.js

@@ -1,4 +1,3 @@
-import _ from 'lodash';
 import { createSelector } from 'reselect';
 
 function createQualityProfileSelector() {
@@ -6,7 +5,9 @@ function createQualityProfileSelector() {
     (state, { qualityProfileId }) => qualityProfileId,
     (state) => state.settings.qualityProfiles.items,
     (qualityProfileId, qualityProfiles) => {
-      return _.find(qualityProfiles, { id: qualityProfileId });
+      return qualityProfiles.find((profile) => {
+        return profile.id === qualityProfileId;
+      });
     }
   );
 }