Also use PureDatagridRow to speed up SongDatagrid

ui/src/common/SongDatagrid.js

@@ -1,6 +1,6 @@
 import React, { isValidElement, useMemo, useCallback } from 'react'
 import { useDispatch } from 'react-redux'
-import { Datagrid, PureDatagridBody, DatagridRow } from 'react-admin'
+import { Datagrid, PureDatagridBody, PureDatagridRow } from 'react-admin'
 import { TableCell, TableRow, Typography } from '@material-ui/core'
 import PropTypes from 'prop-types'
 import { makeStyles } from '@material-ui/core/styles'
@@ -96,13 +96,13 @@ export const SongDatagridRow = ({
           colSpan={childCount + (rest.expand ? 1 : 0)}
         />
       )}
-      <DatagridRow
+      <PureDatagridRow
         record={record}
         {...rest}
         className={clsx(className, classes.row)}
       >
         {fields}
-      </DatagridRow>
+      </PureDatagridRow>
     </>
   )
 }

ui/src/common/index.js

@@ -23,4 +23,5 @@ export * from './Title'
 export * from './SongBulkActions'
 export * from './useAlbumsPerPage'
 export * from './useInterval'
+export * from './useTraceUpdate'
 export * from './Writable'

ui/src/common/useTraceUpdate.js

@@ -0,0 +1,17 @@
+import { useRef, useEffect } from 'react'
+
+export function useTraceUpdate(props) {
+  const prev = useRef(props)
+  useEffect(() => {
+    const changedProps = Object.entries(props).reduce((ps, [k, v]) => {
+      if (prev.current[k] !== v) {
+        ps[k] = [prev.current[k], v]
+      }
+      return ps
+    }, {})
+    if (Object.keys(changedProps).length > 0) {
+      console.log('Changed props:', changedProps)
+    }
+    prev.current = props
+  })
+}