Use nodejs path alias to shrink the utils path for imports

src/main/webui/package.json

@@ -5,6 +5,9 @@
   "description": "Indy Repository Manager UI",
   "repository": "https://github.com/Commonjava/indy-ui-service",
   "license": "ASLv2",
+  "imports": {
+    "#utils/*": "./src/app/utils/*"
+  },
   "dependencies": {
     "bootstrap": "^5.3.2",
     "prop-types": "^15.8.1",

src/main/webui/src/app/components/content/common/PackageTypeSelect.jsx

@@ -16,7 +16,7 @@
 
 import React, {useState, useEffect} from 'react';
 import {PropTypes} from 'prop-types';
-import {jsonRest} from '../../../utils/RestClient.js';
+import {jsonRest} from '#utils/RestClient.js';
 
 export const PackageTypeSelect = ({pkgType,vauleChangeHandler}) =>{
   const [state, setState] = useState({

src/main/webui/src/app/components/content/common/StoreBasicSections.jsx

@@ -17,9 +17,9 @@
 import React from 'react';
 import {PropTypes} from 'prop-types';
 import {DisableTimeoutHint, PrefetchHint, Hint} from './Hints.jsx';
-import {Filters} from '../../../utils/Filters.js';
-import {Utils} from '../../../utils/AppUtils.js';
-import {TimeUtils} from '../../../utils/TimeUtils.js';
+import {Filters} from '#utils/Filters.js';
+import {Utils} from '#utils/AppUtils.js';
+import {TimeUtils} from '#utils/TimeUtils.js';
 
 export const StoreViewBasicSection = ({store})=>{
   let authoritativeIndexHints = "Make the content index authoritative to this repository";

src/main/webui/src/app/components/content/common/StoreBasicSections.test.jsx

@@ -18,7 +18,7 @@ import React from "react";
 import {render, screen, cleanup} from '@testing-library/react';
 import '@testing-library/jest-dom';
 import {StoreViewBasicSection} from "./StoreBasicSections.jsx";
-import {Utils} from "../../../utils/AppUtils.js";
+import {Utils} from "#utils/AppUtils.js";
 
 afterEach(() => {
   cleanup();

src/main/webui/src/app/components/content/common/StoreCapabilitiesSections.jsx

@@ -16,7 +16,7 @@
 
 import React from 'react';
 import {PropTypes} from 'prop-types';
-import {Filters} from '../../../utils/Filters.js';
+import {Filters} from '#utils/Filters.js';
 
 export const StoreViewCapabilitiesSection = ({store}) => (store.type==="remote"|| store.type==="hosted") &&
 <React.Fragment>

src/main/webui/src/app/components/content/common/StoreCapabilitiesSections.test.jsx

@@ -18,7 +18,7 @@ import React from "react";
 import {render, screen, cleanup, within} from '@testing-library/react';
 import '@testing-library/jest-dom';
 import {StoreViewCapabilitiesSection} from "./StoreCapabilitiesSections.jsx";
-import {Filters} from "../../../utils/Filters.js";
+import {Filters} from "#utils/Filters.js";
 
 afterEach(() => {
   cleanup();

src/main/webui/src/app/components/content/common/StoreControlPanels.jsx

@@ -17,8 +17,8 @@
 import React from 'react';
 import {useNavigate} from 'react-router-dom';
 import {PropTypes} from 'prop-types';
-import {Utils} from '../../../utils/AppUtils';
-import {jsonRest,http} from '../../../utils/RestClient';
+import {Utils} from '#utils/AppUtils';
+import {jsonRest,http} from '#utils/RestClient';
 
 const StoreViewControlPanel = function({store}){
   const handleEnable = () =>{

src/main/webui/src/app/components/content/common/StoreListingWidget.jsx

@@ -17,7 +17,7 @@
 import React, {Fragment} from 'react';
 import {Link} from 'react-router-dom';
 import {PropTypes} from 'prop-types';
-import {Utils} from '../../../utils/AppUtils.js';
+import {Utils} from '#utils/AppUtils.js';
 
 const LocalURLSection = ({storeKey}) => <div className="left-half">
     <label>Local URL:</label>{' '}

src/main/webui/src/app/components/content/common/StoreListingWidget.test.jsx

@@ -19,7 +19,7 @@ import {MemoryRouter} from 'react-router-dom';
 import {render, screen, cleanup} from '@testing-library/react';
 import '@testing-library/jest-dom';
 import {StoreListingWidget} from "./StoreListingWidget.jsx";
-import {Utils} from "../../../utils/AppUtils.js";
+import {Utils} from "#utils/AppUtils.js";
 
 afterEach(() => {
   cleanup();

src/main/webui/src/app/components/content/remote/RemoteList.jsx

@@ -19,8 +19,8 @@ import {ListJsonDebugger} from '../common/Debugger.jsx';
 import ListControl from "../common/ListControl.jsx";
 import {remoteOptionLegend as options} from "../../ComponentConstants.js";
 import {StoreListingWidget} from '../common/StoreListingWidget.jsx';
-import {Utils} from '../../../utils/AppUtils.js';
-import {jsonRest} from '../../../utils/RestClient.js';
+import {Utils} from '#utils/AppUtils.js';
+import {jsonRest} from '#utils/RestClient.js';
 
 const init = (state, setState) => {
   useEffect(()=>{

src/main/webui/src/app/components/content/remote/RemoteView.jsx

@@ -22,10 +22,10 @@ import {Hint, PasswordMask} from '../common/Hints.jsx';
 import {StoreViewBasicSection as BasicSection} from '../common/StoreBasicSections.jsx';
 import {StoreViewCapabilitiesSection} from '../common/StoreCapabilitiesSections.jsx';
 // import ViewJsonDebugger from './Debugger.jsx';
-import {Filters} from '../../../utils/Filters.js';
-import {Utils} from '../../../utils/AppUtils.js';
-import {TimeUtils} from '../../../utils/TimeUtils.js';
-import {jsonRest} from '../../../utils/RestClient.js';
+import {Filters} from '#utils/Filters.js';
+import {Utils} from '#utils/AppUtils.js';
+import {TimeUtils} from '#utils/TimeUtils.js';
+import {jsonRest} from '#utils/RestClient.js';
 
 const init = (pkgType, storeName, setState) => {
   const storeUrl = `/api/admin/stores/${pkgType}/remote/${storeName}`;

src/main/webui/src/content-browse/DirectoryListing.jsx

@@ -17,7 +17,7 @@
 import React, {useState, useEffect} from 'react';
 import {PropTypes} from 'prop-types';
 import {styles} from './style.js';
-import {jsonRest} from '../app/utils/RestClient.js';
+import {jsonRest} from '#utils/RestClient.js';
 
 const replaceUrl = url =>{
   if (url.includes("api/browse")){