New: Natural Sorting Manual Import Relative Paths

Closes #4956

frontend/src/Store/Actions/interactiveImportActions.js

@@ -3,6 +3,7 @@ import { createAction } from 'redux-actions';
 import { batchActions } from 'redux-batched-actions';
 import createAjaxRequest from 'Utilities/createAjaxRequest';
 import updateSectionState from 'Utilities/State/updateSectionState';
+import naturalExpansion from 'Utilities/String/naturalExpansion';
 import { createThunk, handleThunks } from 'Store/thunks';
 import { sortDirections } from 'Helpers/Props';
 import createSetClientSideCollectionSortReducer from './Creators/Reducers/createSetClientSideCollectionSortReducer';
@@ -38,7 +39,7 @@ export const defaultState = {
     relativePath: function(item, direction) {
       const relativePath = item.relativePath;
 
-      return relativePath.toLowerCase();
+      return naturalExpansion(relativePath.toLowerCase());
     },
 
     series: function(item, direction) {

frontend/src/Utilities/String/naturalExpansion.js

@@ -0,0 +1,11 @@
+const regex = /\d+/g;
+
+function naturalExpansion(input) {
+  if (!input) {
+    return '';
+  }
+
+  return input.replace(regex, (n) => n.padStart(8, '0'));
+}
+
+export default naturalExpansion;

frontend/src/Utilities/String/titleCase.js

@@ -1,9 +1,11 @@
+const regex = /\b\w+/g;
+
 function titleCase(input) {
   if (!input) {
     return '';
   }
 
-  return input.replace(/\b\w+/g, (match) => {
+  return input.replace(regex, (match) => {
     return match.charAt(0).toUpperCase() + match.substr(1).toLowerCase();
   });
 }