Fix column to use lowercase data

NowPlayingView, ListView, and PlaylistView now properly sort by
lowercase, or if a non-string, by that datatype instead

src/api/api.ts

@@ -141,15 +141,11 @@ export const getPlaylists = async (sortBy: string) => {
           return a.changed > b.changed ? -1 : a.changed < b.changed ? 1 : 0;
         })
       : sortBy === 'name'
-      ? data.playlists?.playlist.sort((a: any, b: any) => {
-          if (a.name < b.name) {
-            return -1;
-          }
-          if (a.name > b.name) {
-            return 1;
-          }
-          return 0;
-        })
+      ? _.orderBy(
+          data.playlists.playlist || [],
+          [(entry) => entry.name.toLowerCase()],
+          'asc'
+        )
       : data.playlists?.playlist;
 
   return (newData || []).map((playlist: any) => ({

src/components/viewtypes/ListViewTable.tsx

@@ -134,13 +134,25 @@ const ListViewTable = ({
   useEffect(() => {
     if (!nowPlaying) {
       if (sortColumn && sortType) {
-        const actualSortColumn = columns.find((c: any) => c.id === sortColumn);
+        // Since the column title(id) won't always match the actual column dataKey, we need to match it
+        const normalizedSortColumn = columns.find(
+          (c: any) => c.id === sortColumn
+        );
         const sortColumnDataKey =
-          actualSortColumn.dataKey === 'combinedtitle'
+          normalizedSortColumn.dataKey === 'combinedtitle'
             ? 'title'
-            : actualSortColumn.dataKey;
+            : normalizedSortColumn.dataKey;
 
-        const sortData = _.orderBy(data, sortColumnDataKey, sortType);
+        const sortData = _.orderBy(
+          data,
+          [
+            (entry: any) =>
+              typeof entry[sortColumnDataKey] === 'string'
+                ? entry[sortColumnDataKey].toLowerCase()
+                : entry[sortColumnDataKey],
+          ],
+          sortType
+        );
         setSortedData(sortData);
       } else {
         setSortedData(data);

src/redux/playQueueSlice.ts

@@ -1,5 +1,6 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import _ from 'lodash';
+import { nanoid } from 'nanoid/non-secure';
 import arrayMove from 'array-move';
 import {
   areConsecutive,
@@ -243,7 +244,12 @@ const playQueueSlice = createSlice({
       if (action.payload.columnDataKey !== '') {
         state.sortedEntry = _.orderBy(
           state.entry,
-          action.payload.columnDataKey,
+          [
+            (entry: any) =>
+              typeof entry[action.payload.columnDataKey] === 'string'
+                ? entry[action.payload.columnDataKey].toLowerCase()
+                : entry[action.payload.columnDataKey],
+          ],
           action.payload.sortType
         );
       } else {
@@ -251,7 +257,6 @@ const playQueueSlice = createSlice({
       }
 
       const currentEntry = entrySelect(state);
-
       const newCurrentSongIndex = getCurrentEntryIndexByUID(
         action.payload.columnDataKey !== ''
           ? state.sortedEntry